在 Woocommerce 中移动设备上的图片库上方移动标题和评级

Move title & ratings above image gallery on mobile devices in Woocommerce

我正在尝试将我的标题和评分移动到 woocommerce 中的图片库上方,但仅限于移动设备。 桌面版应该保持不变。

我发现了一个 php 代码,我将其粘贴到我的主题 functions.php 中,它完成了工作,但它也将它们移到了桌面上。

有什么方法可以 运行 此 php 代码仅在移动设备上使用?

function product_change_title_position() {
    remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_title', 5 );
    add_action( 'woocommerce_before_single_product', 'woocommerce_template_single_title', 5 );
}

add_action( 'init', 'product_change_title_position' );

function product_change_rating_position() {
    remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_rating', 10 );
    add_action( 'woocommerce_before_single_product', 'woocommerce_template_single_rating', 5 );
}

add_action( 'init', 'product_change_rating_position' );

谢谢
维巴夫

Wordpress 提供了一个名为 wp_is_mobileDocs 的函数,它允许您执行您要查找的操作:

add_action('init', 'product_change_title_position');

function product_change_title_position()
{
    if (wp_is_mobile()) 
    {
        remove_action('woocommerce_single_product_summary', 'woocommerce_template_single_title', 5);
        add_action('woocommerce_before_single_product', 'woocommerce_template_single_title', 5);
    }
}

add_action('init', 'product_change_rating_position');

function product_change_rating_position()
{
    if (wp_is_mobile()) 
    {
        remove_action('woocommerce_single_product_summary', 'woocommerce_template_single_rating', 10);
        add_action('woocommerce_before_single_product', 'woocommerce_template_single_rating', 5);
    }
}

注:

  • "它通过检测浏览器用户代理字符串($_SERVER['HTTP_USER_AGENT'])来工作。"
  • “此功能将 return 适用于平板电脑,因为它也被视为移动设备。它不能替代 CSS 媒体查询或每个平台的样式."