Après plusieurs mois sans modification, j’ai fais pas mal de changements dans Basics (et accessoirement dans Beyond Basics) en raison du passage de la version 3.0.2 de HTML5 Boilerplate à la version 4.0.1, d’une part, et de l’évolution de la syntaxe du shortcode pour l’insertion des images depuis WordPress 3.4, d’autre part.
tl;dr? → Téléchargez Basics et Beyond Basics ou « Fork me » sur Gihub !
HTML5 Boilerplate 4.0.1
Le passage de la version 3.0.2 à la version 4.0.1 se traduit par quelques changements dont les plus notables sont :
- Séparation du fichier main.css (normalize.css en tant que fichier autonome) et main.css pour le reste. L’idée étant de simplifier les mises à jour de normalize.css, de pouvoir s’en passer ou de le remplacer par le « reset » de votre choix.
- Changement de technique pour le remplacement d’image.
- Changement des noms de fichiers et des répertoires pour les scripts Javascript.
- Mise à jour vers jQuery 1.8.2. et Modernizr 2.6.2.
Comme pour les versions précédentes de Basics, j’ai séparé le fichier main.css en deux parties pour que la section dédiée aux auteurs de CSS devienne un fichier autonome. Ainsi, nous avons :
- Normalize.css
- main1.css
- author.css
- wordpress.css
- main2.css
Ces fichiers sont importés depuis le fichier style.css situé à la racine du thème Basics.
J’ai ajouté le fichier CSS wordpress.css pour rassembler les règles (ID’s ou classes) qui proviennent de WordPress ou qui sont générées par le thèmes Basics lui-même. Dans le cadre d’un Child Theme, il sera peut-être préférable de l’ajouter directement dans votre fichier author.css (comme je l’ai fait pour Beyond Basics) : inutile d’ajouter des requêtes inutiles si elles n’apportent rien (tautologie, lapalissade, quand tu nous tient !).
En tout état de cause, je vous conseille d’installer un système de «minification» comme minify.php ou mieux encore, comme le plugin W3 Total Cache qui permet d’effectuer une concaténation des différents fichiers CSS ou Javascript pour accélérer le chargement des pages web.
L’idée, ici, étant d’organiser au mieux les fichiers pour s’y retrouver facilement et de pouvoir — si j’ose dire — «en toucher un(e) sans faire bouger l’autre» 😀
Caption Shortcode
Depuis WordPress 3.4, la légende est désormais insérée entre les tags caption et /caption au lieu de l’être en tant qu’attribut de l’élément caption du shortcode. Ce changement permet d’inclure du HTML dans le shortcode Caption.
En bref, lorsque vous insériez une image avec sa légende dans un billet, toute la sémantique véhiculée par les balises figure et figcaption était perdue. Pour régler ce problème, il fallait changer le mode d’accrochage de la fonction basics_img_caption_shortcode() : au lieu d’utiliser add_shortcode('wp_caption', 'basics_img_caption_shortcode'); et add_shortcode('caption', 'basics_img_caption_shortcode'); j'ai utilisé add_filter('img_caption_shortcode', 'basics_caption_shortcode_filter',10,3); à la place.
La fonction basics_caption_shortcode_filter()
/**
* 9. The Caption shortcode with figure and figcaption
* fix based on http://wordpress.org/support/topic/caption-broken-in-new-34-posts
* Thanks @regisrob
*/
add_filter( 'img_caption_shortcode', 'basics_caption_shortcode_filter',10,3 );
if ( ! function_exists( 'basics_caption_shortcode_filter' ) ) :
function basics_caption_shortcode_filter( $val, $attr, $content = null ) {
extract(shortcode_atts(
array(
'id' => '',
'align' => '',
'width' => '',
'caption' => ''
),
$attr )
);
if ( 1 > ( int ) $width || empty( $caption ) )
return $val;
$capid = '';
if ( $id ) {
$id = esc_attr( $id );
$capid = 'id="figcaption_'. $id . '" ';
$id = 'id="' . $id . '" aria-labelledby="figcaption_' . $id . '" ';
}
return '<figure ' . $id . 'class="wp-caption ' . esc_attr( $align ) . '" style="width: '
. (0 + ( int ) $width) . 'px">' . do_shortcode( $content ) . '<figcaption ' . $capid
. 'class="wp-caption-text">' . $caption . '</figcaption></figure>';
}
endif;
Un grand merci à @regisrob pour le temps qu’il a passé pour isoler le problème et trouver une solution o/
Comme d’habitude, n’hésitez pas à tester Basics et à me faire part de vos suggestions pour améliorer le bouzin 🙂
→ Téléchargez Basics et Beyond Basics ou « Fork me » sur Gihub !
Les commentaires sont fermés.