Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
Create custom product details tabs within WooCommerce using an ACF (Advanced Custom Fields) Repeater field.
<?php
if( function_exists('acf_add_local_field_group') ):
acf_add_local_field_group(array (
'key' => 'acf_product_options',
'title' => 'Product Options',
'fields' => array (
array (
'key' => 'acf_product_options_tabbedcontent_label',
'label' => 'Tabbed Content',
'name' => '',
'type' => 'tab',
'instructions' => '',
'required' => 0,
'conditional_logic' => 0,
'wrapper' => array (
'width' => '',
'class' => '',
'id' => '',
),
'placement' => 'top',
'endpoint' => 0,
),
array (
'key' => 'acf_product_options_tabbedcontent_tabs',
'label' => 'Tabs',
'name' => 'tabs',
'type' => 'repeater',
'instructions' => '',
'required' => 0,
'conditional_logic' => 0,
'wrapper' => array (
'width' => '',
'class' => '',
'id' => '',
),
'min' => '',
'max' => '',
'layout' => 'row',
'button_label' => 'Add Tab',
'sub_fields' => array (
array (
'key' => 'acf_product_options_tabbedcontent_tab_title',
'label' => 'Tab Title',
'name' => 'tab_title',
'type' => 'text',
'instructions' => '',
'required' => 0,
'conditional_logic' => 0,
'wrapper' => array (
'width' => '',
'class' => '',
'id' => '',
),
'default_value' => '',
'placeholder' => '',
'prepend' => '',
'append' => '',
'maxlength' => '',
'readonly' => 0,
'disabled' => 0,
),
array (
'key' => 'acf_product_options_tabbedcontent_tab_content',
'label' => 'Tab Content',
'name' => 'tab_content',
'type' => 'wysiwyg',
'instructions' => '',
'required' => 0,
'conditional_logic' => 0,
'wrapper' => array (
'width' => '',
'class' => '',
'id' => '',
),
'default_value' => '',
'tabs' => 'all',
'toolbar' => 'full',
'media_upload' => 1,
),
),
),
),
'location' => array (
array (
array (
'param' => 'post_type',
'operator' => '==',
'value' => 'product',
),
),
),
'menu_order' => 0,
'position' => 'normal',
'style' => 'default',
'label_placement' => 'top',
'instruction_placement' => 'label',
'hide_on_screen' => '',
));
endif;
<?php
function hwid_load_custom_tab( $tab_key, $tab_info ) {
echo apply_filters( 'the_content', $tab_info['tabContent'] );
}
function hwid_add_content_tabs( $tabs ) {
global $post;
$custom_tabs = get_field( 'tabs', $post->ID );
foreach( $custom_tabs as $index => $tab ) {
$tabs['customTab-' . $index] = array(
'title' => $tab['tab_title'],
'priority' => 20 + $index,
'tabContent' => $tab['tab_content'],
'callback' => 'hwid_load_custom_tab'
);
}
return $tabs;
}
add_filter( 'woocommerce_product_tabs', 'hwid_add_content_tabs' );
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment