PHP Template Overrides

Every BF Blocks block uses a PHP template to render its front-end output. Override the default template in your theme for full control over the HTML structure.

Template Hierarchy

BF Blocks looks for templates in the following order (first match wins):

  1. your-theme/bf-blocks/testimonial.php
  2. your-theme/bf-blocks/template.php (fallback override)
  3. BF Blocks plugin default template

Template path filter

Override the path programmatically with the bf_blocks/template_path filter for more complex setups (e.g. child themes, plugin-provided templates).

Available Variables

VariableTypeDescription
$fieldsarrayAssociative array of field values keyed by field key
$blockarrayBlock metadata: id, name, slug, className, align, etc.
$is_previewboolTrue when rendered inside the Gutenberg editor preview

Example: Testimonial Block Override

<?php
/**
 * Template override for the Testimonial block.
 * Path: your-theme/bf-blocks/testimonial.php
 *
 * @var array  $fields     The block's field values.
 * @var array  $block      Block metadata.
 * @var bool   $is_preview Whether in Gutenberg preview.
 */

$quote  = $fields['quote']       ?? '';
$author = $fields['author_name'] ?? '';
$role   = $fields['author_role'] ?? '';
$avatar = $fields['avatar']      ?? 0; // attachment ID

if ( $is_preview && empty( $quote ) ) {
  echo '<p style="padding:1rem;color:#888;">Add a quote in the sidebar →</p>';
  return;
}
?>

<figure class="bf-testimonial <?php echo esc_attr( $block['className'] ?? '' ); ?>">
  <?php if ( $avatar ) : ?>
    <?php echo wp_get_attachment_image( $avatar, 'thumbnail', false, [
      'class' => 'bf-testimonial__avatar',
      'alt'   => esc_attr( $author ),
    ] ); ?>
  <?php endif; ?>

  <blockquote class="bf-testimonial__quote">
    <p><?php echo wp_kses_post( $quote ); ?></p>
  </blockquote>

  <?php if ( $author ) : ?>
    <figcaption class="bf-testimonial__author">
      <strong><?php echo esc_html( $author ); ?></strong>
      <?php if ( $role ) : ?>
        <span class="bf-testimonial__role"><?php echo esc_html( $role ); ?></span>
      <?php endif; ?>
    </figcaption>
  <?php endif; ?>
</figure>

Best Practices

  • Always escape output with esc_html(), esc_attr(), or wp_kses_post().
  • Check $is_preview and provide a meaningful editor placeholder when fields are empty.
  • Use $block['className'] to pass through any additional CSS classes the editor adds.
  • Keep templates thin — move complex logic to a helper function in your theme's functions.php or a dedicated class.
  • Name files with the block slug exactly as registered (e.g. testimonial.php for a block with slug bf-blocks/testimonial).