用Phpcms V9系統(tǒng)制作手機(jī)版網(wǎng)站的方法

2016-04-26 16:38:47來源:cmsyou作者:

隨著智能手機(jī)的普及和移動(dòng)網(wǎng)速的提高,手機(jī)網(wǎng)站的需求不斷提高,進(jìn)來不少朋友都會(huì)聊到一個(gè)話題:手機(jī)網(wǎng)站怎么做?今天CMSYOU在這里就與大家分享怎么用PC V9做手機(jī)網(wǎng)站,Phpcms V9手機(jī)門戶設(shè)置的具體方法。

隨著智能手機(jī)的普及和移動(dòng)網(wǎng)速的提高,手機(jī)網(wǎng)站的需求不斷提高,進(jìn)來不少朋友都會(huì)聊到一個(gè)話題:手機(jī)網(wǎng)站怎么做?今天CMSYOU在這里就與大家分享怎么用PC V9做手機(jī)網(wǎng)站,Phpcms V9手機(jī)門戶設(shè)置的具體方法。

在說具體配置Phpcms V9手機(jī)門戶前,先簡(jiǎn)單說下什么是手機(jī)網(wǎng)站,以及手機(jī)網(wǎng)站是怎么樣的。

手機(jī)網(wǎng)站最早的概念是WAP網(wǎng)站,WAP是英文Wireless Application Protocol的縮寫,意思是無線應(yīng)用協(xié)議。WAP是一種GPRS應(yīng)用模式,但并不是手機(jī)上網(wǎng)的唯一模式,其實(shí)WAP本身和手機(jī)網(wǎng)站并不是一回事,手機(jī)上網(wǎng)也不僅僅是瀏覽wap網(wǎng)站。

慢慢地,隨著移動(dòng)終端及及移動(dòng)網(wǎng)絡(luò)環(huán)境(3G、WIFI等)的升級(jí),使用手機(jī)查看網(wǎng)頁(yè)和上網(wǎng)的人也會(huì)越來越多,應(yīng)用也越來越廣泛。現(xiàn)在在智能手機(jī)、平板多屏?xí)r代,于是要求手機(jī)網(wǎng)站不僅僅是要適應(yīng)手機(jī)瀏覽,而且需要根據(jù)屏幕大小而做最佳匹配,也就是屏幕自適應(yīng)。"自適應(yīng)網(wǎng)頁(yè)設(shè)計(jì)"(Responsive Web Design)這個(gè)名詞,指網(wǎng)站可以自動(dòng)識(shí)別屏幕寬度、并做出相應(yīng)調(diào)整的網(wǎng)頁(yè)設(shè)計(jì)。

于是出來一個(gè)問題:這樣的手機(jī)網(wǎng)站是怎么做的?會(huì)出現(xiàn)這樣的詞:CSS3、HTML5、響應(yīng)式、自適應(yīng)、匹配等,這是另外一個(gè)大的問題了,大家自行了解(想了解什么是自適應(yīng)?之前我們發(fā)布的【2014流行的10款響應(yīng)式前端開發(fā)框架介紹】,或許能了解一些)。

簡(jiǎn)單的說,屏幕自適應(yīng)網(wǎng)站,需要具備這些基本特性:允許網(wǎng)頁(yè)寬度自動(dòng)調(diào)整、不使用絕對(duì)寬度、相對(duì)大小的字體、流動(dòng)布局(fluid grid)、選擇加載CSS、圖片的自適應(yīng)(fluid image)等。

進(jìn)入正題:怎么配置PC V9開啟手機(jī)網(wǎng)站。

先說下效果,比如CMSYOU官網(wǎng)啟用了m.cmsyou.com這個(gè)二級(jí)域名作為手機(jī)網(wǎng)站(當(dāng)時(shí)的說明:思優(yōu)CMSYOU開啟手機(jī)端訪問,歡迎大家測(cè)試。蠹铱梢杂肅hrome或者高版本瀏覽器訪問m.cmsyou.com,拉動(dòng)屏幕寬度試試,內(nèi)容會(huì)自適應(yīng)。截圖如下:

手機(jī)網(wǎng)站

這個(gè)就是采用PC V9配置的手機(jī)網(wǎng)站,下面來分享這一方法。

一、在PHPcms V9管理后臺(tái)設(shè)置手機(jī)門戶

1.1、開啟手機(jī)網(wǎng)站。位置:模塊 》手機(jī)門戶 》 添加手機(jī)站點(diǎn),具體設(shè)置可參照截圖:

Phpcms V9手機(jī)門戶設(shè)置教程

填寫站點(diǎn)名和LOGO文件相對(duì)位置,綁定用于手機(jī)網(wǎng)站的二級(jí)域名m.cmsyou.com,域名以http://開頭。

1.2、創(chuàng)建欄目分類,位置:模塊 》手機(jī)門戶 》 分類管理,具體設(shè)置可參照截圖:

Phpcms V9手機(jī)門戶設(shè)置教程

創(chuàng)建好分類,綁定相應(yīng)的欄目。

這樣,手機(jī)網(wǎng)站在管理后臺(tái)的配置基本上完成。

二、域名解析、手機(jī)域名綁定

2.1、到域名管理中心,解析二級(jí)域名m.cmsyou.com到PC網(wǎng)站所在的IP,同時(shí)在主機(jī)控制面板,添加綁定m.cmsyou.com這個(gè)域名。

2.2、修改配置文件caches/configs/route.php,在‘default‘=>array(‘m‘=>‘content‘, ‘c‘=>‘index‘, ‘a‘=>‘init‘),后面添加一行,修改為:

return array(
‘default‘=>array(‘m‘=>‘content‘, ‘c‘=>‘index‘, ‘a‘=>‘init‘),
‘m.cmsyou.com‘=>array(‘m‘=>‘wap‘, ‘c‘=>‘index‘, ‘a‘=>‘init‘,‘data‘=>array(‘GET‘=>array(‘siteid‘=>1))),
);

2.3、在管理后臺(tái)刷新緩存,等域名解析生效后,訪問m.cmsyou.com試試。由于手機(jī)網(wǎng)站需要用index.php作為引導(dǎo),可以在主機(jī)控制面板里邊設(shè)置index索引次序,index.php調(diào)整先后次序高于index.html。

如果主機(jī)控制面板里邊沒有這個(gè)設(shè)置項(xiàng),那么就需要手機(jī)模板(index.html或者h(yuǎn)eader.html)里邊加入一段js:

<script>
try {if( self.location == "http://wap.domain.com/" ) { 
top.location.href = "http://wap.domain.com/index.php"; 
catch(e) {}
</script>

三、修改自定義手機(jī)網(wǎng)站模板,開始制作自適應(yīng)網(wǎng)站吧!

域名解析生效后,通過m.cmsyou.com就能訪問到手機(jī)網(wǎng)站了,那么怎么控制手機(jī)網(wǎng)站顯示的樣式呢,自然是修改定制手機(jī)模板。

具體位置:/phpcms/templates/default/wap/或者自定義模板目錄。

關(guān)鍵詞:Phpcms手機(jī)站