Il existe de nombreux tutoriels en ligne qui expliquent comment faire un template en HTML. Je vous présente un tutoriel simple pour créer un template pour joomla 3.X , à condition d'avoir une bonne compréhension de xHTML et CSS. Avec ce tutoriel vous pouvez convertir un template HTML/CSS , ou tout autre template pour Joomla 3 .
Étape 1 :La majorité des concepteurs de sites Web doit utiliser un modèle qui ils ont conçu . À ce stade, je suppose que vous avez déjà conçu votre modèle et codé en place en utilisant le CSS et XHTML. Votre modèle ne nécessite pas de contenu, simplement parce que Joomla 3.0 va peupler votre site web pour vous.
Étape 2 :Ensuite, vous devez télécharger les fichiers suivants, qui dispose d'un template Joomla 3 mise en page prédéfinie de :
Télécharger les fichiers sources de template
Étape 3 : Ensuite, vous devez ouvrir votre éditeur html, Dreamweaver ou notepad++ ...
Ouvrez les fichiers suivants: De votre template:
- votre page principale, généralement index.html
- votre principale feuilles de style css
Du template vierge Joomla 3 que vous avez télécharger :
- index.php
- css / template.css
Étape 4 : de votre mise en page principale (index.html), sélectionnez tout le contenu à l'intérieur des balises body. Voici un exemple :
Ensuite, vous devez coller votre texte copié entre les balises du corps du fichier index.php lequel vous avez téléchargé plus tôt.
Étape 5: Vous devez maintenant ouvrir votre feuille de style CSS et copiez tout son contenu. Suivant coller l'ensemble de son contenu dans le fichier css /template.css.
Étape 6: Félicitations, vous avez maintenant créé un template Joomla 3 , cependant , c'est pas encore terminé, vous avez maintenant à attribuer les positions.
Maintenant, ouvrez votre fichier index.php du template Joomla 3.0.
Vous devez trouver l'endroit où vous allez placer le menu de navigation principale et insérez la ligne suivante où il devrait être. (au-dessous de la ligne indique une position du module)
<jdoc:include type="modules" name="navigation" style="raw" />
Vous devez également décider où doit être situé le début de votre nombre de corps contenu, une fois que vous le trouvez, insérez les deux lignes de code suivantes :
<jdoc:include type="message" />
<jdoc:include type="component" />
Vous pouvez aussi avoir des positions secondaires pour l'insertion de modules à votre site Web, par exemple un pied de page. Pour ce faire, insérer la ligne de code suivante et remplacer "insérer un nom ici" avec le nom de votre position, par exemple pied de page.
<jdoc:include type="modules" name="INSERT NAME HERE" style="xhtml" />
pour permettre à votre nom secondaire à apparaître dans la liste des modules , vous devez ouvrir templateDetails.xml dans votre éditeur html. Faites défiler vers le bas et sous mainmenu
créer une nouvelle ligne appelée
<position>INSERT NAME HERE</position>
Vous pouvez le faire autant de fois que nécessaire, pour autant de module nécessaire, ceux-ci seront accessibles lors de la mise en place des modules de Joomla 3.0.
Étape 7 :Maintenant, ce est une autre étape simple, il faut prendre toutes les images à partir de votre dossier d'origine, et de copie /coller dans le dossier images dans le fichier de template Joomla 3 que vous avez téléchargé. Se il vous plaît se assurer que tous vos liens d'image dans vos fichiers CSS et HTML sont correctement configurés.
Étape 8 : Faire l'ensemble du site dossier dans un fichier .zip, et utilisez le gestionnaire d'extensions au sein d'administration de Joomla pour installer le zip. Votre template est créé, n'oubliez pas de le définir comme le modèle par défaut!