帝国cms如何做移动端适配

帝国cms如何做移动适配？首先我们要明白移动适配中的几个要点。

1、PC页面和对应的移动页面主体内容必须完全对等

尽量保持原PC页面信息量不变，但为了移动页面美观和访问速度，可以删减不太重要的模块和细分导航，但页面主体内容必须保持不变，比如文章正文或目录页面的链接数和链接指向要完全一致。

2、PC和移动的适配关系必须是一对一，不能多对一

若某些PC页面没有对应的移动页，那这些PC页可以不提交适配关系，但不能将多个PC页面同时指向一个移动页面，比如某文章页面在PC上有分页，到了移动站上分页取消，原PC文章所有分页都指向了同一个移动页面，这也会导致校验识别。PS：允许出现一个PC页面对应两个移动页的情况：一个是给高端机看的，一个是给低端机看的。

综上两点我们使用帝国cms多访问端，可以很好的解决移动端适配问题。帝国cms多访问端可以参考帝国cms手机端pc怎么同步这篇文章。使用帝国多访问端可以实现路径的一一对应。接下来我们来看看适配移动端代码。

如：pc站：www.moyouyouw.cn 手机：m.moyouyouw.cn

js是浏览器跳转，meta是告诉搜索引擎移动页面的地址。

具体规则

PC首页：https://www.moyouyouw.cn

<script type="text/javascript">
try {var urlhash = window.location.hash;if (!urlhash.match("fromapp"))
{if ((navigator.userAgent.match(/(iPhone|iPod|Android|ios|iPad)/i)))
{window.location="https://m.moyouyouw.cn/";}}}
catch(err)
{
}</script>
<meta name="mobile-agent" content="format=xhtml;url=https://m.moyouyouw.cn/">  

PC封面：https://news.moyouyouw.cn

<script type="text/javascript">
try {var urlhash = window.location.hash;if (!urlhash.match("fromapp"))
{if ((navigator.userAgent.match(/(iPhone|iPod|Android|ios|iPad)/i)))
{window.location="https://m.moyouyouw.cn/listinfo-[!--self.classid--]-0.html";}}}
catch(err)
{
}</script>
<meta name="mobile-agent" content="format=xhtml;url=https://m.moyouyouw.cn/listinfo-[!--self.classid--]-0.html">

PC列表：https://news.moyouyouw.cn/lzwx/

<script type="text/javascript">
try {var urlhash = window.location.hash;if (!urlhash.match("fromapp"))
{if ((navigator.userAgent.match(/(iPhone|iPod|Android|ios|iPad)/i)))
{window.location="https://m.moyouyouw.cn/listinfo-[!--self.classid--]-0.html";}}}
catch(err)
{
}</script>
<meta name="mobile-agent" content="format=xhtml;url=https://m.moyouyouw.cn/listinfo-[!--self.classid--]-0.html">

PC内容：https://news.moyouyouw.cn/lzwx/127077.html

<script type="text/javascript">
try {var urlhash = window.location.hash;if (!urlhash.match("fromapp"))
{if ((navigator.userAgent.match(/(iPhone|iPod|Android|ios|iPad)/i)))
{window.location="https://m.moyouyouw.cn/showinfo-[!--classid--]-[!--id--]-0.html";}}}
catch(err)
{
}</script>
<meta name="mobile-agent" content="format=xhtml;url=https://m.moyouyouw.cn/showinfo-[!--classid--]-[!--id--]-0.html">

至此，帝国cms如何做移动端适配教程介绍完毕!