Mon blog – Partie 13 – Créer son thème WordPress – Autres Templates

admin — Thu, 08 Dec 2011 14:24:42 +0000

Erreur 404
Le template 404.php est utilisé quand un lien est fait vers une page qui n’existe pas. Je me suis contenté du minimum, afficher sur une page le message « Erreur 404 page non trouvée ». Cette page est néanmoins complète. Elle est construite simplement à partir du template index.php. Elle permet ainsi de se rebrancher facilement sur les pages du blog et de poursuivre la recherche.

Liens vers les réseaux sociaux, flux de syndication, contact
J’ai regroupé dans un template appelé social.php tous les liens vers les réseaux et médias sociaux, les flux de syndication de contenu, ma boîte aux lettres. Ces liens sont affichés en barre sous forme d’ icônes normalisés. Je les ai placé dans un template pour les raisons suivantes:
- un seul fichier à maintenir,
- possibilité de les utiliser en plusieurs emplacements de la page,
- suppression ou ajout de nouveaux icônes simplifié.

Les icônes sont placés dans /montheme/images/social .

Avec l’éditeur de texte ouvrir le nouveau fichier social.php, insérer dans ce fichier les lignes suivantes:


    /images/social/facebook.png" height=32 width=32 alt="Facebook" title="Facebook" />
    /images/social/twitter.png" height=32 width=32 alt="Twitter" title="Twitter" />
    /images/social/gplus.png" height=32 width=32 alt="Gplus" title="Google Plus" />
    /images/social/linkedin.png" height=32 width=32 alt="LinkedIn" title="LinkedIn" />
    /images/social/youtube.png" height=32 width=32 alt="YouTube" title="YouTube" />
    /images/social/googlemaps.png" height=32 width=32 alt="Google Maps" title="Google Maps" />
    /images/social/email.png" height=32 width=32 alt="E-mail" title="" />
    /images/social/rss.png" height=32 width=32 alt="RSS articles" title="" />
    /images/social/rsscomment.png" height=32 width=32 alt="RSS comment" title="" />

Afficher la barre d’ icônes
Pour des raisons pratiques, la barre est placée en haut et en bas de page, dans le header et en fin d’article. Elle est habillée d’une classe de style icons .

Avec l’éditeur de texte ouvrir le fichier header.php. Sous la balise , insérer les lignes suivantes:

La fonction get_template_part() charge ce template soit à partir de social-header.php (n’ existe pas) soit ici à partir de social.php.

Avec l’éditeur de texte ouvrir le fichier single.php. Sous la balise , insérer les lignes suivantes:

Avec l’éditeur de texte ouvrir le fichier style.css. En fin de fichier, insérer les lignes suivantes:

/* Social Icons  */

#social {
padding: 0.5em 0 0 0;
}

.icons a img {
opacity:.7;filter:alpha(opacity=50);
}

.icons a:hover img {
opacity:1;filter:alpha(opacity=100);
}

Enregistrer les fichier sous /themes/montheme.

Presser CTRL+SHIFT+R (sous Firefox) pour vider le cache du navigateur et rafraichir l’écran.
Tester les liens. C’est terminé.

Télécharger les fichiers de cette partie et les copier sous /themes/montheme .

Mon blog – Partie 10 – Créer son thème WordPress – Template Single

admin — Mon, 05 Dec 2011 08:41:06 +0000

Objet
A ce stade du développement de notre thème si vous cliquez sur le titre de l’article pour afficher son contenu, vous remarquez qu’il manque la possibilité d’introduire un commentaire et la navigation d’un article à l’autre, bien pratique pour suivre une série d’articles traitant du même sujet. Comme pour les templates archive et search, plusieurs solutions sont possibles:
- utiliser le template index et ajouter des instructions conditionnelles qui déterminent dans quel contexte on se trouve,
- utiliser le template single qui est la copie du template index modifié.
L’avantage de la première solution est de n’avoir qu’un seul template à maintenir. La seconde solution est intéressante si vous voulez personnaliser la page. La programmation de l’index devient alors plus complexe et moins facile à maintenir.
Nous allons utiliser cette dernière solution.

Fichier single.php
Avec l’éditeur de texte ouvrir un nouveau fichier single.php. Copier dans ce fichier le contenu de index.php.
Modifier la division navigation, entre les balises

de façon suivante:

Juste avant insérer la fonction:

Enregistrer le fichier sous /themes/montheme.
Presser CTRL+SHIFT+R (sous Firefox) pour vider le cache du navigateur et rafraichir l’écran.
Vérifier l’affichage du bloc commentaire soit en cliquant sur le nombre de commentaires de l’article dans la page index, soit en cliquant sur le titre de l’article dans la page index pour en afficher le contenu. Remarquez aussi en bas de page, la navigation sur l’ article précédent et suivant.

Télécharger les fichiers de cette partie et les copier sous /themes/montheme .

F8EOZ » single

Mon blog – Partie 13 – Créer son thème WordPress – Autres Templates

Mon blog – Partie 10 – Créer son thème WordPress – Template Single