Dedecms移动端网站手机网站的搭建的方法

Dedecms移动端网站手机网站的搭建的方法,第1张

Dedecms移动端网站手机网站的搭建的方法

本文主要介绍了Dedecms移动网站建设方法的相关信息。边肖认为这很好。现在分享给大家,给大家一个参考。来和边肖一起看看吧。

现在网站在手机上浏览越来越成为一种趋势,比如IPAD。所以作为站长,我们也需要与时俱进,让网站适应手机。好在DEDECMS已经提供了移动端建站功能,可以和PC端共享一套数据。虽然目前功能还不完善,但已经达到了可以使用的程度。

步骤1:安装Dedecms移动站点

(1)下载新版本,直接安装。Dedecms版本:V5.7SP1正式版(2015-06-18)及以后的版本都提供了老版本没有的移动站点功能。

(2)升级旧版本(仅用于增加移动站点功能),从DEDE官网下载最新版本(注意网站代码要与原一致),将压缩包中的以下文件复制到原网站的相应目录下:

注意:

如果原始电台有非默认模板,如/templates/defaultst_default_news.htm,您可以复制/templates/defaultst_default_m.htm,并将其重命名为list_list_default_news_m.htm

即pc网站模板必须有对应的手机网站模板,其文件名为前一个文件名加“_m”。

或者dedecms安装完成,此时移动跳转适配应该准备好了。但是,我们在使用dedecms提供的移动站点功能时发现了一些问题。目前德德官方还没有改进,需要我们自己修改后才能正常使用。如果你在按照以下方法 *** 作的过程中发现有什么不同,那就是DEDE官方已经改正了,所以你可以跳过。

步骤2:修改Dedecms

(1)如果原站已经进行了将数据目录移到根目录外的安全设置方案,需要修改/m/index.php代码:

if(!file_exists(dirname(__FILE__).'/../data/common.inc.php')) { header('Location:install/index.php'); exit(); }

哪里/../data/common.inc.php改为/../../data/common.inc.php,或者直接删除上面5行代码。

(2)移动站点的主页在第一次访问时会自动生成一个静态文件。确保将/m/目录设置为可写权限,否则将不会写入静态主页文件。但是更新完主页静态文件后,需要登录后台手动更新:在更新主页HTML中,将“选择主页模板”改为“default/index_m.htm”,将“主页位置”改为“../m/index.html",然后点击生成主页静态文件。虽然有点麻烦,但总比没有强。当然,你也可以直接设置一个动态的游览index.php的方式。

注意默认的移动站模板header_m.htm带有的动态主页链接,如果要静态访问主页,需要用替换;静态链接形式。※如果觉得用静态页面比较麻烦,想把主页设置成动态浏览,可以修改/m/index.php::

$row['showmod']=isset($row['showmod'])?$row['showmod']:0; if($row['showmod']==1) { $pv->SaveToHtml(dirname(__FILE__).'/index.html'); include(dirname(__FILE__).'/index.html'); exit(); }else{ $pv->Display(); exit(); }

用一行代码替换上面的代码:

$pv->Display();

第三步:修改模板中的错漏:

全部搜索

第四步:通用表头包含搜索框,搜索跳转到pc搜索页面。建议删除:

删除/templates/default/header_m.htm中的以下代码:

<formclass="am-topbar-formam-topbar-leftam-form-inlineam-topbar-right"role="search"action="{dede:global.cfg_cmsurl/}/plus/search.php"> <inputtype="hidden"name="mobile"value="1"/> <inputtype="hidden"name="kwtype"value="0"/> <divclass="am-form-group"> <inputname="q"type="text"class="am-form-fieldam-input-sm"placeholder="输入关键词"> </div> <buttontype="submit"class="am-btnam-btn-defaultam-btn-sm">搜索</button> </form>

第五步:设置移动站点的二级域名

