Tutoriels sur Framework de Template Helix pour Joomla

Exigences du système Joomla

La plupart des hébergeurs et les systèmes d'installations personnelles sur Unix/Linux/Windows devraient être en mesure de recevoir Joomla 2.5 et Joomla 3.x dans des configurations très communes. Mais nous vous conseillons de vérifier les réglages suivants avant et non pas après que le problème soit apparu.

Serveur:

Logiciel: PHP 5.3.10 ou version ultérieure (mais 5.4 est plus recommandé)

Module Apache mod_rewrite (pour des URL courtes)

Base de données:

1. MySQL 5.1 ou supérieur

2. MSSQL 10.50.1600.1 ou supérieur

3. PostgreSQL 8.3.18 ou supérieur

Serveur Web:

1. Apache 2.x+

2. Microsoft IIS 7+

3. Nginx 1.0(1.1 recommandé)

Navigateur:

1. Firefox 29+

2. Google Chrome 30+

3. Opera 10+

4. Safari 5+

5. IE 10+

Environnement de développement :

Nous vous recommandons les configurations suivantes dans l'ordinateur servant au développement en local.

Windows:

1. Wamp Server

2. Xampp pour Windows

3. Jamp pour Windows

Linux:

1. Lamp Server

2. Xampp pour Linux

Mac OS:

1. Mamp et Mamp Pro

2. Xampp pour Mac OS

Comment installer le plugin Helix

Bien que Joomla soit livré avec un grand nombre de fonctions intégrées par défaut, avec les extensions, vous pouvez ajouter une toute nouvelle fonctionnalité à votre site en seulement quelques clics. Nos templates offrent de nombreuses fonctionnalités uniques mais ils requièrent que le framework Helix soit installé et activé.

Pour la plupart des extensions donc le plugin Helix, la procédure d'installation sera la même:

1. Téléchargez le package Plugin System Joomla 2.5&3 sur votre machine locale comme un paquet de fichier zip (~900Kb).
   Il s'agit d'un fichier plugin commun, compatible avec les deux versions de Joomla (3.x & 2.5).

2. La première chose que vous devez faire est de vous connecter à la zone administrative de votre site Joomla.

3. Dans le backend de votre site Joomla dans menu principal sélectionnez Extensions -> Installation

4. Cliquez sur le boutonParcourir et sélectionnez le package de plugin sur votre ordinateur.

5. Enfin, cliquez sur le bouton. Envoyer et installer

6. À ce stade, vous avez téléchargé et installé avec succès un plugin framework Helix JoomShaper. Mais les plugins ne sont pas activés par défaut, donc notre prochaine étape consistera à activer notre plugin helix.

7. Dans le menu du haut, survolez Extensions et cliquez sur Gestion des Plug-In. La fonction de filtre permet de trouver votre plugin helix plus rapidement.

8. Ensuite cliquez sur la case à cocher du plugin dans la liste ci-dessous et changez la valeur de statut vers activé.

9. Félicitations, vous venez de télécharger, installer et activer le plugin helix dans votre système Joomla!

Installation et modification de templates dans Joomla

À l'aide des fonctionnalités de Joomla, vous pouvez facilement changer le template de votre site Web à tout moment. Le changement de votre template vous permet d'explorer une variété de styles de design et de combinaisons de couleur, qui peuvent complètement changer le look et l'ambiance de votre site web. Dans ce tutoriel, nous allons vous apprendre à installer un nouveau template Joomla et le définir par défaut pour votre site web.

1. La première chose que vous avez besoin de faire est de télécharger sur votre disque local le nouveau template Joomla que vous voudriez utiliser dans votre site. Faites le tour des templates sur Joomshaper, vous y trouverez sûrement un template correspondant à votre goût.

2. Si votre site a déjà du contenu, vous pouvez installer uniquement le template et les modules. Quickstart est bon seulement pour les nouveaux sites Web parce que cela comprends le package Joomla lui-même.

