代码之家  ›  专栏  ›  技术社区  ›  Ads

根据用户是移动用户还是桌面用户,显示不同的标题图像?(Wordpress,“2017”)

  •  1
  • Ads  · 技术社区  · 7 年前

    对不起,这可能是一个愚蠢的问题。我发现很多 出身背景 图片,但Wordpress“2017”使用“标题媒体”,这是我想基于桌面/手机改变的。

    基本上,如果是移动设备,他们会得到“header-a.jpg”,如果是桌面设备,他们会得到“header-b.jpg”。

    我想有一个CSS解决方案,但我找不到!

    非常感谢你帮助我!

    2 回复  |  直到 7 年前
        1
  •  1
  •   James Jones    7 年前

    因为这是一个默认主题,所以您想要查看的函数是 get_header_image_tag() get_header_image_tag

    您需要添加一些php代码。因此,要么创建一个子主题,然后将代码添加到主题的 functions.php 文件或创建自定义插件,并在其中添加代码。代码应该类似于:

    function custom_header_image_tag( $html, $header, $attr ) {
        if(strstr($_SERVER['HTTP_USER_AGENT'],'Android') || strstr($_SERVER['HTTP_USER_AGENT'],'webOS') || strstr($_SERVER['HTTP_USER_AGENT'],'iPhone') ||strstr($_SERVER['HTTP_USER_AGENT'],'iPod') || strstr($_SERVER['HTTP_USER_AGENT'],'iPad') || strstr($_SERVER['HTTP_USER_AGENT'],'Windows Phone') || wp_is_mobile()){
            $html = "insert custom header image tag here";
        }
        return $html;
    }
    add_filter( 'get_header_image_tag', 'custom_header_image_tag, 10, 3);
    
        2
  •  1
  •   Ashish Patel    7 年前

    我已经尝试了下面的word-press代码,它可以检测网站是否加载到手机或桌面上,正如文档中提到的,该代码将平板电脑视为移动设备。

    <?php
    if ( wp_is_mobile() ) { 
        /*mobile specific stuff*/
    
        /* header-a.jpg */
    
    }
    else{
        /*desktop specific stuff*/
    
    
        /* header-b.jpg */
    
    }
    ?>
    

    查看下面的链接,

    wp is mobile