<section> Gutenberg…
Si à première vue il semble intuitif d’utiliser la structure en blocs que proposera le nouvel éditeur Gutenberg, certaines choses ne me semblent pas encore possibles, comme par exemple placer dans un même élément <section> un ensemble de paragraphes correspondant à un titre donné.
Je suis tellement habitué à écrire directement mes pages en HTML, que la première solution qui s’impose à moi est d’utiliser
Le bloc HTML
Partons d’un cas concret, un article sur la manière d’organiser les photos.
Voici ce que je suis tenté de faire:
<!-- wp:html -->
<section>
<h2>Les bases : nommer ses photos</h2>
<p>Depuis toujours, pour faciliter le tri naturel de mes dossiers, je les nomme de la manière suivante: <var>YYYY_MM_DD</var></p>
<ul>
<li><var>YYYY</var>: l'année en quatre chiffres</li>
<li><var>MM</var>: le mois en deux chiffres</li>
<li><var>DD</var>: le jour en deux chiffres</li>
</ul>
<p>J'utilise le caractère de soulignement (_) pour séparer les groupes, mais j'aurais pu choisir le tiret, un autre caractère, ou rien du tout (mais alors on perd en lisibilité).</p>
<p><q>Souvent, j'ajoute le contexte (par exemple le lieu) après la date, pour m'y retrouver encore plus facilement.</q></p>
<p>Cette utilisation de la date sous le format <var>YYYY_MM_DD</var> fait que l'explorateur de fichier les affiche naturellement triés chronologiquement.</p>
</section>
<!-- /wp:html -->Remarque : les parties <!-- wp:html --> et <!-- /wp:html --> ne sont visibles que en mode « éditeur de code ».
Si je décide d’utiliser les blocs prévus, voici ce que cela donne :
<!-- wp:group -->
<div class="wp-block-group"><div class="wp-block-group__inner-container">
<!-- wp:heading -->
<h2>Les bases : nommer ses photos</h2>
<!-- /wp:heading -->
<!-- wp:paragraph -->
<p>Depuis toujours, pour faciliter le tri naturel de mes dossiers, je les nomme de la manière suivante: <var>YYYY_MM_DD</var></p>
<!-- /wp:paragraph -->
<!-- wp:list -->
<ul><li><var>YYYY</var>: l'année en quatre chiffres</li><li><var>MM</var>: le mois en deux chiffres</li><li><var>DD</var>: le jour en deux chiffres</li></ul>
<!-- /wp:list -->
<!-- wp:paragraph -->
<p>J'utilise le caractère de soulignement (_) pour séparer les groupes, mais j'aurais pu choisir le tiret, un autre caractère, ou rien du tout (mais alors on perd en lisibilité).</p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p><q>Souvent, j'ajoute le contexte (par exemple le lieu) après la date, pour m'y retrouver encore plus facilement.</q></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p>Cette utilisation de la date sous le format <var>YYYY_MM_DD</var> fait que l'explorateur de fichier les affiche naturellement triés chronologiquement.</p>
<!-- /wp:paragraph --></div></div>
<!-- /wp:group -->Voilà qui me semble assez surchargé à priori…
Mais ce n’est que le code qui s trouve dans l’éditeur! En réalité, WordPress va transformer ces méta-données pour envoyer un code HTML adapté.
<div class="wp-block-group"><div class="wp-block-group__inner-container">
<h2>Les bases : nommer ses photos</h2>
<p>Depuis toujours, pour faciliter le tri naturel de mes dossiers, je les nomme de la manière suivante: <var>YYYY_MM_DD</var></p>
<ul><li><var>YYYY</var>: l’année en quatre chiffres</li><li><var>MM</var>: le mois en deux chiffres</li><li><var>DD</var>: le jour en deux chiffres</li></ul>
<p>J’utilise le caractère de soulignement (_) pour séparer les groupes, mais j’aurais pu choisir le tiret, un autre caractère, ou rien du tout (mais alors on perd en lisibilité).</p>
<p><q>Souvent, j’ajoute le contexte (par exemple le lieu) après la date, pour m’y retrouver encore plus facilement.</q></p>
<p>Cette utilisation de la date sous le format <var>YYYY_MM_DD</var> fait que l’explorateur de fichier les affiche naturellement triés chronologiquement.</p>
</div></div>Il me faudra un peu de temps pour m’y habituer :-)
Pour essayer Gutenberg
Il devrait être disponible avec WordPress 5.0, mais les impatients peuvent ajouter le plugin pour le tester, en gardant l’opportunité de continuer à travailler avec le merveilleux TinyMCE.
Lien de téléchargement: https://fr.wordpress.org/plugins/gutenberg/