3. Avant l'installation, vérifier la compatibilité, à savoir si la version téléchargée du template est compatible avec votre version de Joomla.
   
   

4. Une fois que vous avez votre template Joomla téléchargé sur votre ordinateur, connectez-vous à la zone administrative de votre site Joomla et téléchargez le template par le biais du gestionnaire d'extensions (Extensions -> Gestion des extensions).

   

5. Cliquez sur le bouton Parcourir et sélectionnez l'archive de template téléchargée précédemment. Enfin, cliquez sur Envoyer & installer.
   Après avoir installé le template, vous devriez recevoir un message "Template : installation effectuée avec succès.". À ce point, vous avez installé avec succès un nouveau template Joomla 3.x/2.5. Veuillez noter que ceci n'a pas activé votre nouveau template, vous devez encore le faire si vous voulez utiliser ce design.

6. Dès que le gabarit est installé dans votre système Joomla 3, vous devez configurer par défaut pour votre site afin que vos pages reçoivent le nouveau design. Tout d'abord, vous devez aller à Extensions -> Gestion des tempaltes. Maintenant, cochez la case près de son nom et cliquez sur Défaut.
   
   

7. Vous pouvez également affecter le nouveau modèle seulement à des sous-pages spécifiques (éléments de menu) - en utilisant l'option Assigner dans les paramètres.

8. Ne pas oublier d'installer le plugin système Helix - il doit être installé et activé pour que le template fonctionne correctement.

Remarque: Un Quickstart est avant tout un Joomla entièrement fonctionnel et complet contenant le CMS lui-même, tous les modules utilisés, les plugins et le template choisi avec le framework Helix avec toutes les configurations et les données que nous avons utilisées sur le site de démonstration en un seul endroit. Donc, fondamentalement, c'est du tout en un.

L'ensemble du processus d'installation est très simple et peut être considéré comme une installation normale de Joomla! (2,5 / 3.x), mais avec en plus toutes les extensions et leurs paramètres, et bien sûr du contenu de démonstration afin de faire correspondre parfaitement le template tel qu'il apparaît sur la page de démonstration de JoomShaper.

Voici le tutoriel qui vous dirigera vers le processus étape par étape l'installation d'un package Quickstart (Joomla 3.3 / 3.4):

Étape 1: Évidemment, la première chose que vous devez faire est de télécharger le pack de démarrage rapide avec nom du template choisi.

Étape 2: Prochaine étape, décompressez le fichier zip compressé (par exemple shaper_xeon_quickstart_j3.zip) dans un dossier sur votre disque dur.  Il est judicieux de créer un nouveau dossier qui contiendra le paquet téléchargé de QS. Maintenant vous devez décompresser le pack, sur toutes les versions modernes de OS, vous n'avez pas besoin de logiciels supplémentaires pour l'opération. Une fois l'extraction terminée, le dossier extrait contiendra tous les fichiers nécessaires pour effectuer l'installation de Joomla! Avec le modèle démo, images et modules et leurs paramètres respectifs enregistrés temporairement en fichiers .sql.

Étape 3: Avant l'installation, vous devriez vérifier si le serveur qui héberge votre compte répond à toutes les exigences du système Joomla!, surtout si vous avez l'intention d'installer la dernière version de Joomla! 3.x.

Étape 4: En utilisant votre logiciel FTP préféré (par exemple FileZilla), téléchargez tous les fichiers dans le répertoire où vous souhaitez installer votre nouveau projet Joomla !, tel que le serveur Web. Vous pouvez télécharger vos fichiers directement via cPanel également en utilisant le gestionnaire de fichiers. Le répertoire spécifique ou vous les téléchargerez dépendra si vous travaillez avec le domaine principal, un domaine complémentaire, ou un sous-domaine. Dans la plupart des cas, le dossier public_html est la racine web pour votre nom de domaine principal. Cela signifie que c'est le dossier dans lequel vous mettez tous les fichiers du site web que vous souhaitez voir apparaître quand quelqu'un tape votre nom de domaine principal. Selon la vitesse de téléchargement de votre connexion ou la configuration de votre serveur, ce processus de téléchargement peut prendre plusieurs minutes.

