Skip to content

Instantly share code, notes, and snippets.

View atanas-dev's full-sized avatar

Atanas Angelov atanas-dev

View GitHub Profile

Theme Builder Hooks

The Theme Builder provides a number of hooks allowing you to add wrapper HTML tags or fill in your custom theme's header or footer if necessary, when Theme Builder is active for the current page.

The Theme Builder and custom themes

When used in a custom theme, the Theme Builder may replace the header, body, footer or some combination of the previous depending on how the user configures their templates. Due to the nature of headers and footers in custom themes the Theme Builder will always treat them as a pair meaning that if you use a layout for either, both will be overridden.

As a custom theme developer, you may wish to add support for the Theme Builder so that when only the header is replaced your custom footer is still shown or when the footer is replaced your custom header is still shown. To achieve this you should use the provided layout hooks.

<?php
// This code is UNTESTED!
function foo_add_class_to_first_three_posts_or_whatever( $post_class ) {
global $wp_query;
if ( $wp_query && $wp_query->current_post < 3 && is_main_query() && ! is_singular() && ! is_search() ) {
$post_class .= ' one-of-the-top-trio';
}
return $post_class;
<?php
// Make sure you replace the following in the example:
// - META_KEY_HERE
// - LABEL_HERE
// - VISUAL_GROUP_LABEL_HERE
// Register your new Dynamic Content fields:
add_filter( 'et_builder_custom_dynamic_content_fields', function ( $custom_fields, $post_id, $raw_custom_fields ) {
$custom_fields['custom_meta_META_KEY_HERE'] = array(
'label' => esc_html( 'LABEL_HERE' ),