Le développement de thèmes WordPress a changé de nature avec l’introduction du Full Site Editing (FSE) et des block themes. En 2025, les standards de développement exigent une approche moderne qui combine l’éditeur de blocs, les global styles, l’accessibilité WCAG et les performances optimales. Ce guide vous accompagne dans la création d’un thème WordPress professionnel conforme aux dernières normes.
Architecture d’un block theme moderne
Structure de fichiers recommandée
La structure d’un block theme diffère des thèmes classiques. Voici l’organisation recommandée pour 2025 :
Le header du fichier style.css est obligatoire et doit respecter ce format :
/*
Theme Name: Mon Theme Moderne
Theme URI: https://exemple.com/mon-theme
Author: Votre Nom
Author URI: https://exemple.com
Description: Un theme WordPress moderne construit avec les standards 2025, Full Site Editing, et optimisé pour les performances.
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 8.0
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mon-theme
Tags: block-themes, full-site-editing, accessibility-ready, translation-ready, custom-colors, custom-menu, featured-images, threaded-comments, wide-blocks
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.
*/
Le fichier theme.json : Le coeur du thème
Le fichier theme.json est le fichier de configuration central d’un block theme moderne. Il définit les styles globaux, les paramètres et les fonctionnalités.
Estimated reading time: 4 minutes Introduction Le développement de thèmes WordPress a changé de nature avec l’introduction du Full Site Editing (FSE) et des block themes. En 2025, les standards…
Le développement de thèmes WordPress a changé de nature avec l’introduction du Full Site Editing (FSE) et des block themes. En 2025, les standards de développement exigent une approche moderne qui combine l’éditeur de blocs, les global styles, l’accessibilité WCAG et les performances optimales. Ce guide vous accompagne dans la création d’un thème WordPress professionnel conforme aux dernières normes.
Architecture d’un block theme moderne
Structure de fichiers recommandée
La structure d’un block theme diffère des thèmes classiques. Voici l’organisation recommandée pour 2025 :
Le header du fichier style.css est obligatoire et doit respecter ce format :
/*
Theme Name: Mon Theme Moderne
Theme URI: https://exemple.com/mon-theme
Author: Votre Nom
Author URI: https://exemple.com
Description: Un theme WordPress moderne construit avec les standards 2025, Full Site Editing, et optimisé pour les performances.
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 8.0
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mon-theme
Tags: block-themes, full-site-editing, accessibility-ready, translation-ready, custom-colors, custom-menu, featured-images, threaded-comments, wide-blocks
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.
*/
Le fichier theme.json : Le coeur du thème
Le fichier theme.json est le fichier de configuration central d’un block theme moderne. Il définit les styles globaux, les paramètres et les fonctionnalités.
Estimated reading time: 4 minutes Introduction Le développement de thèmes WordPress a changé de nature avec l’introduction du Full Site Editing (FSE) et des block themes. En 2025, les standards…
BON : Implémenter tous les standards WCAG 2.1 niveau AA minimum
4. Ne pas tester les performances
Utilisez les outils de test :
Google PageSpeed Insights
WebPageTest
Lighthouse
Query Monitor (plugin)
Conclusion
Le développement de thèmes WordPress en 2025 requiert une maîtrise du Full Site Editing, de theme.json, et une attention particulière à l'accessibilité et aux performances. Les block themes sont la direction que prend WordPress et offrent une vraie flexibilité tout en maintenant une expérience utilisateur cohérente.
Points clés à retenir :
Utilisez theme.json pour tous les réglages de design
Créez des templates HTML avec des blocs
Implémentez des block patterns réutilisables
Respectez les standards WCAG 2.1 niveau AA
Optimisez les performances (lazy loading, préchargement de polices)
Nextcloud installé dans un LXC Proxmox, mais lent et sans optimisations. Voici ce que j'ai fait pour passer d'une instance poussive à un setup qui tient la route : Redis, APCu, preview generator, Collabora, NFS et maintenance automatisée.
Articles similaires
Le fichier functions.php : Configuration et extensions
Le fichier functions.php reste essentiel même dans un block theme :
100,
'width' => 400,
'flex-height' => true,
'flex-width' => true,
) );
// Support HTML5
add_theme_support( 'html5', array(
'search-form',
'comment-form',
'comment-list',
'gallery',
'caption',
'style',
'script',
) );
// Support de l'éditeur de blocs
add_theme_support( 'wp-block-styles' );
add_theme_support( 'responsive-embeds' );
add_theme_support( 'editor-styles' );
add_editor_style( 'assets/css/editor-style.css' );
// Support des liens Atom pour les commentaires
add_theme_support( 'automatic-feed-links' );
// Enregistrer les menus
register_nav_menus( array(
'primary' => **( 'Menu principal', 'mon-theme' ),
'footer' => **( 'Menu pied de page', 'mon-theme' ),
) );
}
add_action( 'after_setup_theme', 'montheme_setup' );
/**
* Enregistrer et charger les scripts/styles
*/
function montheme_enqueue_scripts() {
// Style principal (déjà inclus par WordPress)
wp_enqueue_style( 'montheme-style', get_stylesheet_uri(), array(), MONTHEME_VERSION );
// Styles supplémentaires
wp_enqueue_style(
'montheme-blocks',
MONTHEME_URI . '/assets/css/blocks.css',
array( 'montheme-style' ),
MONTHEME_VERSION
);
// Script principal avec dépendances modernes
wp_enqueue_script(
'montheme-script',
MONTHEME_URI . '/assets/js/main.js',
array(),
MONTHEME_VERSION,
true
);
// Support des commentaires threaded
if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
wp_enqueue_script( 'comment-reply' );
}
}
add_action( 'wp_enqueue_scripts', 'montheme_enqueue_scripts' );
/**
* Enregistrer les scripts pour l'éditeur
*/
function montheme_enqueue_editor_assets() {
wp_enqueue_script(
'montheme-editor',
MONTHEME_URI . '/assets/js/editor.js',
array( 'wp-blocks', 'wp-dom-ready', 'wp-edit-post' ),
MONTHEME_VERSION,
true
);
}
add_action( 'enqueue_block_editor_assets', 'montheme_enqueue_editor_assets' );
/**
* Charger les fichiers d'inclusion
*/
require_once MONTHEME_DIR . '/inc/block-patterns.php';
require_once MONTHEME_DIR . '/inc/block-styles.php';
/**
* Ajouter des styles de blocs personnalisés
*/
function montheme_register_block_styles() {
// Style pour le bloc paragraphe
register_block_style(
'core/paragraph',
array(
'name' => 'montheme-highlight',
'label' => **( 'Mise en évidence', 'mon-theme' ),
'style_handle' => 'montheme-blocks',
)
);
// Style pour le bloc bouton
register_block_style(
'core/button',
array(
'name' => 'montheme-outline',
'label' => **( 'Contour', 'mon-theme' ),
'style_handle' => 'montheme-blocks',
)
);
// Style pour le bloc groupe
register_block_style(
'core/group',
array(
'name' => 'montheme-card',
'label' => **( 'Carte', 'mon-theme' ),
'style_handle' => 'montheme-blocks',
)
);
}
add_action( 'init', 'montheme_register_block_styles' );
/**
* Personnaliser la requête principale
*/
function montheme_pre_get_posts( $query ) {
// Modifier uniquement la requête principale sur le front-end
if ( ! is_admin() && $query->is_main_query() ) {
// Exemple : afficher 12 posts par page sur les archives
if ( $query->is_archive() ) {
$query->set( 'posts_per_page', 12 );
}
}
}
add_action( 'pre_get_posts', 'montheme_pre_get_posts' );
/**
* Ajouter des classes CSS personnalisées au body
*/
function montheme_body_classes( $classes ) {
// Ajouter une classe si le sidebar est actif
if ( is_active_sidebar( 'sidebar-1' ) ) {
$classes[] = 'has-sidebar';
}
// Ajouter une classe pour les pages sans titre
if ( is_page() && ! get_the_title() ) {
$classes[] = 'no-title';
}
return $classes;
}
add_filter( 'body_class', 'montheme_body_classes' );
/**
* Filtrer l'excerpt length
*/
function montheme_excerpt_length( $length ) {
return 30;
}
add_filter( 'excerpt_length', 'montheme_excerpt_length' );
/**
* Personnaliser le "read more" de l'excerpt
*/
function montheme_excerpt_more( $more ) {
if ( ! is_admin() ) {
return sprintf(
' %s',
esc_url( get_permalink() ),
esc_html**( 'Continuer la lecture', 'mon-theme' )
);
}
return $more;
}
add_filter( 'excerpt_more', 'montheme_excerpt_more' );
/**
* Optimisation des performances : Désactiver les emojis
*/
function montheme_disable_emojis() {
remove_action( 'wp_head', 'print_emoji_detection_script', 7 );
remove_action( 'admin_print_scripts', 'print_emoji_detection_script' );
remove_action( 'wp_print_styles', 'print_emoji_styles' );
remove_action( 'admin_print_styles', 'print_emoji_styles' );
remove_filter( 'the_content_feed', 'wp_staticize_emoji' );
remove_filter( 'comment_text_rss', 'wp_staticize_emoji' );
remove_filter( 'wp_mail', 'wp_staticize_emoji_for_email' );
}
add_action( 'init', 'montheme_disable_emojis' );
/**
* Ajouter un préchargement pour les polices
*/
function montheme_preload_fonts() {
?>
Block Patterns : Créer des modèles réutilisables
Créez le fichier inc/block-patterns.php :
**( 'Sections Hero', 'mon-theme' ) )
);
register_block_pattern_category(
'montheme-cta',
array( 'label' => **( 'Call to Action', 'mon-theme' ) )
);
register_block_pattern_category(
'montheme-testimonials',
array( 'label' => **( 'Témoignages', 'mon-theme' ) )
);
}
add_action( 'init', 'montheme_register_pattern_categories' );
/**
* Enregistrer les patterns
*/
function montheme_register_patterns() {
// Pattern Hero avec image de fond
register_block_pattern(
'montheme/hero-with-background',
array(
'title' => **( 'Hero avec image de fond', 'mon-theme' ),
'description' => **( 'Une section hero avec image de fond et texte centré', 'mon-theme' ),
'categories' => array( 'montheme-hero' ),
'content' => '
BON : Implémenter tous les standards WCAG 2.1 niveau AA minimum
4. Ne pas tester les performances
Utilisez les outils de test :
Google PageSpeed Insights
WebPageTest
Lighthouse
Query Monitor (plugin)
Conclusion
Le développement de thèmes WordPress en 2025 requiert une maîtrise du Full Site Editing, de theme.json, et une attention particulière à l'accessibilité et aux performances. Les block themes sont la direction que prend WordPress et offrent une vraie flexibilité tout en maintenant une expérience utilisateur cohérente.
Points clés à retenir :
Utilisez theme.json pour tous les réglages de design
Créez des templates HTML avec des blocs
Implémentez des block patterns réutilisables
Respectez les standards WCAG 2.1 niveau AA
Optimisez les performances (lazy loading, préchargement de polices)
Nextcloud installé dans un LXC Proxmox, mais lent et sans optimisations. Voici ce que j'ai fait pour passer d'une instance poussive à un setup qui tient la route : Redis, APCu, preview generator, Collabora, NFS et maintenance automatisée.
Articles similaires
· · ·
Une remarque, un retour ?
Cet article est vivant - corrections, contre-arguments et retours de production sont les bienvenus. Trois canaux, choisissez celui qui vous convient.
%20.%20')