Étape 5: Ouvrez votre navigateur préféré et accédez à l'adresse ou à un répertoire sur votre serveur dans lequel vous effectuerez l'installation.
L'écran d'installation apparaîtra.

Étape 6: Sur cette page, vous devez configurer le nom du site, l'administrateur e-mail, nom d'utilisateur et le mot de passe administrateur. Les données d'administrateur seront nécessaires pour accéder au panneau d'administration. Veuillez ne pas utiliser "admin" comme nom d'utilisateur par défaut – ce n'est pas sûr. Les pirates peuvent effectuer une attaque par force brute sur votre compte en utilisant le nom d'utilisateur "admin" afin de récupérer votre mot de passe et d'accéder sur votre site web. En utilisant des noms d'utilisateurs non typiques vous êtes mieux protégé contre les attaques habituelles pour tenter d'avoir accès à votre site Web Joomla !.

Étape 7: Ensuite, vous pouvez appuyer sur le bouton « Suivant » bleu dans le coin supérieur droit. Vous serez redirigé vers l'écran de Configuration de base de données. Avant que nous puissions remplir tous les champs de formulaire, vous devrez créer une base de données MySQL/PostgreSQL, un utilisateur de base de données (et lui attribuer tous les privilèges) et le mot de passe dans le panel de l'hébergement. Sans exception toute installation Joomla ! et Wordpress exigent que la base de données soit créée en utilisant le jeu de caractères utf8_general_ci.

Remarque: Si vos paramètres ne sont pas corrects, vous pourriez être incapable de vous connecter à la base de données. Une option supplémentaire permets de changer le préfixe de la table. Il suffit de ne pas oublier de mettre le caractère de soulignement (_) à la fin du préfixe. Il vous sera proposé un préfixe par défaut aléatoire. Cela peut être utile pour des raisons de sécurité.

Une fois tous les champ de base de données complètés, cliquez sur le bouton suivant. L'installateur Joomla ! vérifiera maintenant s'il peut communiquer à la base de données. Si vous voyez un message d'erreur, vous avez probablement fait une faute de frappe lors de la saisie des informations de base de données ou vous avez oublié de créer une nouvelle base de données, veuillez donc vérifier ces détails.

Étape 8: La dernière page d'installation de Joomla contient toutes les informations sur l'installation.

La section est divisée en 4 groupes :

• Configuration principale : Toute information spécifique sur le site Internet, tel que le nom du site Internet, la description, nom d'utilisateur admin, etc.

• Configuration de base de données: Contient les renseignements sur la base de données que Joomla ! utilisera.

• Vérification de pré-installation: Ces exigences doivent toutes figurer comme Oui, sinon, vous ne serez pas en mesure d'installer Joomla ! À l'exception de la Version de PHP, le reste est généralement contrôlé dans le fichier php.ini. Vous pouvez avoir besoin de l'assistance de votre hébergeur dans la correction ou le contrôle de ces paramètres pour voir s'il est possible de les régler. Pour plus d'informations, voir le fichier de configuration de PHP.

• Paramètres recommandés: Ce sont des paramètres qui sont recommandés dans votre configuration de PHP, mais cela n'empêchera pas Joomla! d'être installé. Vous pouvez vous référer aux instructions ci-dessus sur la façon dont ils peuvent être modifiés.

Cela inclut les options (en haut) pour l'installation des exemples de données et les configurations de serveur (en bas).

Attention : le contenu de la démo n'est pas automatiquement installé.Donc si vous en avez besoin, vous devez cliquer aussisurInstall the Sample Data, cela vous aidera à apprendre à utiliser Joomla et helix

