如何为移动版设置不同的静态主页?(wordpress)

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/16165211/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-09-08 19:13:12  来源:igfitidea点击:

How to set a different Static homepage for Mobile version? (wordpress)

wordpress

提问by Ronald Wildschut

I would like to have a different static homepage for my mobile version of my website. It is not really an extra mobile version but it is responsive.

我想为我的网站的移动版本使用不同的静态主页。它实际上并不是一个额外的移动版本,但它具有响应性。

I have a Fullscreen Image slider right now set as the static homepage. This scales to the screensize, due to the resposive build of the website, but it does not look very nice on a mobile device, such as an iPhone. So I have this other homepage template wich I would like to use when the website is being viewed on a mobile device.

我现在有一个全屏图像滑块设置为静态主页。由于网站的响应式构建,这会缩放到屏幕大小,但它在移动设备(例如 iPhone)上看起来不太好。所以我有另一个主页模板,我想在移动设备上查看网站时使用它。

Can this be done by any plugins or should it be done by coding? I don't want to use a theme switcher or something like that, I just want to have a different static page set for mobile devices.

这可以通过任何插件来完成还是应该通过编码来完成?我不想使用主题切换器或类似的东西,我只想为移动设备设置不同的静态页面。

Anyone knows how to do this?

任何人都知道如何做到这一点?

回答by diggy

You could use wp_is_mobileto check for mobile, and hook into template_redirectto load a different template if mobile is detected:

您可以使用wp_is_mobile来检查移动设备,并在检测到移动设备时挂钩template_redirect以加载不同的模板:

function so16165211_mobile_home_redirect(){
    if( wp_is_mobile() && is_front_page() ){
        include( get_template_directory() . '/home-mobile.php' );
        exit;
    }
}
add_action( 'template_redirect', 'so16165211_mobile_home_redirect' );

回答by MrZiggyStardust

I would include Mobile-Detectinto the theme in its own folder and add this code in the beginning of header.php:

我会将Mobile-Detect包含在其自己文件夹中的主题中,并在header.php的开头添加此代码:

if( is_front_page() ){

    include_once('mobile-detect/Mobile_Detect.php');
    $detect = new Mobile_Detect(); 

    if ( $detect->isMobile() || $detect->isTablet() ) {
        $redirect_url = 'http://example.com/mobile_home';
        header('Location: ' . $redirect_url ); // Redirect the user
    }
}

You could customize this solution to work just as you want. I have used this for several projects for similiar solutions.

您可以自定义此解决方案,使其随心所欲地工作。我已经将它用于类似解决方案的几个项目。

回答by Sander Steffen

This should work: (insert it in functions.php)

这应该有效:(将其插入到functions.php中)

    //* Redirect homepage on mobile
add_action( 'wp_head', 'wps_params', 10 );
function wps_params() {
    ?>
     <script>
 if (window.location.pathname == '/' && jQuery(window).width() <= 480) {
    window.location = "/webshop/";
 }
 </script>

    <?php
}

Replace "/webshop/" with your link of the mobile homepage.

将“/webshop/”替换为您的移动主页链接。

回答by Everaldo Matias

This is great for me:

这对我来说很棒:

function so16165211_mobile_home_redirect(){
    if( wp_is_mobile() && is_front_page() ){
        include( get_template_directory() . '/home-mobile.php' );
        exit;
    }
}

回答by Yahya Hussein

Adding the following to your functions.php should do the trick:

将以下内容添加到您的 functions.php 应该可以解决问题:

//* Redirect homepage on mobile

add_action( 'wp_head', 'wps_params', 10 );

function wps_params() {
?>

<script>
if (window.location.pathname == '/' && jQuery(window).width() <= 480) {
   window.location = "/webshop/";
}
</script>

<?php
}

回答by TesarG

It's easy and no need to code everything. Install "Redirection" plugin from wordpress repository. 1. Go to the settings page. 2. Enter the "Source URL" with your default desktop's homepage 3. On the "Match" option, select "URL and user agent" & on the "Action" option select "Redirect to URL". Click "Add Redirection". 4. New configuration option will be appeared. Give any title you want. The "Source URL" must be blank (means that is your base homepage). On the "User Agent" option, choose whether iPhone or Android. On the "Matched" option, set the redirection you want for the mobile homepage.

这很容易,无需对所有内容进行编码。从 wordpress 存储库安装“重定向”插件。1. 进入设置页面。2. 输入带有默认桌面主页的“源 URL” 3. 在“匹配”选项上,选择“URL 和用户代理”,然后在“操作”选项上选择“重定向到 URL”。单击“添加重定向”。4. 将出现新的配置选项。给出你想要的任何标题。“源 URL”必须为空(意味着这是您的基本主页)。在“用户代理”选项上,选择 iPhone 还是 Android。在“匹配”选项上,为移动主页设置所需的重定向。

Done!

完毕!

You surely can differentiate the homepage on desktop and mobile device based on the redirection you have set before with that plugin. However, you cannot have same url name (ex: www.abcde.com for desktop & www.abcde.com/mobilehomepage for mobile device).

您当然可以根据您之前使用该插件设置的重定向来区分桌面和移动设备上的主页。但是,您不能使用相同的 url 名称(例如:www.abcde.com 桌面和 www.abcde.com/mobilehomepage 移动设备)。

回答by user850010

You could try to use detectmobilebrowsersscript.

您可以尝试使用detectmobilebrowsers脚本。

As I remember it is just one php file and has a single function which asks how to treat different mobile devices(iPhones, iPads, Androids, Windows Phones, BlackBerry's and Palm devices).

我记得它只是一个 php 文件,只有一个功能,询问如何处理不同的移动设备(iPhone、iPad、Android、Windows Phone、BlackBerry 和 Palm 设备)。

You can get better idea how the script works by going to this function generatorpage.

通过转到此函数生成器页面,您可以更好地了解脚本的工作原理。