前一段部落已經(jīng)用上了Wordpress手機(jī)版主題，剛一上線就驚喜地發(fā)現(xiàn)原來(lái)有不少的朋友一直在用手機(jī)等移動(dòng)客戶(hù)端瀏覽博客，由此看來(lái)移動(dòng)流量已經(jīng)到了不得不重視的地步。之前一直用統(tǒng)計(jì)查看客戶(hù)端信息，發(fā)現(xiàn)來(lái)自PC的流量占了絕大多數(shù)。

而移動(dòng)流量卻基本上可以忽略不計(jì)。直到有 突然看到一篇文章才猛然醒悟不是來(lái)自移動(dòng)客戶(hù)端的流量少，而是一直以來(lái)博客都沒(méi)有針對(duì)移動(dòng)客戶(hù)端做好體驗(yàn)優(yōu)化。久而久之，搜索引擎不給關(guān)鍵字排名，直接瀏覽用戶(hù)越來(lái)越少，也就導(dǎo)致了統(tǒng)計(jì)中的“忽略不計(jì)”的結(jié)果了。

搭建一個(gè)Wordpress手機(jī)主題移動(dòng)版也不是一件難事，現(xiàn)在網(wǎng)上的Wordpress主題基本上都是自適應(yīng)的，平板、手機(jī)和PC電腦等基本上都是兼容的，強(qiáng)大的Wordpress插件也可以讓我們自定義Wordpress手機(jī)主題和樣式，搭建一個(gè)WP手機(jī)站基本上就是分分鐘鐘的事情。

鑒于搜索引擎在國(guó)內(nèi)強(qiáng)大的占有率，坑爹的還會(huì)針對(duì)沒(méi)有手機(jī)端的網(wǎng)站頁(yè)面進(jìn)行轉(zhuǎn)碼，所以我們很有必要利用移動(dòng)適配來(lái)做好移動(dòng)的SEO優(yōu)化。

WordPress手機(jī)主題移動(dòng)版優(yōu)化方案WPtouch安裝使用移動(dòng)適配設(shè)置

一、為什么要做好Wordpress手機(jī)主題移動(dòng)版優(yōu)化？

1、為了獲取移動(dòng)用戶(hù)流量。使用手機(jī)、平板等移動(dòng)終端上網(wǎng)和獲取信息的用戶(hù)越來(lái)越多，原來(lái)只能在PC上進(jìn)行社交和娛樂(lè)活動(dòng)，現(xiàn)在基本上可以在手機(jī)上操作了。加上近幾年國(guó)內(nèi)移動(dòng)用戶(hù)的增加，這其中蘊(yùn)藏著無(wú)限的“機(jī)遇”。

2、為了獲取搜索引擎移動(dòng)版中更好的排名。使用手機(jī)上網(wǎng)的用戶(hù)越來(lái)越多，等搜索引擎早在幾年前就已經(jīng)開(kāi)始針對(duì)移動(dòng)站點(diǎn)進(jìn)行的索引優(yōu)化，對(duì)于那些自適應(yīng)網(wǎng)站，搜索引擎會(huì)優(yōu)先考慮放在前面，增加他們的曝光度。

（1）以免費(fèi)資源部落分別在PC端和移動(dòng)端（m..com）的搜索結(jié)果為例，同樣一個(gè)關(guān)鍵字會(huì)出現(xiàn)不同的搜索結(jié)果，有的甚至前十個(gè)搜索結(jié)果都不同。

（2）由于部落長(zhǎng)期以來(lái)忽視了移動(dòng)用戶(hù)的體驗(yàn)，所以在移動(dòng)端（m..com）搜索“免費(fèi)PHP空間”排名不如PC端的搜索結(jié)果。

3、為了提升網(wǎng)站用戶(hù)粘度。以前用戶(hù)都是用PC來(lái)上網(wǎng)，現(xiàn)在用手機(jī)的時(shí)間大大超過(guò)了PC，我們自然應(yīng)該調(diào)整策略來(lái)迎合大眾的需要，畢竟沒(méi)有用戶(hù)網(wǎng)站的廣告收入也是無(wú)從談起。

二、快速制作Wordpress自適應(yīng)主題的方法

1、基本原則就是：文字流式，控件彈性，圖片等比縮放。掌握了這三個(gè)技能，就可以制作出漂亮的網(wǎng)站移動(dòng)主題了。

2、基本的CSS語(yǔ)法：

width: ;寬度設(shè)置百分?jǐn)?shù)

height: ;高度設(shè)置百分?jǐn)?shù)

display:none;隱藏不顯示

text-overflow:ellipsis; 超出的文字用省略號(hào)

overflow:hidden; //超出隱藏

white-space:nowrap; //超出隱藏

3、加載不同的CSS方法：

（1）利用Wordpress自帶的函數(shù)：wp_is_mobile()。用法：

< ?php if (wp_is_mobile() ): ?>

//這里寫(xiě)你要實(shí)現(xiàn)的代碼

< ?php endif ;?>

//另一種用法

< ?php if ( wp_is_mobile() ){

echo '你正在使用移動(dòng)設(shè)備瀏覽';

}else{

echo '你目前使用的不是移動(dòng)設(shè)備';

} ?>

（2）wp_is_mobile()函數(shù)在wp-includes/vars.php，已經(jīng)可以自動(dòng)識(shí)別安卓、蘋(píng)果等主流瀏覽器，你也可以根據(jù)國(guó)內(nèi)的情況添加UC、QQ等瀏覽器。代碼示例：

/**

* Test if the current browser runs on a mobile device (smart phone, tablet, etc.)

*

* @return bool

*/

function wp_is_mobile() {

if ( empty($_SERVER['HTTP_USER_AGENT']) ) {

$is_mobile = false;

} elseif ( strpos($_SERVER['HTTP_USER_AGENT'], 'Mobile') !== false // many mobile devices (all iPhone, iPad, etc.)

|| strpos($_SERVER['HTTP_USER_AGENT'], 'Android') !== false

|| strpos($_SERVER['HTTP_USER_AGENT'], 'Silk/') !== false

|| strpos($_SERVER['HTTP_USER_AGENT'], 'Kindle') !== false

|| strpos($_SERVER['HTTP_USER_AGENT'], 'BlackBerry') !== false

|| strpos($_SERVER['HTTP_USER_AGENT'], 'Opera Mini') !== false

|| strpos($_SERVER['HTTP_USER_AGENT'], 'Opera Mobi') !== false ) {

$is_mobile = true;

} else {

$is_mobile = false;

}

return $is_mobile;

}

（3）利用CSS判斷語(yǔ)句：@media screen and （更大 ）and（最小）。用法示例：

@media screen and (min-width:200px) and (max-width:600px){

//移動(dòng)CSS樣式

}

//另外一種直接引用方法