DEDE的移动站点默认使用二级目录,但目前百度在搜索移动适配时需要使用二级域名(前段时间有可能使用二级目录,现在已经调整了,所以需要设置移动站通过二级域名访问,将二级域名解析为网站所在服务器的ip,将它附加域到服务器间的/m/目录空。

成功设置二级域名后,通过二级域名浏览网站会发现图片无法显示,因为图片路径错误——默认图片路径是“/uploads/x/y.jpg”样式的相对链接。

这种形式的相对根目录路径通常显示在pc站的页面中。这是因为这个目录存在于pc站的域名下,而二级addon域是二级目录,二级目录的下级目录中不存在这个目录。所以访问图片会返回404错误。对于这一点,有很多解决方法。这里有两个想法(例子pc站:www.bnxb.com;移动站:m.bnxb.com):

(1)URL重写(推荐)

重写从http://m.bnxb.com/uploads/到http://www.bnxb.com/uploads/,Apache环境的访问,并在。htaccess(如果没有,在/m/目录中创建一个新的):

RewriteEngineon RewriteCond%{http_host}^m.bnxb.com[NC] RewriteRule^uploads/(.*)$http://www.bnxb.com/uploads/$1[L]

iis和Nginx环境中的类似规则。

(2)修改模板路径。

<basehref="http://www.bnxb.com"/>

然后把

  • “<Ahref="list.php"被更改为完整路径"
  • “<Ahref="viewphp"被更改为完整路径"

    (3)启用DEDE的绝对网址功能。

    ①点击-系统-系统基础设置-核心设置-(是/否)支持多站点。打开此项目后,将使用绝对URL启用附件、列连接和arclist内容:选择是。

    ②找到\include\dialog\select_images_post.php的第108行。

    $fileurl=$activepath。'/'.$filename

    替换为:

    $fileurl=$cfg_cmsurl。$activepath。'/'.$filename

    ③修改目录include下的文件extend.func.php,在最后面添加一个函数方法functionreplaceurl($newurl){$newurl=str_replace('src="/uploads/allimg/','src="http://你的域名/uploads/allimg/',$newurl);return$newurl;}③修改目录include下的文件extend.func.php,在末尾增加一个函数方法functionreplaceURL($newURL){$newURL=str_replace('src="/uploads/allimg/','src="http://yourdomainname/uploads/allimg/',$newURL);返回$newurl}

    ④调用文章正文的标签{dede:field.body/}。

    需要更改为:{dede:field.bodyfunction='replaceURL(@me)'/}

    以上三种方法都可以。

    另外,需要将根目录下的/images/defaultpic.gif(缩略图默认图片)复制到5.7SP1以前版本中的/m/目录下,否则如果列表页面中有没有缩略图的文章,对应的缩略图位置将无法正常显示图片。SP2已经在将来纠正了这个错误。可以跳过。

    其他:

    1.如果有您不想在主页底部的列表区域或常规标题中显示的列,您可以在后台的相应列管理/常规选项中设置隐藏。

    第六步。为了更好的实现pc端和移动端的自动匹配和分离浏览效果,可以在pc模板中添加一个类似如下的自动跳转代码:

    主页

    <metahttp-equiv="mobile-agent"content="format=xhtml;url={dede:global.cfg_mobileurl/}/"> <scripttype="text/javascript"> if(window.location.toString().indexOf('pref=padindex')!=-1){}else{if(/AppleWebKit.*Mobile/i.test(navigator.userAgent)||(/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amoi|ZTE/.test(navigator.userAgent))){if(window.location.href.indexOf("?mobile")<0){try{if(/Android|WindowsPhone|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)){window.location.href="{dede:global.cfg_mobileurl/}/";}elseif(/iPad/i.test(navigator.userAgent)){}else{}}catch(e){}}}} </script>

    列页面

    <metahttp-equiv="mobile-agent"content="format=xhtml;url={dede:global.cfg_mobileurl/}/list.php?tid={dede:field.id/}"> <scripttype="text/javascript"> if(window.location.toString().indexOf('pref=padindex')!=-1){}else{if(/AppleWebKit.*Mobile/i.test(navigator.userAgent)||(/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amoi|ZTE/.test(navigator.userAgent))){if(window.location.href.indexOf("?mobile")<0){try{if(/Android|WindowsPhone|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)){window.location.href="{dede:global.cfg_mobileurl/}/list.php?tid={dede:field.id/}";}elseif(/iPad/i.test(navigator.userAgent)){}else{}}catch(e){}}}} </script>

    文章页面

    <metahttp-equiv="mobile-agent"content="format=xhtml;url={dede:global.cfg_mobileurl/}/view.php?aid={dede:field.id/}"> <scripttype="text/javascript"> if(window.location.toString().indexOf('pref=padindex')!=-1){}else{if(/AppleWebKit.*Mobile/i.test(navigator.userAgent)||(/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amoi|ZTE/.test(navigator.userAgent))){if(window.location.href.indexOf("?mobile")<0){try{if(/Android|WindowsPhone|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)){window.location.href="{dede:global.cfg_mobileurl/}/view.php?aid={dede:field.id/}";}elseif(/iPad/i.test(navigator.userAgent)){}else{}}catch(e){}}}} </script>

    上面的代码被新版本的dedecms模板使用。第一行;代码是供百度查找并跳转到相应的移动站点。下面几行javascript代码的作用是识别移动设备是否访问,如果是,当前pc页面会自动跳转到匹配的移动页面。

    因为有些DEDECMS升级不完整,所以系统中可能不一定存在变量{dede:global.CFG_mobileURL/}。因此,有两种方法:

    1.将代码中的{dede:global.cfg_mobileurl/}部分替换为包含“http://”的二级域名(即http://m.bnxb.com)。如果不想修改模板中的相关代码,也可以修改/include/common.inc.php中的变量$cfg_mobileurl,将其赋为二级域名。

    2.在DEDECMS后台新建一个变量cfg_mobileurl,赋值为http://m.bNXb.com

    以上两种方法随便选一种。

    此外,您还可以使用

    电脑主页模板:

    <linkrel="alternate"media="onlyscreenand(max-width:640px)"href="http://m.bnxb.com">

    PC栏页面模板:

    <linkrel="alternate"media="onlyscreenand(max-width:640px)"href="http://m.bnxb.com/list.php?tid={dede:field.id/}">

    PC文章页面模板:

    <linkrel="alternate"media="onlyscreenand(max-width:640px)"href="http://m.bnxb.com/view.php?aid={dede:field.id/}">

    移动主页模板:

    <linkrel="canonical"href="http://www.bnxb.com/"/>

    栏页面模板:

    <linkrel="canonical"href="http://www.bnxb.com{dede:typetypeid='0'row=1}[field:typelink/]{/dede:type}"/>

    页面模板:

    <linkrel="canonical"href="http://www.bnxb.com/{dede:field.idrunphp='yes'}$id=@me;@me='';$url=GetOneArchive($id);@me=$url['arcurl'];{/dede:field.id}"/>

    至此,移动台架设已基本成型。

    百度提交移动跳转适配。

    这一步非常重要,因为网站流量的主要来源是百度。

    首先,注册百度站长平台http://zhanzhang.baidu.com/,并添加网址。

    具体情况选择url适配格式:
    http://www.bnxb.comhttp://m.bnxb.com
    http://www.bnxb.com/wangluoyingxiaohttp://m.bnxb.com/list.php?tid=13
    http://www.bnxb.com/wangzhanyouhuahttp://m.bnxb.com/list.php?tid=8
    http://www.bnxb.com/wangzhanzhuanhttp://m.bnxb.com/list.php?tid=21
    http://www.bnxb.com/chengONG

    规则的URL适应主要内容页面。表达式如下:
    http://www.bnxb.com/(\w+)/(\d+)/(\d+)。html
    http://aid=

    适应模式:

    栏目页面对应关系不规则,数量少,采用URL适配;文章都是正规网址,而且数量很大,用规则来适应。

    规则适配提交页面(如图所示):

    适配首页和栏目页面URL(如图所示):

    对于有很多栏目的Dedecms网站来说,手动列出所有栏目页面URL对显然很麻烦。这里有一个方法可以轻松解决这个问题:

    在模板中嵌入下面的代码,所有栏目的URL对都可以显示在对应的首页,复制粘贴即可。※:


    复制代码如下:{dede:channelartlistrow=100typeid='top'}http://m.bnxb.com/list.php?tid={dede:field<;/a>;name='id'/}
    {dede:channeltype='son'noself='true'}<;ahref="http://www.bnxb.com[field:typelink/">;http://www.bnxb.com[field:typelink/<;/a>;]<;ahref="http://m.bnxb.com/list.PHP?tid=[field:id/]<;br">http://m.bnxb.com/list.php?tid=[field:id/]<;br</a>;>{/dede:channel}{/dede:channelartlist}

    提交规则适配,等待百度审核。※.

    如果提交的适配关系有误,处理状态会很快提示“验证失败”。

    这就是本文的全部内容。希望对大家的学习有帮助,支持我们。

    欢迎分享,转载请注明来源:内存溢出

    原文地址: http://www.outofmemory.cn/zz/772060.html

  • (0)
    打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
    上一篇 2022-05-03
    下一篇 2022-05-03

    发表评论

    登录后才能评论

    评论列表(0条)

    保存