Thème Blocksy pour WordPress : réglages, Companion, en-tête, blog

Cet article est une édition localisée de l'original japonais. Lire l'original en japonais

Blocksy est un thème WordPress polyvalent et gratuit. La plupart des réglages se font dans « Apparence » → « Personnaliser » (Appearance → Customize), le personnalisateur, avec aperçu en direct, et l'en-tête comme le pied de page s'assemblent par glisser-déposer. Cet article suit l'ordre des réglages : installation du thème et de l'extension complémentaire « Blocksy Companion », choix initial des couleurs et des polices, construction de l'en-tête, affichage de la liste du blog et des pages d'article, puis préparation d'un thème enfant.

Comprendre la composition de Blocksy

Blocksy se compose des trois éléments suivants.

• Blocksy (le thème lui-même) : disponible gratuitement sur WordPress.org. Il comprend les réglages de design dans le personnalisateur et les constructeurs d'en-tête et de pied de page
• Blocksy Companion (extension gratuite) : se charge d'importer les sites de démarrage (données de démonstration) et d'ajouter des fonctions d'extension
• Blocksy Pro (payant) : ajoute des éléments d'en-tête supplémentaires, l'affichage conditionnel, des fonctions de mise en page plus fines, etc.

Le plus logique est de commencer avec le thème et Companion, puis d'envisager Pro quand vous constatez que la version gratuite ne suffit pas pour une fonction dont vous avez besoin (la répartition des fonctions et les prix peuvent changer : vérifiez-les dans les informations du site officiel d'octobre 2026).

Par ailleurs, Blocksy est conçu plutôt comme un thème classique et prend en charge l'éditeur de blocs. L'endroit où l'on intervient diffère de celui des thèmes de blocs, qui assemblent l'ensemble dans l'éditeur de site (« Apparence » → « Éditeur » ; Site Editor). Pour ne pas vous perdre, retenez : « le design global dans le personnalisateur, le contenu des articles et des pages dans l'éditeur de blocs ».

Installation et mise en place de Companion

1. Dans « Apparence » → « Thèmes » → « Ajouter » (Add New Theme), recherchez « Blocksy », installez-le et activez-le
2. Depuis l'invitation qui s'affiche après l'activation, ou depuis le tableau de bord Blocksy ajouté à l'administration, installez et activez Blocksy Companion

Avec WP-CLI, vous pouvez les installer ainsi.

wp theme install blocksy --activate
wp plugin install blocksy-companion --activate

Si vous changez le thème d'un site existant, faites d'abord une sauvegarde de l'ensemble du site. En changeant de thème, les codes courts, les widgets et les emplacements d'affichage des menus propres à l'ancien thème peuvent ne pas être repris.

Faut-il utiliser un site de démarrage ?

Une fois Companion installé, vous pouvez importer un « site de démarrage » depuis le tableau de bord de Blocksy. Des pages déjà conçues, les réglages du personnalisateur et les extensions nécessaires sont installés d'un seul coup, ce qui permet, pour un nouveau site, de se faire rapidement une idée du résultat final.

Il vaut toutefois mieux éviter de l'importer sur un site qui contient déjà des articles. Des pages de démonstration, des images et des menus sont ajoutés et les réglages du personnalisateur sont écrasés : on ne sait plus ce qui faisait partie de la configuration d'origine. Si vous l'utilisez, nous recommandons de le faire au tout début d'un nouveau site, ou de l'essayer dans un environnement de préproduction (staging) et de reproduire seulement les réglages utiles.

Réglages globaux à décider en premier

Quand vous ouvrez « Apparence » → « Personnaliser », les options de réglage de Blocksy s'affichent. Les noms des options sont souvent traduits en japonais, mais leur libellé peut varier selon la version. Les deux premiers réglages à aborder agissent sur l'ensemble du site.

Couleurs (palette de couleurs)

Dans les réglages de couleurs des réglages généraux, vous définissez la palette des couleurs de base du site. Dans Blocksy, la couleur du texte, des liens, des boutons, etc. se réfère aux couleurs de cette palette : si vous changez la palette, la palette de couleurs de tout le site change d'un seul coup.

Si vous indiquez directement une couleur à chaque endroit, il faudra les corriger une à une le jour où vous voudrez changer de palette. Le plus facile à gérer est de tout définir par la palette et de ne spécifier individuellement que les endroits où vous voulez absolument une autre couleur.

Polices (typographie)

Dans les réglages de typographie, vous définissez la police, la taille et l'interlignage du corps du texte et des titres. Sur un site en japonais, un point demande de l'attention : choisir une police latine ne l'applique pas aux caractères japonais. Les parties en japonais s'affichent avec les polices de l'appareil du visiteur ; laissez donc la police du corps de texte sur la valeur par défaut, comme « police système », ou indiquez une police qui prend en charge le japonais.

Charger une police web japonaise produit des fichiers volumineux qui peuvent influer sur la vitesse d'affichage. Si vous le faites, limitez le nombre de graisses et vérifiez l'effet sur la vitesse avec PageSpeed Insights ou un outil similaire.

Construire l’en-tête

Quand vous ouvrez l'option d'en-tête du personnalisateur, le constructeur d'en-tête s'affiche en bas de l'écran. L'en-tête est divisé en rangées haute, centrale et basse ; on y place, par glisser-déposer, des éléments comme le logo (titre du site), le menu, la recherche et les boutons, à gauche, au centre ou à droite de chaque rangée.

Un point où l'on trébuche facilement : les en-têtes pour ordinateur et pour smartphone sont réglés séparément. Si vous basculez l'affichage du constructeur sur smartphone, une autre disposition apparaît. Sur smartphone, la configuration de base consiste à placer le menu dans un « off-canvas » que l'on ouvre depuis l'icône hamburger (déclencheur). Si vous ne réglez que la version ordinateur avant de publier, il peut arriver que le menu n'apparaisse pas sur smartphone : vérifiez donc les deux affichages.

Quand vous cliquez sur un élément, ses réglages (taille du texte, couleur, marges, etc.) s'affichent à gauche. Les éléments à afficher dans le menu se créent dans « Apparence » → « Menus » (Appearance → Menus) et s'affectent à l'élément de menu de l'en-tête.

Le pied de page s'assemble de la même façon avec le constructeur de pied de page. Pour modifier la disposition des zones de widgets ou de la mention de copyright, modifiez-les depuis l'option de pied de page.

Affichage de la liste du blog et des pages d’article

Le personnalisateur propose des options de réglage par type de page : liste des articles (blog), article individuel, pages, etc.

• Liste des articles : disposition en cartes ou en liste, nombre de colonnes par rangée, proportions de l'image mise en avant, longueur de l'extrait, informations affichées pour l'article (date de publication, catégories, etc.)
• Article individuel : largeur de la zone de contenu, présence et position de la colonne latérale, mode d'affichage de la zone de titre, affichage des articles associés et des informations sur l'auteur
• Pages : comme pour l'article individuel, réglage de la largeur et de la présence de la colonne latérale

Ce qui joue beaucoup sur la lisibilité d'une page d'article est la largeur du texte. Pour les longs textes en japonais, une ligne trop longue devient difficile à lire : si vous n'ajoutez pas de colonne latérale, réglez une largeur de texte plutôt étroite et vérifiez que le texte ne devient pas trop petit sur smartphone.

Si vous voulez modifier la mise en page d'un article en particulier, utilisez les réglages de Blocksy affichés dans la colonne latérale de l'écran d'édition de l'article : vous pouvez, par exemple, retirer la colonne latérale pour cet article seulement.

Préparer un thème enfant

Si vous modifiez directement les fichiers du thème, les changements disparaissent à la mise à jour du thème. Pour ajouter un peu de CSS, le « CSS additionnel » du personnalisateur suffit. Si vous avez besoin de personnaliser en PHP ou de remplacer des modèles, créez un thème enfant.

Le site officiel de Blocksy distribue un modèle de thème enfant. Si vous le créez vous-même, placez dans wp-content/themes/blocksy-child/ le fichier style.css suivant,

/*
Theme Name: Blocksy Child
Template: blocksy
*/

puis chargez les styles du thème enfant dans le functions.php du même dossier.

<?php
add_action( 'wp_enqueue_scripts', function () {
	wp_enqueue_style(
		'blocksy-child-style',
		get_stylesheet_uri(),
		array(),
		wp_get_theme()->get( 'Version' )
	);
}, 20 );

Quand vous passez au thème enfant, les réglages du personnalisateur sont enregistrés séparément de ceux du thème parent : ce que vous aviez réglé dans le thème parent peut donc ne plus apparaître. Si Companion est installé, vous pouvez transférer les réglages du personnalisateur avec la fonction d'exportation et d'importation ; en les exportant avant de passer au thème enfant, vous évitez de tout refaire.

Mises à jour et précautions d’exploitation

Blocksy et Companion sont mis à jour fréquemment. Avant une mise à jour, faites une sauvegarde ; après, vérifiez l'ensemble de l'en-tête, des pages d'article et de l'affichage sur smartphone. Si l'affichage est cassé, videz le cache des extensions de cache ou du CDN, puis revérifiez. Si vous utilisez une extension d'accélération qui combine et compresse les CSS, d'anciens CSS peuvent rester et donner l'impression que l'affichage est cassé.

Résumé

• Commencez avec le thème Blocksy et Blocksy Companion, puis envisagez Pro une fois que vous savez quelles fonctions manquent
• Utilisez le site de démarrage sur un nouveau site ou dans un environnement de préproduction, et faites attention à l'écrasement des réglages sur un site existant
• Définissez l'ensemble avec la palette de couleurs pour les couleurs et la typographie pour le texte. Attention : une police latine n'agit pas sur le japonais
• Le constructeur d'en-tête est distinct pour ordinateur et pour smartphone. Vérifiez les deux affichages, et utilisez un thème enfant si vous touchez à PHP

• Comment créer un pied de page personnalisé avec Blocksy
• Comment changer de thème WordPress en toute sécurité

Une question sur WordPress ? L'éditeur de ce site est basé au Japon et répond en japonais. Contact (en japonais)