Qu’est ce qu’un template Oxygen ?

Un template est un modèle de mise en page. Pour faire simple, le template va être l’habillage d’un type de publication ou d’une archive de publication par exemple. Plus concrètement, les templates d’Oxygen Builder peuvent être utilisés pour les mises en page de la page de présentation des produits, des articles, des pages spéciales ou encore des pages Error 404 ou des résultats de recherche. 

Les templates du plugin WordPress Oxygen Builder sont donc des modèles de page ou de blocs qui peuvent être utilisés sur plusieurs types de postes. On peut également voir les templates comme des gabarits de pages.

Dans votre projet web, le header et le footer sont souvent identiques pour l’ensemble des pages de votre site. De fait, il faudra créer un template Oxygen que l’on appellera par exemple “Template principal”.

Ce template Oxygen Builder regroupera le header et le footer afin qu’ils puissent être affichés sur tous les types de postes de votre site. Il est également possible de faire un template Oxygen pour que les articles aient la même apparence. On peut également créer un template Oxygen pour configurer l’apparence de la page 404, ou la page des résultats de recherche, ou même une page particulière, tout ce qui compose votre site.

Pourquoi utiliser des templates avec Oxygen Builder ?

Utiliser un template avec Oxygen Builder permet de pouvoir créer un design personnalisé qui peut s’appliquer sur plusieurs types de postes à la fois :

Ainsi, si vous avez besoin de modifier ou de supprimer un élément présent sur tous les articles, vous n’aurez pas besoin de le faire article par article si vous avez créé un template Oxygen associé au type de poste Article.
Modifiez ou supprimez cet élément sur le template concerné et cela s’appliquera sur tous les articles.

Telle est la principale utilité d’un template avec Oxygen Builder : faciliter la maintenance et gagner un temps considérable.

Les différents types de templates Oxygen Builder

Comme nous l’avons dit plus tôt dans cet article, il est possible de créer des templates avec Oxygen Builder pour tout type de publication.

Voici ce qu’Oxygen Builder nous propose :

oxygen builder ce template s applique aux articles
Liste des types de postes “singuliers” auxquels votre template peut s’appliquer. Attention : cette liste va différer en fonction des types de posts présents sur votre site WordPress.
oxygen builder templates archives oxygen builder
Ou encore, ici vous pouvez choisir sur quelles archives vous pouvez faire appliquer votre template.
oxygen builder templates autres oxygen builder
Et enfin, ceux-ci sont les types de postes plus spécifiques comme la fameuse page 404, la page des résultats de recherche, etc.

Pour créer un nouveau template ou voir ceux existants, il vous faut aller dans l’onglet “Oxygen” du menu latéral gauche de votre interface WordPress, puis cliquer sur Templates.D’ici, vous retrouverez la liste de l’ensemble des templates déjà existant.

oxygen builder liste des templates
Liste des templates dans Oxygen

Puis, ajoutez un nouveau template.

oxygen builder ajouter un nouveau template
Pour ajouter un template Oxygen, cliquez sur le bouton « Add new remplate »
oxygen builder créer un nouveau template
Le choix d’où s’appliquera votre template se trouve ici. Mais nous allons voir cela plus en détail un peu plus loin dans cet article.

Comment créer un template avec Oxygen Builder ?

Tout d’abord, ajoutez un nouveau template.

oxygen builder ajouter un nouveau template
oxygen builder ajout d un nouveau template
Pour choisir le nom de votre template, mettez entre crochets que c’est un template. En effet, vous pourrez, visuellement, mieux vous y retrouver dans la liste des templates car les blocs réutilisables se trouvent aussi dans cette liste.
Le reste du nom de votre template illustrera sur quel type de publication prendra effet ce dernier.
oxygen builder nom du template et l enregistrer
Prenons exemple sur un template qui sera effectif sur les articles de votre site.
Ainsi, son nom sera : “[Template] – Template articles”. Ce sera le gabarit d’un article.
oxygen builder ajouter le design d un autre template
Cette option vous donne le choix d’intégrer un template déjà existant dans celui que vous êtes en train de créer. 
Comme nous créons un template pour les articles, il y aura besoin du header et du footer principal du site, donc nous pouvons y intégrer le template principal qui les contient.
oxygen builder template principal intégré
Nous voulons que le template ne s’applique qu’aux articles du site. Pour cela, dans l’onglet “Singular”, il va falloir cocher “Articles” et le template s’appliquera automatiquement qu’aux articles.

