如何为仅限移动设备加载特定的 Slider Revolution？

Question

我知道 revolution-slider 有一个 responsive 功能，但不幸的是它仍然在桌面上加载所有移动资产，反之亦然，增加了页面时间-load.

所以我更愿意有 2 个不同的滑块，每个设备一个。

最好的解决方案是什么？

Answer 1

这取决于您如何在页面中设置 revslider。

我认为实现您真正想要（需要）的最好方法是使用 php 和条件规则：

1) 在您的模板中使用基于移动检测的条件。这样你就可以避免同时加载 2 revslider。

您可以为此目的使用 wp_is_mobile() 条件 wordpress 函数：

<?php
    if ( !wp_is_mobile() ) {
        echo do_shortcode('[rev_slider alias="my_desktop_slider"]');
    } 
    else
    {
        // mobile devices
        echo do_shortcode('[rev_slider alias="my_mobile_slider"]');
    }
?>

2) 在具有该条件的自定义简码中：

if( !function_exists('rev_slider_detection') ) {

    function rev_slider_detection( $atts ) {

        extract(shortcode_atts(array(
            'alias' => '' // the alias name of your desktop rev-slider
        ), $atts));

        $output = '[rev_slider alias="';

        if ( !wp_is_mobile() ) {
            // For desktop only
            $output .= $alias . '"]';
        } else {
            // For mobile only
            $output .= $alias . '_mob"]';
        }

        return $output;
        // or (because untested)
        // return do_shortcode('" . $output . "');
    }

    add_shortcode('my_rev', 'rev_slider_detection');
}

您将以这种方式使用它：[my_rev alias="my_revslider_alias_slug"] 并且您将需要一个转速滑块的 2 个实例，第一个用于带有别名的桌面（例如 home）和第二个用于具有相同别名的移动设备+“_mob”（例如home_mob）。

参考：

• WP codex wp_is_mobile
• WP codex do_shortcode
• Shortcode Generator

您还可以制定更准确的脚本来检测平板电脑和手机，然后将其用作不同设备类型的条件。

Answer 2

echo do_shortcode($output); // 适合我

Answer 3

这对我有用。 normal/desktop版本只需要一个[简码]，_mob版本会自动选择。

if( !function_exists('rev_slider_detection') ) {

    function rev_slider_detection( $atts ) {

        extract(shortcode_atts(array(
            'alias' => ''
        ), $atts));

        $output = '[rev_slider alias="';

        if ( !wp_is_mobile() ) {
            // For desktop only
            $output .= $alias . '"]';
        } else {
            // For mobile only
            $output .= $alias . '_mob"]';
        }

        return do_shortcode($output);
        // or (try this if not working)
        // return $output;
    }

    add_shortcode('my_rev', 'rev_slider_detection');
}