網誌微調和有用的WordPress語法筆記

幾個月前發現,因為發文頻率減少,本站在Google搜尋的排名下滑很嚴重,過去用特定關鍵字搜尋可以衝到第一或第二頁,如今連別人的車尾燈都看不見(=在搜尋結果蒸發)!後來我才知道,Google為了推廣網路安全性,早在2014年就宣佈會將HTTPS列為搜尋排名的工具之一。雖然我沒有用SEO賺錢,我還是希望別人搜尋特定的關鍵字可以看到這個網站,於是從九月開始展開一連串的網誌微調工作,包括加強WordPress的後台安全性、加入SSL憑證、修改主題(theme)、修改字型等,也為了獲得更穩定的主機空間而遷移網站主機

◆加強WordPress的後台安全性
包括改變管理後台登入網址(用外掛WPS Hide Login)、增加登入嘗試的限制(用外掛Limit Login Attempts Reloaded)、改管理帳號和密碼(手動新增管理者再刪除舊的)。

◆加入SSL憑證
一開始是透過SSL For Free產生Let’s Encrypt的憑證,再用cPanel手動加入憑證;搬家後,改用新主機Sugarhosts提供的安裝Let’s Encrypt憑證服務。加入憑證是還好,內部連結路徑可以搜尋取代,照片也不是問題(大圖都放在別的主機),最麻煩的在於這網誌放了很多AMAZON的商品圖片連結,這些圖片路徑都不是安全路徑,也無法直接把HTTP改成HTTPS(會找不到圖片),造成網誌有混合式內容(mixed content)。還好找到了一位日本外掛作者做的外掛WP Associate Post R2,保證所有商品圖片連結來自HTTPS,雖然需要一篇一篇手動改,幾百篇我也硬是給它改完了。此外還需要.htaccess語法的配合,這部份整理在本文最後一段。

◆修改主題
Simplish主題用好幾年,一直懶得換(因為還得配合一些外掛修改),但現在手機上網盛行(雖然我自己習慣用電腦),該主題已經停止開發,當然也沒有手機用的版面。本來我想用外掛解決,發現好像沒一個外掛提供現成的手機版主題可以直接套用的?只好回到問題的源頭,那就是換主題。

在WP官網的主題區看到幾個順眼的主題,結果都是其他主題的「子主題」,不想要那麼複雜,也不需要啥米電子商務的附加功能。試用了好幾個,才找到了目前用的TheSimplest(各位可以從字面上發現,我喜歡的主題風格就是simple!),儘管樣式簡單但已經做好響應式(responsive)設計,最得我心的就是主要CSS檔只有一個!(要是有兩三個以上的CSS檔,光是改CSS我就暈了)

◆修改字型
雖然用了響應式主題,把網站送到Google Search Console檢查後還是被指出一大堆問題,其中一項就是「字體太小」!跟我一樣年代的朋友可能記得,十幾年前的個人網站(尤其是日本動漫相關)流行日系設計,大家都喜歡把字體弄得小小的(笑),導致我後來架網誌也習慣把字體大小設定在「12px」,但這樣的設計已經不符時代潮流。再說我自己年紀大了,也發現用大螢幕讀小字非常吃力。

話說回來,繁體中文字很美,但標楷體不適合小字,新細明體的大字又「low」,其他中文字型可能你的電腦有裝他的電腦沒裝,更不可能叫訪客下載字型就為了看我這個破站,用網頁字型(web font)又要考慮成本、讀取速度等。一開始,我參考了下面的文章:
網頁字體的一些事
網頁中文字型除了微軟正黑體, 還有這些好選擇!(windows) by Wayne Fu
網頁中英文字型最佳化 by Alyssa
把網頁字型設成電腦內建的字型:

Meiryo, Verdana, “文泉驛正黑”, “WenQuanYi Zen Hei”, “儷黑 Pro”, “LiHei Pro”, “黑體-繁”, “Heiti TC”, “微軟正黑體”, “Microsoft JhengHei”, sans-serif

其實用「Meiryo」(メイリオ)字型的效果已經相當不錯(註:我只有Win7系統和Android手機,其他瀏覽工具不知效果如何),大部分繁體字都秀得出來。不過,前幾天拜讀Max大的文章才知道,Google正式開放使用免費的網頁字型思源黑體(Noto Sans TC),而且我之前用試用版時遇到的問題「不支援日文漢字」已經解決了!讀取速度似乎也改善很多,所以目前我把網頁字型改成下面的設定:

