Для некоторых товаров в интернет-магазине требуется видеообзор — сделаем для них на странице товара вкладку.
Создаем дополнительное поле Видеообзор
add_action( 'woocommerce_product_options_general_product_data', 'video_custom_general_fields' ); add_action( 'woocommerce_process_product_meta', 'video_custom_general_fields_save' ); function video_custom_general_fields() { global $woocommerce, $post; echo '<div class="options_group">'; woocommerce_wp_text_input( array( 'id' => 'video_field', 'label' => __( 'My Text Field', 'woocommerce' ), 'placeholder' => 'http://', 'desc_tip' => 'true', 'description' => __( 'Enter the custom value here.', 'woocommerce' ), 'type' => 'html' ) ); echo '</div>'; } function video_custom_general_fields_save( $post_id ){ // Text Field $woocommerce_text_field = $_POST['video_field']; if( !empty( $woocommerce_text_field ) ) update_post_meta( $post_id, 'video_field', esc_attr( $woocommerce_text_field ) ); }
Создаем вкладку Видеообзор
function video_product_tab( $tabs ) { $custom_tab_v = array( 'custom_tab_v' => array( 'title' => __('Видеообзор','woocommerce'), 'priority' => 100, 'callback' => 'video_product_tab_content' ) ); return array_merge( $custom_tab_v, $tabs ); } function video_product_tab_content() { global $post; echo '<iframe src="'; echo get_post_meta($post->ID, 'video_field', true); echo '" width="560" height="315" frameborder="0" allowfullscreen="allowfullscreen"></iframe>'; } add_filter( 'woocommerce_product_tabs', 'video_product_tab' );
Проблема X-Frame-Options
Проблема X-Frame-Options решается следующим образом
для youtube
перед выводом ссылки добавляем https://www.youtube.com/embed/ и после только окончание ссылки yRdKq_-FJPs (после watch?v=)
для vimeo
перед выводом ссылки добавляем http://player.vimeo.com/video/ и после только окончание ссылки 62882435 (после https://vimeo.com/)
Проверка на заполненность
Необходимо чтобы вкладка не выводилась при незаполненном поле — добавляем проверку и внесем дополнения описанные в предыдущем пункте:
function video_product_tab( $tabs ) { global $post; if (get_post_meta($post->ID, 'video_field', true)) : $video = array( 'video' => array( 'title' => __('Видеообзор','woocommerce'), 'priority' => 100, 'callback' => 'video_product_tab_content' ) ); return array_merge( $video, $tabs ); else: return $tabs; endif; } function video_product_tab_content() { global $post; echo '<iframe width="560" height="315" src="https://www.youtube.com/embed/'; echo get_post_meta($post->ID, 'video_field', true); echo '" frameborder="0" allowfullscreen></iframe>'; } add_filter( 'woocommerce_product_tabs', 'video_product_tab' );
Всё это прописывается в functions.php?
Да, можно в functions.php. Но для удобства функции связанные в WC я прописываю в отдельном файле, чтобы не путаться. А потом подключаю его в functions.php (Как подключить — кратко описано здесь).
Впрочем, подобный отдельный функционал можно также реализовать в виде плагина.