L'installateur du CMS gère également une série de vérifications du système et des serveurs pour s'assurer que Joomla sera en mesure d'être installé et de fonctionner correctement (vérifiezvotre écran).Si la moindre option n'est pas verte (ils vont être rouges et dire « Non ») alors vous aurez besoin de prendre des mesures pour les corriger. Rappelez-vous que ce sont les paramètres Joomla officiel recommandés. Si tout est correct et toutes les vérifications sont finies, vous pouvez maintenant cliquer sur le bouton Install dans le coin supérieur droit de l'Aperçu de la page. 

Étape 9: Appuyez sur la touche suivante pour installer le contenu de démonstration et terminer l'installation.

Étape 10: L'installation est terminée. Nous voici à  la dernière étape. Toutefois, avant de profiter de votre nouveau site Web, vous devez supprimer le dossier « installation ». Cliquez sur le bouton Remove Installation Directory (supprimer répertoire installation en version française). Ne le faites pas tout de suite car  :

Avant de supprimer le dossier d'installation, vous pouvez installer des langues supplémentaires à la fois pour le front-end et back-end. Si vous voulez ajouter des langues supplémentaires pour votre site Joomla! l'application, cliquez sur le bouton Install languages.

Maintenant, vous pouvez accéder à l'administration en cliquant sur administrator ou aller directement vers votre site en cliquant sur Site.

Pourquoi installer Helix en français ?

Par défaut HELIX est en Anglais.

Mais les développeurs ont codé le framework de manière à ce que l'utilisateur puisse bénéficier de sa propre langue.

Ainsi vous pourrez installer le language français pour vous vous même ou vos clients afin d'avoir une interface dans le language correspondant à celui choisi par l'utilisateur.

Où se trouve le fichier Langue ?

Le fichier langue anglais se trouve dans /language/en-GB et se nomme en-GB.tpl_shaper_helix3.ini

Pour fonctionner en français il devra être dans /language/fr-FR et se nommer fr-FR.tpl_shaper_helix3.ini

Vous pouvez effectuer l'opération vous même si vous en avez le courage et l'envie.

Mais WEB54 mets à votre disposition le fichier langue pour le template HELIX !

Téléchargez le fichier de traduction en français du framework de template Helix

Comment installer Helix en français ?

Une fois le fichier téléchargé, vous devrez l'installer directement via le gestionnaire d'extensions de Joomla!

Un message vous avertira de la bonne réussite de l'opération.

Pour vérifier allez dans votre template et constatez vous même que votre interface est en français.

Comment modifier le fichier langue ?

Votre fichier langue /language/fr-FR/fr-FR.tpl_shaper_helix3.ini est modifiable.

Vous pouvez donc utiliser un éditeur de type notepad+++ via votre ftp (clic droit --> afficher / éditer), modifier votre chaine de langue et le renvoyer sur votre serveur.

Vous pouvez aussi passer par la fonction de surcharge de langue de Joomla.

Les fonctionnalités impressionnantes de l'interface administration d'un template basé sur le Framework Helix V3 vous sont fournies avec des options pour configurer les caractéristiques principales d'un template.

Dès que vous êtes dedans, cela vaut réellement la peine de jeter un rapide coup d'œil aux options de configuration suivantes :

Layout Control (Contrôle de la mise en page)

Le site Internet peut être vu par différents appareils et variétés d'écrans.
Dans la section Basic, la largeur peut être contrôlée par des options de mise en page.
La largeur de mise en page peut être de 1170px ou 940px, choisissez également votre type de mise en page de site, soit fixe soit responsive.

Logo Type

La fonctionnalité Logo commande la visualisation du logo principal du template.
Vous pouvez régler votre logo sur image ou text type ou none (aucun).
Le logo peut être affiché dans des positions différentes.
Vous pouvez également définir la largeur et la hauteur du logo.
Vous pouvez aussi spécifier le titre du logo et le slogan du logo, si vous sélectionnez le type de logo comme texte.

Footer Settings (paramêtres du pied de page)