‘Noto Sans TC’, meiryo, sans-serif

有幾個日文漢字像「変」、「剣」在思源黑體似乎還是不支援(會跑出明體字),補上了meiryo字型後,一切完美!

◆停用Feedburner
Google自從2007年買了FeedBurner就「放置play」這服務將近十年,雖然到現在還沒關掉也是個謎,但總覺得它來日無多(=_=)。雖然我的網誌訂閱數少得可憐,也不知裡面幾個真人幾個robot,但最近想砍掉FeedBurner(主因是想減少WP的外掛數,目前是用FeedBurner FeedSmith←已從WP官網外掛區下架了),才發現它有一個很重要的功能是連結我的twitter帳號,讓網誌發表新文章時可自動發布到我的twitter。當然有別的WP外掛和服務能達到類似的功能,但我本意就是想減少外掛還下載一個新外掛感覺很矛盾,而其他服務也不知道將來會不會步上FeedBurner的後塵,因此,目前已經停用FeedBurner FeedSmith外掛,也在FeedBurner設定永久轉址到原本的feed網址:https://you3.net/feed/(訂閱本網誌的朋友,麻煩您們更新一下啦)。

日記歌詞站方面,日記因為是用免費的Blogger,沒有外掛多不多的問題,所以等到Google正式關掉FeedBurner時再想辦法(←);歌詞站放在WordPress.com,可以直接使用WP.com官方提供的連結twitter的功能。

◆有用的WordPress語法筆記
1. 根目錄的.htaccess--強制使用HTTPS:
RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]

2. 根目錄的.htaccess--將WP檔案放在子目錄但使用根目錄網址連結:
<IfModule mod_rewrite.c>
RewriteEngine on
RewriteCond %{HTTP_HOST} ^(www.)?example.com$
RewriteCond %{REQUEST_URI} !^/my_subdir/
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ /my_subdir/$1
RewriteCond %{HTTP_HOST} ^(www.)?example.com$
RewriteRule ^(/)?$ my_subdir/index.php [L]
</IfModule>

3. 根目錄的.htaccess--將指向子目錄的連結全部轉到根目錄:
以前這個網站除了WordPress還有其他內容,因此網誌的對外連結是用子目錄,而Google搜尋等地留下的紀錄大多也帶著子目錄網址。現在因為改用根目錄網址,必須想辦法把Google搜尋來的瀏覽也轉到根目錄網址。試了N個辦法只有下面這個成功,感謝「Redirecting Subdirectories to the Root Directory via HTAccess」這篇教學!
RedirectMatch 301 ^/blog/$ http://domain.tld/

4. 根目錄的.htaccess--將帶www的連結轉到沒帶www的安全連結:
感謝「Apache redirect www to non-www and HTTP to HTTPS」這篇教學。
RewriteEngine On
RewriteCond %{HTTPS} off [OR]
RewriteCond %{HTTP_HOST} ^www\. [NC]
RewriteCond %{HTTP_HOST} ^(?:www\.)?(.+)$ [NC]
RewriteRule ^ https://%1%{REQUEST_URI} [L,NE,R=301]

5. WP安裝目錄的.htaccess--停用XML-RPC:
<files xmlrpc.php>
Order allow,deny
Deny from all
</files>

6. WP主題安裝目錄的functions.php--強制讀取最新的css:
前幾天狂改WP主題樣子,但刷了N次網頁、瀏覽器快取也清了N次,依舊無法看到修改(搬家前不會這樣,不知道是否因為新主機或是用了Cloudflare服務的關係),差點想求助主機客服,幸好先找到了「【筆記】解決WordPress的CSS樣式修改卻沒反應的問題」這篇教學。
add_action( 'wp_enqueue_scripts', 'enqueue_child_theme_styles', PHP_INT_MAX);
function enqueue_child_theme_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
wp_enqueue_style( 'child-style', get_stylesheet_uri(), NULL, filemtime( get_stylesheet_directory() . '/style.css' ) );
}

你可能有興趣的相關文章

(閱覽數:27 次)

Leave a Reply

Your email address will not be published.