我想为我的移动版网站设置一个不同的静态主页。它并不是一个额外的移动版本,但它是响应式的。
我现在有一个全屏图像滑块设置为静态主页。由于网站的响应式构建,这可以缩放到屏幕大小,但在移动设备(例如 iPhone)上看起来不是很好。所以我有另一个主页模板,我想在移动设备上查看网站时使用它。
这可以通过任何插件来完成还是应该通过编码来完成?我不想使用主题切换器或类似的东西,我只想为移动设备设置不同的静态页面。
我怎样才能做到这一点?
我想为我的移动版网站设置一个不同的静态主页。它并不是一个额外的移动版本,但它是响应式的。
我现在有一个全屏图像滑块设置为静态主页。由于网站的响应式构建,这可以缩放到屏幕大小,但在移动设备(例如 iPhone)上看起来不是很好。所以我有另一个主页模板,我想在移动设备上查看网站时使用它。
这可以通过任何插件来完成还是应该通过编码来完成?我不想使用主题切换器或类似的东西,我只想为移动设备设置不同的静态页面。
我怎样才能做到这一点?
您可以使用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' );
我会将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
}
}
您可以自定义此解决方案以随心所欲地工作。我已经将它用于几个类似解决方案的项目。
这应该可以工作:(将其插入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
}
将“/webshop/”替换为您的手机主页链接。
您可以尝试使用detectmobilebrowsers脚本。
我记得它只是一个 php 文件,只有一个函数,询问如何处理不同的移动设备(iPhone、iPad、Android、Windows Phone、BlackBerry 和 Palm 设备)。
通过转到此函数生成器页面,您可以更好地了解脚本的工作原理。
这很容易,无需编写所有代码。从 wordpress 存储库安装“重定向”插件。1. 进入设置页面。2. 使用您的默认桌面主页输入“源 URL” 3. 在“匹配”选项中,选择“URL 和用户代理”并在“操作”选项中选择“重定向到 URL”。单击“添加重定向”。4. 将出现新的配置选项。给你想要的任何标题。“源 URL”必须为空白(表示这是您的基本主页)。在“用户代理”选项中,选择 iPhone 还是 Android。在“匹配”选项上,为移动主页设置所需的重定向。
完毕!
您当然可以根据您之前使用该插件设置的重定向来区分桌面和移动设备上的主页。但是,您不能使用相同的 url 名称(例如:www.abcde.com 用于桌面,www.abcde.com/mobilehomepage 用于移动设备)。
这对我来说很棒:
function so16165211_mobile_home_redirect(){
if( wp_is_mobile() && is_front_page() ){
include( get_template_directory() . '/home-mobile.php' );
exit;
}
}
将以下内容添加到您的 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
}