Par défaut, la section pied de page de cette mise en page est sur 2 colonnes.
La première colonne est footer1 et contient 8 span et l'autre colonne footer2 contenant 4 span.

Vous pouvez vous-même le personnaliser selon vos besoins et sélectionner la position où la section de pied de page sera publiée.
Les autres fonctions sont Copyright- depuis cette option, vous pouvez activer / désactiver l'affichage du texte de droit d'auteur et le texte droits d'auteur personnalisé à afficher, le Logo Helix V2 et les crédits Joomla. 
La fonction Copyright est destinée à contrôler la diffusion du texte du droit d'auteur veillant à ce que le droit d'auteur de votre site Web ne soit pas revendiqué par quelqu'un d'autre à votre insu.

Brand Info (Info marque)

L'équipe de Joomshaper est très fier de son framework Helix V3 et cela a une signification profonde pour l'équipe de Joomshaper de faire reconnaitre son travail. Vous pouvez afficher une information créditant Joomshaper et également un lien de validation HTML et CSS.

Goto Top Settings (réglages de la fonction gototop)

Vous pouvez sélectionner la fonction « gototop » qui contrôle l'affichage d'un lien/bouton qui, lorsque vous cliquez dessus, fait défiler en douceur la page vers le haut. De cette option vous pouvez activer/désactiver l'affichage du bouton Goto Top et choisir son positionnement.

Depuis Joomla 1.5, il y a eu des grands changements dans le Gestionnaire de templates Joomla !.
À l'heure actuelle dans Joomla 2.5 et Joomla 3.x vous ne pouvez pas simplement renommer un dossier de template en utilisant le FTP pour changer son nom, parce que l'information concernant le nom est stockée dans différents endroits. C'est parce que le template Joomla ! est traité comme une extension, donc certains renseignements sont dans la base de données ainsi que dans les dossiers et le nom de dossier de langue.

Il y a quelques solutions qui peuvent vous aider pour cela, mais ici nous vous montrerons la méthode la plus simple, en utilisant un nouveau package de template depuis JoomShaper venant juste d'être téléchargé de notre section de téléchargement. Veuillez suivre ces étapes :

1. Renommez le fichier zip, par exemple à partir de "shaper_onepage_template_only_j3.zip" vers "new_template_only_j3.zip".

2. À partir de la version dezippée du fichier templateDetails.xml de votre package - pour modifier le fichier xml utilisez votre éditeur de texte favori (Notepadd++ ou autres semblables). Rebaptisez alors le template à l'intérieur.
   à partir de :

   		<name>shaper_onepage</name> 
   		

   vers (par exemple):

    <name>new</name>

3. Également dans templateDetails.xml vous pouvez changer la description du template.
   

4. Renommez le nom de fichier de langue en fonction du nouveau nom de template, par exemple, de :

<language
tag="en-GB">en-GB.tpl_shaper_onepage.ini</language>

vers

<language
tag="en-GB">en-GB.tpl_new.ini</language>

5. Enregistrez les modifications, puis copier à l'intérieur du package de template le fichier templateDetails.xml modifié.

6. Décompressez depuis le package du tempalte le fichier de langue,  Renommez le fichier de langue selon le nouveau nom, par exemple, en-GB.tpl_new.ini et copiez dans template zip (recompressez).Et évidemment vous pouvez effacer le fichier de langue avec le vieux nom, vous n'en avez plus besoin.
7.Installez ce template comme un nouveau template et définissez le par défaut. N'ayez pas peur que ce soit indépendant de celui d'origine même si vous avez utilisé QuickStart auparavant.

Souvenez-vous que le gabarit rebaptisé ne pourrait pas avoir tous les paramètres de quickstart donc vous devez les mettre manuellement comme ils ont dans "l'ancien" en les regardant et les comparant. Ainsi, si vous utilisez QS désinstallez le vieux template après avoir réécrit tous les paramètres.

Note: Si vous voulez changer le nom du template après l'installation cela demande des changements non seulement dans les fichiers mais aussi dans la base de données.