Přidání vlastního tabu v datech produktu

V minulém článku jsme si upravili zobrazení metaboxu data produktu, tak aby nebyly vidět nepotřebné taby. Dnes si ukážeme, jak si přidat vlastní tab, viditelný jen pro náš typ produktu.

Vytvořili jsme funkci musilda_event_product_data_tabs, do které přidáme definici dalšího tabu:

add_filter( 'woocommerce_product_data_tabs', 'musilda_event_product_data_tabs', 10, 1 );
function musilda_event_product_data_tabs( $option ) {

	global $post;
	$product = wc_get_product( $post->ID );

	if ( 'event' == $product->get_type() ) {

		$option['general']['class'][] 			= 'show_if_event';
		$option['general']['class'][] 			= 'active';
		$option['inventory']['class'][] 		= 'hide_if_event';
		$option['shipping']['class'][] 			= 'hide_if_event';
		$option['linked_product']['class'][] 	= 'hide_if_event';
		$option['attribute']['class'][] 		= 'hide_if_event';
		$option['advanced']['class'][] 			= 'hide_if_event';

		$option['event'] = array(
			'label'    => __( 'Event', 'musilda-eventpress' ),
			'target'   => 'musilda_eventpress_product_option',
			'class'    => array( 'show_if_event' ),
			'priority' => 60,
		);

	}

	return $option;

}

Do pole option přidáme položku s key event. Důležitá je hodnota target, která označuje id divu, který se bude zobrazovat po kliknutí na tab.

Do akce woocommerce_product_data_panels, která se volá po zobrazení všech tabů, přidáme vlastní funkci:

add_action( 'woocommerce_product_data_panels', 'musilda_eventpress_product_option' );
function musilda_eventpress_product_option() {

	echo '<div id="musilda_eventpress_product_option" class="panel woocommerce_options_panel">';
		echo __( 'Event data', 'musilda-eventpress' );
	echo '</div>';

}

Vše co v této funkci vypíšeme, se zobrazí v našem tabu

To je dnes vše, kód najdete na Githubu https://github.com/Musilda/musilda-eventpress a příště si záložku vyplníme formulářovými poli pro doplňující informace k eventu.

About The Author

Zajímá mne Wordpress, responsivní šablony a zkrátka vše kolem tohoto skvělého redakčního systému.

Související články

Přidejte komentář

Vaše e-mailová adresa nebude zveřejněna. Vyžadované informace jsou označeny *