Dans cet article nous allons regarder comment transformer un thème gratuit HTML pour le rendre utilisable dans PluXml.
Nous trouvons sur html5up.net le thème "MASSIVELY" qui peut convenir à PluXml.
A première vue, il y manquera au moins la liste vers les "catégories" et un fil d’Ariane .Il faudra aussi prévoir l'affichage des commentaires
si l'on veut garder une certaine inter-action avec les visiteurs. Pour le reste nous nous conformerons au thème.
Ce thème est livré avec des images neutres colorées. Il faudra personnaliser l'image de fond principale.
Le thème est sous licence, licence que nous conserverons dans les fichiers et mention du thème ainsi que le lien vers son site d'origine.
Lire la suite de créer un thème - étape integration 01
La création d'un thème n'est pas aussi difficile qu'il n'y parait., il y a quelques règles à suivre et à connaître pour qu'il soit reconnu par PluXml et qu'il fonctionne dans tout les modes d'affichage de PluXml.
La premiere étape est de créer un nouveau dossier pour votre théme dans le dossier themes/
de PluXml.
Ces règles concernent principalement des noms de fichiers que PluXml va utiliser selon la page demandée, la première étape est donc de connaître et respecter ces règles en faisant l'inventaire ces fichiers requis dans un premier temps avant de les créer.
Un premier travail de préparation est nécessaire pour mettre en place votre projet de création de thème en créant simplement ces fichiers requis et en les laissant vide pour commencer. Ces fichiers sont à placer dans le dossier que vous avez créer pour votre thème.
Lire la suite de créer un thème - étape fichiers 01
Second volet de la série créer un thème.
Dans ce second volet nous ferons un inventaire des fichiers nécessaires et utiles.
Certains fichiers doivent être obligatoirement présent, c'est le cas par exemple de infos.xml
pour qu'il soit disponible depuis l'administration.
Les fichier embarquent des parties de la page, il faut donc commencer par créer un squelette à découper et à redistribuer dans ces fichiers. La reconstruction est faites au moment d'afficher une page.
Trions nos fichier et dossiers pour y voir plus clair et passer aux étapes suivantes:
Dossier de votre thème |
Mode d'affichage fichiers obligatoires |
fichiers accessoires aux differents modes |
Autres utiles, administration |
Sous-Dossiers utiles et conseillés |
- home.php
- article.php
- categorie.php
- static.php
- tag.php
- archive.php
- erreur.php
|
- header.php
- sidebar.php
- footer.php
- ...
- commentaires.php
- articles.php optionnel
|
- infos.xml obligatoire
- ...
- index.html utile
- preview.png utile
- preview.jpg utile
|
- lang/ langues et aide
- font/ conseillé pour y stocker
vos polices
- css/ conseillé pour y stocker
vos feuilles de styles
- img/ conseillé pour y stocker
les images du thème
- js/ conseillé pour y stocker
vos scripts
|
Lire la suite de créer un thème - étape fichiers 02
Dans cet article nous allons éditer et compléter les deux fichiers header.php
et footer.php
afin d'afficher l'entête, la navigation principale et le pied de page de votre site.. Ce sont les parties de pages généralement identiques sur un site.
Les quelques différences que l'ont peut malgré tout trouver dans ces parties de code commune sont généralement:
- le titre de la page affichée dans l'onglet du navigateur
- Une class ou une id qui permet d'identifier le mode d'affichage, type de page
- la navigation qui met le lien vers la page en cours en évidence,
- les balises meta pour
description, keywords, author
,
- Le titre de la page,
- et autres données non visuelles.
Ces différences étant gérer par PluXml, il n'y a pas lieu de s'en inquiéter.
Lire la suite de créer un thème - étape fichiers 03
Nous avons à ce stade de cette série d'articles,du code dans nos fichiers et un thème en partie fonctionnel qui n'affiche pas encore les contenus.
Dans cet article, nous allons remplir la page d'accueil home.php
(ou la page blog si votre PluXml a une page statique en accueil) et afficher les contenus des articles article.php
.
rappel
la structure actuelle choisie pour construire nos fichier est:
<header></header>
<main> <!-- c'est ici que le code de nos deux fichiers vont s'afficher --> </main>
<footer></footer>
Nos gabarits de contenus sont actuellement construit comme ceci:
<?php if(!defined('PLX_ROOT')) exit; ?>
<?php include __DIR__.'/header.php'; ?>
<!-- ici viendront le HTML et les fonctions d'affichage de Pluxml / cette parie est contenu dans la balise main -->
<?php include __DIR__.'/footer.php'; ?>
Lire la suite de créer un thème - étape fichiers 04
Dans cet article nous allons finalisé nos gabarits pour les modes : catégorie, mots clés et archive. Leurs fonctionnement est très similaire au mode home/blog et ce qui diffère sera ce que l'on appelle le "fil d’Ariane" qui aide à se situer dans l'arborescence d'un site.
Nous commençons donc par éditer à nouveau le fichier home.php
pour en extraire la partie affichant les article et la pagination dans un nouveau fichier de gabarit que nous nommerons articles.php
.
Lire la suite de créer un thème - étape fichiers 05
Les gabarits static.php
et erreur.php
reprennent la base des autres gabarits de mode de PluXml avec un minimum de code pour afficher un titre et le contenu.
Pour avoir une compatibilité avec les gabarits alternatif de PluXml, nous allons aussi recréer ces fichier a partir desquelles, le fichier d'origine sera inclus.
Le fichier sidebar.php
sera repris à l'identique du thème par défaut avec quelques explications. Il sera inclus à partir des gabarits mode de PluXml. Certains de ces fichiers peuvent être déclinés en versions alternatives. Nous aurons à partir des alternatifs donc le choix de l'inclure , d'inclure une version modifiée ou ne pas l'inclure.
Lire la suite de créer un thème - étape fichiers 06
Dans le précédent article nous avons vu comment lié une feuille de style aux fichiers du thème.
Pour accéder à un fichier du thème la fonction <?php $plxShow->template() ?>
donne le chemin vers le thème actif. Cette fonction vous sera utile pour intégrer à votre thème les ressources CSS, JavaScript, images, etc. qu'il contient.
Pour des mise en page simple et peu de fonctionnalités, l'usage d'une seule feuille de style peut sembler suffisant. Ce n'est plus le cas si vous souhaitez par exemples utiliser une famille d'icône, un framework CSS, un fichier reset , etc.
L'avantage d'utiliser des ressources gratuites (ou payantes) est que celles-ci seront généralement maintenues par leurs auteurs respectifs et que des tutoriels et exemples sont souvent fournis sur les sites officiels des ressources. Un autre aspect est que d'autres utilisateurs pourront aux travers de tutoriels et de forums vous aider à utiliser ces ressources ou à choisir entre des ressources similaires ou des version différentes.
Lire la suite de créer un thème - étape styles 02
Fil RSS des articles de ce mot clé