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

而移動(dòng)流量卻基本上可以忽略不計(jì)。直到有一天突然看到一篇文章才猛然醒悟不是來自移動(dòng)客戶端的流量少，而是一直以來博客都沒有針對(duì)移動(dòng)客戶端做好體驗(yàn)優(yōu)化。久而久之，搜索引擎不給關(guān)鍵字排名，直接瀏覽用戶越來越少，也就導(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ì)沒有手機(jī)端的網(wǎng)站頁面進(jìn)行轉(zhuǎn)碼，所以我們很有必要利用百度移動(dòng)適配來做好移動(dòng)百度的SEO優(yōu)化。

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

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

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

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

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

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

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

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

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

2、基本的CSS語法：

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

height:100%;高度設(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() ): ?>

//這里寫你要實(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í)別安卓、蘋果等主流瀏覽器，你也可以根據(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判斷語句：@media screen and （最大）and（最�。�。用法示例：

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

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

}

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

<link rel="stylesheet" type="text/css" href="style.css" media="screen and (min-width: 600px) and (max-width: 800px)"/>

標(biāo)簽： WordPress優(yōu)化 WordPress主題 移動(dòng)站點(diǎn)優(yōu)化 

版權(quán)申明：本站文章部分自網(wǎng)絡(luò)，如有侵權(quán)，請(qǐng)聯(lián)系：west999com@outlook.com
特別注意：本站所有轉(zhuǎn)載文章言論不代表本站觀點(diǎn)！
本站所提供的圖片等素材，版權(quán)歸原作者所有，如需使用，請(qǐng)與原作者聯(lián)系。