如何向手机提供移动版网站答案

【问题标题】：How to serve a mobile version of website to phones如何向手机提供移动版网站
【发布时间】：2014-02-09 16:54:18
【问题描述】：

我已搜索但未在论坛上找到我要查找的内容。我有一个标准的 HTML（不是 wordpress）网站。它在台式机和 ipad 上显示效果很好。我使用 jquery mobile 构建了一个非常缩小的移动版本，仅包含基本信息。
问题是，如何将移动文件仅提供给手机？我可以使用什么代码告诉手机使用 jquery 移动文件或 url 而不是普通的桌面文件？我还在网站的 jquery 移动版上添加了一个“查看完整网站”按钮。如果选择“查看完整站点”并且一旦选择不返回移动版本，我如何让手机显示完整站点？我在许多网站上都看到了这一点，但无法弄清楚。谢谢你的帮助！迈克

这是我在 mikeschaler.com 上的主要网站

// will allow to use sessions
session_start();

if(!isset($_SESSION['mobile_detect'])) {
    require_once 'Mobile_Detect.php';
    $detect = new Mobile_Detect;

    if ( $detect->isMobile() ) {
        header('Location: mobile.mikeschaler.com');    
    }
}

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />


<link rel="shortcut icon" href="/MESfavicon.ico" type="image/x-icon" />
<link rel="icon" href="/MESfavicon.ico" type="image/x-icon">

<title>Mike Schaler Media Services</title>

<style type="text/css"></style>

<link href="mikeSiteRedesign.css" rel="stylesheet" type="text/css" />

<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-19130075-1']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>

</head>

这是我尝试在 mobile.mikeschaler.com 上为移动用户提供服务的移动网站：

<!doctype html>
<html>
<head>
    <title>Precison Garage Door</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="themes/Precision-Garage-Door.min.css" />
        <link rel="stylesheet" href="themes/jquery.mobile.icons.min.css" />
        <link rel="stylesheet" href="jquery.mobile.structure-1.4.0.min.css" />
        <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
        <script src="jquery.mobile-1.4.0.min.js"></script>

session_start();
$_SESSION['mobile_detect'] = 0;
header('Location: mikeschaler.com/index.html');

    </head>

这就是你要找的吗？谢谢！

好的，我从 mobile.mikeschaler.com 网站上删除了代码。我用“// 将允许使用会话会话开始...”代码创建了一个 php 文件。
在 mikeschaler.com 网站上，我在代码顶部插入了所有这些是否正确？迈克

完整的网站代码现在看起来像这样：

<?php 
mobileRedirect.php 
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

【问题讨论】：

您必须将 PHP 放入并将文件另存为 .php。此外，从您的移动网站中停用 PHP 代码。我们将一步一步地做到这一点。
希望你看到我上面的回复。感谢您在这方面和我在一起！迈克
不忘记把代码放到中应该是对的
是的，我错过了。现在更改并重新上传了php文件。
但是我是否有权在整个站点上调用 php 重定向文件？不确定执行 php 代码的语法。

标签： jquery html jquery-mobile mobile

【解决方案1】：

您可以使用一些 PHP 脚本来检测移动版本，例如：http://mobiledetect.net/

然后，对于“完整网站”按钮，将用户发送到：fullwebsite.php。该页面将设置一个会话，表明它必须不检测移动版本。

// will allow to use sessions
session_start();

if(!isset($_SESSION['mobile_detect'])) {
    require_once 'Mobile_Detect.php';
    $detect = new Mobile_Detect;

    if ( $detect->isMobile() ) {
        header('Location: your_url.html');
    }
}

设置会话的页面：

session_start();
$_SESSION['mobile_detect'] = 0;
header('Location: full_website.html');

【讨论】：

感谢 Codel96，除了我可以在 PHP 文件中使用 HTML 外，我对 php 的了解并不多。我查看了 mobiledetect.net 站点，那里有一些很棒的信息。我将如何实现 php 脚本以仅将移动版本提供给手机？我会简单地将它插入我网站的标题中吗？那么对于“查看完整站点”，该代码将去哪里？如果您想查看，我可以通过电子邮件发送指向我正在处理的内容的链接。谢谢你的帮助！迈克
我给的第一个代码必须放在文件的顶部，在 HTML 之前，然后你可以进行重定向（我编辑了我的代码）。只需下载 Mobile_detect.php，将其放在服务器上与文件相同的路径，然后将该代码放入必须重定向的文件中。
在这里挣扎...我复制了第一个代码并添加了我的移动网站网址。这是我使用的代码： // 将允许使用会话 session_start(); if(!isset($_SESSION['mobile_detect'])) { require_once 'Mobile_Detect.php'; $detect = 新的 Mobile_Detect； if ( $detect->isMobile() ) { header('mobile.mikeschaler.com/index.html');我把它放在结束的标记之上。我下载了 mobile_detect.php 文件，但下载中有很多文件和文件夹。不确定我需要上传整个文件夹还是只上传一个文件。
有 2 个名为 Mobile Detect... MobileDetect.php 和 Mobile_Detect.php 的 php 文件我假设我使用脚本中的第二个文件。所以最后，最后一个代码： session_start(); $_SESSION['mobile_detect'] = 0; header('位置：mikeschaler.com/index.html');会在移动网站上面结束？标签？感谢您的耐心和帮助！迈克
第一段代码被注入到我网站的标题中：mikeschaler.com 不知道为什么，除了可能是因为第二个 if 语句说 header('mobile.mikeschaler.com/index.html') ;

【解决方案2】：

<?php
// will allow to use sessions
session_start();

if(!isset($_SESSION['mobile_detect'])) {
    require_once 'Mobile_Detect.php';
    $detect = new Mobile_Detect;

    if ( $detect->isMobile() ) {
        header('Location: mobile.mikeschaler.com');    
    }
}
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

这是您必须输入的代码，而不是您的代码。

然后是mobile.php中的代码：

<?php
session_start();
$_SESSION['mobile_detect'] = 0;
header('Location: /'); // "/" to redirect to the root path
?>

【讨论】：

嗯。当我添加它时，我在 mikeschaler.com 页面顶部看到了部分代码
你必须将它保存为.php
哦，你是说我的索引文件吗？所以我将我的 index.html 文件保存为 index.php？从来没有想过！那么我假设我删除了我的 index.html 文件并上传了 index.php 文件。服务器会知道改用 php 吗？我的新领域！谢谢
这越来越有趣了！好的，index.php 页面（主页）现在看起来不错。当我转到桌面上的 mobile.mikeschaler.com 网址时，它看起来与预期的一样。您可以猜到我接下来要输入什么...当我转到 mikeschaler.com 网址时，它会在我的手机上重定向到 mobile.mikeschaler.com，但随后显示 404 错误页面未找到。我不得不承认这变得非常令人兴奋。
您必须在标题位置设置完整的 url：http:// 因为没有它，它会认为您的 url 是页面或文件夹。