Un exemple complet du monde réel montrant un thème qui utilise Field Forge pour tout le contenu personnalisé.
Structure du thème
text
theme-starter/
style.css
functions.php
header.php
footer.php
front-page.php
single.php
single-product.php
archive-product.php
page-builder.php
blocks/
hero.php
testimonial.php
template-parts/
builder/
hero.php
text-block.php
features.php
cta.php
fieldforge-json/
inc/
fieldforge-setup.php
template-functions.phpfunctions.php
php
<?php
require_once get_template_directory() . '/inc/fieldforge-setup.php';
add_action( 'after_setup_theme', function() {
add_theme_support( 'title-tag' );
add_theme_support( 'post-thumbnails' );
register_nav_menus( [ 'primary' => 'Primary Menu', 'footer' => 'Footer Menu' ] );
} );
add_action( 'wp_enqueue_scripts', function() {
wp_enqueue_style( 'theme-style', get_stylesheet_uri(), [], '1.0.0' );
} );
add_action( 'init', function() {
if ( ! function_exists( 'fieldforge_register_block_type' ) ) {
return;
}
fieldforge_register_block_type( [
'name' => 'hero',
'title' => 'Hero Section',
'icon' => 'cover-image',
'render_template' => get_template_directory() . '/blocks/hero.php',
'enqueue_style' => get_template_directory_uri() . '/blocks/hero.css',
'supports' => [ 'align' => [ 'full', 'wide' ] ],
] );
} );En-tête avec options
php
<?php // header.php ?>
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1">
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<header class="site-header">
<div class="container">
<?php $logo = get_field( 'site_logo', 'options' );
if ( $logo ) : ?>
<a href="<?php echo esc_url( home_url() ); ?>" class="site-logo">
<img src="<?php echo esc_url( $logo['url'] ); ?>"
alt="<?php echo esc_attr( get_bloginfo( 'name' ) ); ?>">
</a>
<?php endif; ?>
<nav><?php wp_nav_menu( [ 'theme_location' => 'primary', 'container' => false ] ); ?></nav>
</div>
</header>Modèle de constructeur de page
php
<?php
/**
* Template Name: Page Builder
*/
get_header(); ?>
<main class="page-builder">
<?php if ( have_rows( 'page_sections' ) ) : ?>
<?php while ( have_rows( 'page_sections' ) ) : the_row(); ?>
<?php get_template_part( 'template-parts/builder/' . str_replace( '_', '-', get_row_layout() ) ); ?>
<?php endwhile; ?>
<?php else : ?>
<div class="container"><?php the_content(); ?></div>
<?php endif; ?>
</main>
<?php get_footer(); ?>Optimisation des performances
php
// Preload for secondary queries
function theme_render_related_posts() {
$related = new WP_Query( [
'post_type' => 'post',
'posts_per_page' => 4,
'post__not_in' => [ get_the_ID() ],
] );
if ( $related->have_posts() ) {
fieldforge_preload( wp_list_pluck( $related->posts, 'ID' ) );
echo '<section class="related-posts"><h2>Related Posts</h2>';
while ( $related->have_posts() ) : $related->the_post();
echo '<article>';
echo '<h3><a href="' . get_permalink() . '">' . get_the_title() . '</a></h3>';
$subtitle = get_field( 'subtitle' ); // Served from cache
if ( $subtitle ) {
echo '<p>' . esc_html( $subtitle ) . '</p>';
}
echo '</article>';
endwhile;
echo '</section>';
wp_reset_postdata();
}
}—