【问题标题】:Add custom settings tab for products in WooCommerce which allows to display an iframe在 WooCommerce 中为产品添加自定义设置选项卡,允许显示 iframe
【发布时间】:2020-03-03 11:02:03
【问题描述】:

我正在创建一个插件,它将改变 woocommerce 中画廊的外观。也就是说,将打开一个 iframe 而不是画廊。这适用于所有产品。

add_filter( 'woocommerce_single_product_image_thumbnail_html', 'product_image');

function product_image(){
    $product = wc_get_product();
    $product_id = $product->get_id();
    $threedLink = 'http://sameurl/' .$product_id ;
    $content .= '<iframe src='.$threedLink.'  width="99%" height="300px"></iframe>';
    return $content;

}

但我需要的不是所有产品,而是所选产品。也就是说,在产品的整个加载过程中,您需要创建一个复选标记,管理员必须同意在其中显示 iframe。我在产品加载面板中创建了一个标签

function wk_custom_product_tab( $default_tabs ) {
    $default_tabs['custom_tab'] = array(
        'label'   =>  __( 'Custom Tab', 'domain' ),
        'target'  =>  'wk_custom_tab_data',
        'priority' => 60,
        'class'   => array()
    );
    return $default_tabs;
}

add_filter( 'woocommerce_product_data_tabs', 'wk_custom_product_tab', 10, 1 );

add_action( 'woocommerce_product_data_panels', 'wk_custom_tab_data' );

function wk_custom_tab_data() {
   echo '<div id="wk_custom_tab_data" class="panel woocommerce_options_panel">ddddd</div>';
}

如何添加复选标记而不是 ddddd 并将其与插件下载连接?

【问题讨论】:

    标签: php wordpress woocommerce product custom-fields


    【解决方案1】:
    • 添加自定义产品标签
    • 将内容添加到产品选项卡(复选框)
    • 保存复选框
    • 获取值,“是”或“否”,如果是,则显示 iframe
    /**
     * Add custom product setting tab.
     */
    function filter_woocommerce_product_data_tabs( $default_tabs ) {
        $default_tabs['custom_tab'] = array(
            'label'   =>  __( 'Custom Tab', 'domain' ),
            'target'  =>  'wk_custom_tab_data',
            'priority' => 60,
            'class'   => array()
        );
        return $default_tabs;
    }
    add_filter( 'woocommerce_product_data_tabs', 'filter_woocommerce_product_data_tabs', 10, 1 );
    
    /**
     * Contents custom product setting tab.
     */
    function action_woocommerce_product_data_panels() {
        global $post;
    
        // Note the 'id' attribute needs to match the 'target' parameter set above
        echo '<div id="wk_custom_tab_data" class="panel woocommerce_options_panel">';
    
        // Add checkbox
        woocommerce_wp_checkbox( array(
            'id'        => '_allow_iframe',
            'label'     => __( 'Allow iFrame', 'woocommerce' ),
        ) );
    
        echo '</div>';
    }
    add_action( 'woocommerce_product_data_panels', 'action_woocommerce_product_data_panels', 10, 0 );
    
    /**
     * Save the checkbox.
     */
    function action_woocommerce_admin_process_product_object( $product ) {
        // Isset, yes or no
        $allow_iframe = isset( $_POST['_allow_iframe'] ) ? 'yes' : 'no';
    
        // Update meta
        $product->update_meta_data( '_allow_iframe', $allow_iframe );
    }
    add_action( 'woocommerce_admin_process_product_object', 'action_woocommerce_admin_process_product_object', 10, 1 );
    
    /**
     * Display iframe if checkbox = 'yes'
     */
    function filter_woocommerce_single_product_image_thumbnail_html( $html, $post_thumbnail_id ) {
        // Get the global product object
        global $product;
        
        // Is a WC product
        if ( is_a( $product, 'WC_Product' ) ) {
            // Get meta
            $value = $product->get_meta( '_allow_iframe' );
    
            // value = 'yes'
            if ( $value == 'yes' ) {
                // Get product id
                $product_id = $product->get_id();
                
                $threed_link = 'http://myurl/' . $product_id;
                $html .= '<iframe src=' . $threed_link . ' width="99%" height="300px"></iframe>';   
            }
        }
    
        return $html;
    }
    add_filter( 'woocommerce_single_product_image_thumbnail_html', 'filter_woocommerce_single_product_image_thumbnail_html', 10, 2 );
    

    【讨论】:

    • 谢谢,它有效。但我需要他放 iframe 而不是照片,而不是将其添加到照片中。我只是 php 的新手((而且我不太明白如何做到这一点
    • 查看下一行 $html .= '
    • 但还有一个问题。如何使用 iframe 打开某些样式。 $ html 可以设置一些类吗?
    猜你喜欢
    • 2018-09-22
    • 1970-01-01
    • 1970-01-01
    • 2021-02-03
    • 2021-01-29
    • 1970-01-01
    • 2021-07-24
    • 2023-04-08
    • 2017-12-26
    相关资源
    最近更新 更多