Jak přidat vlastní text field v nastavení produktu

Zobrazení nějaké hodnoty v detailu produktu je pouze polovina práce, kterou musíme udělat, když upravujeme e-shop.

Tou druhou je mít možnost tuto hodnotu natavit u produktu v administraci a uložit.

Dnešní snippet bude tedy v podstatě rozšířením https://musilda.cz/jak-pridat-vlastni-tab-do-detailu-produktu/

V něm jsme do detailu produktu přidali novou záložku Produkt video.

V detailu produktu přidáme formulářové pole v záložce pokročilé, ať můžeme vložit řetězec pro načtení videa.

Dnešní snippet má dvě funkce, první je uložení hodnoty z formuláře do post meta a ta druhá vykreslí textové pole formuláře v detailu produktu.

if ( is_admin() ) {
	add_action( 'woocommerce_process_product_meta', 'musilda_product_fields_save' );

	function musilda_product_fields_save( $post_id ){

		//Check autosave
		if ( defined('DOING_AUTOSAVE') && DOING_AUTOSAVE ) {
			return $post_id;	
		}	
			
		//Don't update on Quick Edit
		if ( defined('DOING_AJAX') ) {	
			return $post_id;	
		}	
		
		//Don't update on Quick Edit	
		if ( !empty( $_REQUEST['bulk_edit'] ) ) {	
			return $post_id;	
		}
	
		if ( !empty( $_POST['product-video'] ) ) {
			$video = sanitize_text_field( $_POST['product-video'] );
			update_post_meta( $post_id, 'product-video', $video );
		} else {
			delete_post_meta( $post_id, 'product-video' );
		}

	}

	add_action( 'woocommerce_product_options_advanced', 'woocommerce_product_options_advanced_video_field' );
	function woocommerce_product_options_advanced_video_field() {
		global $post;
		$video = get_post_meta( $post->ID, 'product-video', true );
		if ( empty( $video ) ) {
			$video = '';
		}

		woocommerce_wp_text_input(
			array(
				'id'                => 'product-video',
				'value'             => $video,
				'label'             => __( 'Product video', 'woocommerce' ),
				'desc_tip'          => true,
				'description'       => __( 'Insert youtube video', 'woocommerce' )
			)
		);

	}

}

Výsledkem je pole v záložce pokročilé:

A nakonec si ještě upravíme včerejší kód:

function display_video_tab_content() {

	global $post;
	$video = get_post_meta( $post->ID, 'product-video', true );

	if ( !empty( $video ) ) {
		echo '<iframe width="560" height="315" src="' . $video . '" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
			';
	}
	
}

K dokonalosti už jen zbývá omezit zobrazení záložky, pouze, pokud je product video vloženo:

add_filter( 'woocommerce_product_tabs', 'custom_product_tabs' );
function custom_product_tabs( $product_tabs ) {

	global $post;
	$video = get_post_meta( $post->ID, 'product-video', true );
	if ( !empty( $video ) ) {
		$product_tabs['product-video'] = array(
			'title' => __( 'Product video', 'musilda' ),
			'callback' => 'display_video_tab_content'
		);
	}

	return $product_tabs;

}

Další užitečné snippety najdete na stránce Užitečné snippety pro WooCommerce