Il nous reste le réglage “Priority Template”. Si plusieurs templates peuvent s’appliquer, le template avec le chiffre de priorité le plus haut sera utilisé en priorité.
Enfin, enregistrez votre template, vous pouvez l’enregistrer en brouillon ou directement le publier. Une fois enregistré, vous aurez enfin accès au contenu du template.

oxygen builder accéder au contenu du template
Pour accéder au contenu du template, cliquez sur le bouton “Edit with Oxygen”. A noter que ce bouton n’apparaît qu’une fois que vous avez enregistré votre template.

Le principe est simple : intégrer le design et ajouter des éléments qui afficheront le contenu de vos articles.

Ajoutons dans une section le widget “titre” dans lequel nous allons mettre le titre de nos articles.

oxygen builder ajout du titre de l article
Jusque là rien d’extraordinaire, nous avons juste ajouté le widget de titre dans une section en cliquant sur le bouton “+” en dans le coin haut gauche de votre interface.

Mais pour que ce titre soit dynamique, c’est-à-dire qu’il affiche le titre de l’article sur lequel nous avons cliqué, une petite manipulation reste à faire.

D’ailleurs, une fois avoir compris cette petite manipulation, vous saurez comment faire pour le reste du contenu ou pour toute autre data dynamique.

oxygen builder selection du texte et insérer data
Sélectionnez le texte concerné, ici le titre, et cliquez sur le bouton “Insert Data” en haut de votre interface.
oxygen builder insérer la data dynamique titre
Une fois avoir cliqué sur le bouton “Insert Data” cette fenêtre s’affichera. Nous voulons que soit affiché le titre des articles. Alors prenons la data dynamique “Title” dans la section “Post” (“Post” est le nom anglais pour “Article” sur WordPress).
oxygen builder options de titre
Il vous sera ensuite demandé si vous souhaitez que ce titre soit cliquable ou non. Pour cet exemple, nous ne le voulons pas, donc on va laisser décoché et cliquer sur le bouton “Insert”.
oxygen builder previewing article 3
Comme nous sommes en train de travailler sur un template, nous avons besoin de voir le résultat en direct sur un article existant. Ici, nous voyons comment s’afficherait l’article nommé “Article 3”. Pratique.

Ajoutons, sous le titre, la date de création de l’article.

oxygen builder selection du texte pour la date
Pour cela, même manipulation que précédemment : sélectionnons le texte puis cliquons sur le bouton « Insert Data”.
oxygen builder ajoutons la data dynamique de la date de création de l article
Choisissons la data dynamique de la date de création de l’article.
oxygen builder date de création de l article
Voici l’affichage de la date de création de l’article 3.

Enfin, ajoutons le contenu entier de l’article. Comme je vous l’avais dit, une fois avoir compris la manipulation à faire, cela sera la même chose pour toute data dynamique.

Donc, ajoutons le widget “Text”.

Sélectionnons-le puis cliquons sur “Insert Data”.

oxygen builder selection du texte et insérer data
Choix de la data à insérer dans le widget Text d’Oxygen Builder

Choisissons la data dynamique “Content” pour le contenu de l’article.

oxygen builder ajouter la data content au template

Et le template affichera le contenu de votre article.

oxygen builder a quoi ressemble l article 3
Voilà à quoi ressemble maintenant l’article 3.

Voyons pour les autres articles, puisque ce template s’applique sur tous les articles.

oxygen builder a quoi ressemble l article 2
L’article 2 utilise bien le template que nous venons de créer, nous voyons bien son titre, avec sa date de création, et son propre contenu.

Le template fonctionne à merveille !

Bien-sûr vous pouvez ajouter d’autres éléments dynamiques et personnaliser vos articles à votre guise.

C’est sur ces mots que se termine cet article.

J’espère que cet article sur les templates avec Oxygen Builder vous aura aidé.

Si vous ressentez que vous avez besoin d’approfondir vos connaissances sur Oxygen Builder, ou si vous faites face à une problématique spécifique, n’hésitez pas à me contacter. Je vous répondrai dans les meilleurs délais.

Je vous souhaite une bonne navigation !