Yoast SEO 教學 – 設定麵包屑的主要分類(Primary category)

yoast seo primary category

Yoast SEO 在 3.1 版時推出了一項新功能,Primary category,讓你可以在多重分類的狀態下,設定麵包屑(breadcrumbs)的顯示分類。

我們知道 WordPress 允許一篇文章設定多重分類,若是你的網站啟用了麵包屑功能時,同一篇文章只會出現在同一個分類路徑下。

若你希望改變這個路徑,可以透過 yoast 提供的功能,將該分類設定為 primary category

yoast seo primary category

在頁面顯示上就會以該分類為主要分類路徑。

breadcrumb-primary-category

 

參考來源:https://yoast.com/yoast-seo-3-1/

 

 

如何讓 WordPress 網站支援 AMP(Accelerated Mobile Pages)

Accelerated Mobile Pages (以下簡稱 AMP ),是 Google 提出的一項加速手機版網頁內容瀏覽的技術,你可以把它想像成是 Facebook 的 Instant Articles。使用此技術後,Google 將會針對你的頁面建立一個快取,所以當使用者從手機搜尋並連結到你的網頁的時候(實際上不是由你的主機提供網頁檔案),手機瀏覽器可以很快速地開啟快取頁面,此篇文章先且不討論使用此技術會帶來的影響,而是讓你了解,如何讓你的 WordPress 網站支援 AMP。

 

安裝 WordPress AMP 插件

要讓網頁支援 AMP,必須製作符合規格的網頁,google 定義了一些amp的標籤,您可以前往 google amp網頁了解符合amp需求的網頁規範。不過很幸運的 Automattic 製作了一個 AMP 的插件,讓你可以快速讓你的wordpress網站支援 AMP。

AMP

下載安裝並啟用後,即可讓你的網站支援 AMP。

測試

由於 AMP 網頁啟用後,google需要一點時間才會爬得到,如果你要確認你的網頁成功支援 AMP,可以透過以下的方式確認。在瀏覽起中開啟你網站的某篇文章連結,並於網址後面加上 /amp,即可看到 AMP 網頁。

amp test

 

如果打開 chrome developer tool,在console中你可以看到,Power byAMP html 的相關文字

如果要驗證網頁是否符合 AMP 規範,你可以在AMP 網址列後面打上/#development=1,並重新整理。

 

 

若成功通過驗證,即會出現 AMP validation successful的訊息,接下來就等google去爬你的AMP 網頁啦!

amp-validate

目前這個插件能客製化的選項並不多,在 0.4版以後,你可以修改一些基本的顏色和色彩色定。

 

使用 Glue for yoast seo & amp

由於 WordPress AMP 插件僅提供基本的 metadata 設定,如果你使用了yoast seo,並沒有辦法使用最佳化後的 metadata,因此yoast seo針對此問題撰寫了一個小外掛 Glue for yoast seo & amp,顧名思義就是讓yoast seo和amp插件有比較好的整合,同時他也提供了更多的色彩設定選項,以及加入google analystic的功能。

Glue for Yoast SEO & AMP

安裝並啟用後,在yoast seo會多出一個 AMP 選單。

你可以設定要支援 AMP 文章類型,在此篇文章發布前,頁面(page)還不支援

你也可以做更進階的外觀設定,像是AMP 網頁的logo,或是內容的顏色等等。

也可以加入ga的追蹤碼,請參考 Adding Analytics to your AMP pages,如果你有使用 MonsterInsights plugin 插件(之前叫做 Google Analytics by Yoast),他會針對AMP 和google analystic有較進階的整合。

如果設定正確,過一陣子之後應該就可以在GA看到AMP網頁的瀏覽數據了。

除了在GA中檢視數據外,你也可以在Google search console 中檢視amp網頁的瀏覽數據。在搜尋分析中,將搜尋結果呈現方式設定為AMP非複合式搜尋結果即可。

google search console amp

 

到此為止,我們算是完成了 wordpress 網站和 AMP  的基本整合,同時還讓yoast seo 以及 google analystic 都能夠和AMP 一起運作。

在接下來的文章,我們會陸續探討你的網站是否該使用AMP ,以及使用AMP 對網站seo搜尋和廣告的影響。

 

改變 WooCommerce 註冊使用者的預設角色

WooCommerce 預設會將註冊的使用者角色設為顧客(Customer),但有時候可能會因為一些行銷的需求,或是某種原因,希望將改變預設的使用者角色。如果你只是單純地修改一般設定中的新使用預設角色,是不會有任何作用的。

wp-new-user-default-role
設定->一般設定

不過 WooCommerce 提供了一個 filter 讓你可以改變預設的註冊使用者角色。這邊我們將新使用者的角色設為 WP 一般設定中的預設角色。或是你可以直接設定角色的ID(例如vip)。

如何手動將 WordPress 從本機轉移到伺服器

在本機端開發 WordPress 網站可以加速你的開發流程。在之前的文章中我們提到了如何使用 DesktopServer 來建構本機端開發環境,當你在本機端完成開發後,下一步即是將你修改完成的網站轉移到伺服器上。當然你可以透過一些插件,例如 Duplicator 來進行這項工作,不過延伸日前提到的 WordPress 備份基本概念,這次的教學將使用上次提到的方式來手動進行網站的轉移。

準備工作

在開始之前,我們假設你已經有一個本機端的開發環境,同時有一個支援 WordPress 的伺服器環境。另外,請確認你可以透過 FTP 來連線到你的伺服器,如此才能將本機的檔案上傳到伺服器。本教學的伺服器以支援cpanelc環境的主機為範例。

步驟1:匯出本機端資料庫資料

若使用 DesktopServer 來架站,則內建即會安裝phpmyadmin,你可以使用它來進行資料庫管理。

開啟 DesktopServer 後,可以在左下角找到 Sites 連結,點擊後會開啟 DesktopServer 內建的網頁。

desktopserver_sites

Sites 頁面除了顯示目前你安裝的站台清單外,還提供了一些開發和管理工具,像是 PHPMyAdmin、phpinfo 資訊、Mailbox Viewer 等。這邊請點選 PHPMyAdmin。

desktopserver_sites_phpmyadmin

進入 phpmyadmin 管理介面後,請選擇您要匯出的資料庫,並點擊匯出。

phpmyadmin_export

選擇快速匯出來匯出全部的資料表

quick_export

 

2. 上傳檔案到伺服器

通常伺服器提供商都會提供 WordPress 快速安裝,透過快速安裝可以快速安裝一個 WordPress 網站,可省去建立資料庫等步驟。因此當你連到伺服器時,應該就會看到一開始安裝的檔案。

因為使用者建立的檔案僅存在wp-content目錄中,所以我們只要上傳這個目錄即可。

filezilla

 

3.匯入資料庫

TBD

4.修改網址

TBD

 

[WordPress 教學] – 你應該知道的 WordPress 備份基本概念

在架設或是管理 WordPress 網站時,有一個動作一定是你不可避免的,就是網站的轉移,不管你是從本機轉移到伺服器,或是從伺服器轉移到本機,這都是每個網站開發者或是維護者一定會接觸到的工作。

關於 WordPress 備份和還原,目前市面上其實有不少的插件或服務來協助你處理這項工作,包括:

這些外掛各自提供了不同的功能,像是可以設定備份的頻率、備份的位置、還原等功能。

不過今天要談的是基本功,也就是如何手動來處理備份和還原的工作。我覺得這是非常基本,也相當重要的,因爲有時候難免遇到一些插件無法處理的狀況,像是主機的限制,或是檔案大小的限制,導致網站的備份無法完成,這時候知道如何手動處理就顯得相當重要了,因此我覺得這是在使用這些外掛之外必須要學會的。你仍然可以使用外掛來進行備份或還原,不過懂的如何手動處理,在你遇到問題時將會有很大的幫助。

要備份什麼?

網站資料那麼多,我到底要備份什麼?其實只要把握兩個原則,就可以保證你的網站資料的完整性:

  1. 檔案
  2. 資料庫資料

WordPress 檔案目錄結構

備份的第一個重點就是檔案,檔案存在於你的本機或是主機上,當安裝完 WordPress 後,你應該會看到如下圖的檔案目錄結構,我們可以將其分爲兩大類

  • 使用者建立的內容: 包含 wp-content 底下的全部資料夾和檔案,包含了主題、插件、上傳的資料、以及其他由插件產生的檔案
  • 核心檔案:除了 wp-content 以外的資料夾和檔案

screen-shot-2016-11-11-at-12-08-41-am

其中最重要的當然就是 wp-content 這個資料夾,因為它包含了所有使用者建立的內容,當遺失時是無法回復的,因此在備份時可以單獨備份此目錄即可,其他的資料夾或是檔案都是可以重新下載或是建立的。若你使用插件來進行備份,你可以選擇只備份 wp-content 這個目錄,或是備份全站的檔案。

註:網站管理者或是插件可能或修改.htaccess,如果需要的話可以自行備份此檔案,但因為這個檔案也是具可回復性,遺失的話其實不是很嚴重,只是也許要花點時間修改成你原本的設定。

如何備份資料庫檔案

除了檔案外,另一個很重要的備份重點就是資料庫的資料,資料庫的資料包含了整個網站的內容,其重要性當然更是不可言喻。若你是在本機開發可以使用一些GUI 程式來管理資料庫,像是 Sequel Pro (Mac) 或是 phpmyadmin。

這邊我們以 Sequel Pro 做範例

當你透過 Sequel Pro 連上你的資料庫,從 File ->Export 可開啟匯出介面,匯出格式請選擇SQL, 並同時匯出結構與資料,如此日後才能使用此檔案來還原網站。

sequelpro

 

以上就是 WordPress 備份的基本功,其實並不難。只要掌握兩大原則:檔案資料庫資料,備份其實不是那麼困難的事。

 

 

WooCommerce 教學 – 如何正確客製化 WooCommerce

常常看到有網友詢問,要怎麼修改 WooCommerce 的某個頁面,例如結帳頁面(Checkout Page),我的帳戶頁面(My Account Page),所以特地將個人的經驗整理出來,希望大家能夠學到正確的修改方式,下次遇到別的問題時,同樣可以依循著相同的方式來修改。這些方式不只是適用在WooCommerce, 同樣的概念其實也可以套用在修改主題或是其他的插件。透過本篇文章,你將會了解到:

1.如何正確客製化 WooCommerce (Best Practice)
2.如何複寫 WooCommerce 樣板 (Templates)
3.如何透過 Action/Filter 來修改內容顯示
4.如何避免因為更新而遺失修改內容

大原則:不要直接修改 WooCommerce 的核心

所謂核心指的是 plugins/woocommerce 目錄底下所有的檔案,這點其實是是適用於所有的 WordPress 主題和插件,因為 WordPress 的主題和插件的更新是很頻繁的,如果直接修改插件本身的檔案,當你更新了新的版本時,原本的修改就會被覆蓋掉了,除非你先備份原本的版本,同時在你的修改加上註記,或是透過版本管理軟體(git/subversion)來記錄你的修改,即使如此,日後的更新絕對是你的另一個夢魘。

如果不能修改插件本身,那要如何客製化 WooCommerce 呢?

別擔心,你有的困擾,別人一定也有。

你可以透過以下兩種方式,來客製化  WooCommerce。

1.覆寫 templates

WooCommerce 的頁面都是透過樣板(templates)來呈現的,你可以在 plugins/woocommerce/templates 找到這些檔案。基本上你要修改的頁面,都可以在這邊找到。但是還記得上面說過的原則嗎?不要直接修改插件。WooCommerce 設計了一套機制,讓你可以複寫這些樣板,複寫的方式就是把templates的檔案,複製到你的主題(或子主題)目錄下,切記,複製的時候只複製你需要的檔案即可,如此可降低日後更新和維護的成本。WooCommerce 會先找主題(或子主題)下的樣板,如果不存在,就使用 WooCommerce 插件本身的樣板。

目前大多數進階的主題,為了讓 WooCommerce 的更符合主題本身的設計,都會針對 WooCommerce 進行客製化,因此你可以在主題的目錄下找到客製化的 WooCommerce 樣板,或是你可以在後台 WooCommerce->System Status 的頁面中檢視主題覆寫的樣板
override_woo

那麼多的檔案,我要改哪一個?

如果你不熟悉 WooCommerce 樣板結構,你可以透過插件來協助(像是 Display Template Name, Show Current Template 或是 WooCommerce Template Hints)
Woocommerce Template Hints 會比較直覺地顯示網頁上的內容是來自於哪個樣板,前面兩個就只會顯示這頁包含了哪些樣板,但實際上網頁內容來自哪個樣板還是要自己去找。

如果我的主題包含了舊的樣板該怎麼辦?

有時候 WooCommerce 的更新會伴隨著樣板的變動,你一樣可以在後台的 WooCommerce->System Status 中的  Templates 看到提示:

outdated_templates

若你使用的主題有提供新版,你可以直接將新版主題內的 WooCommerce 樣板複製至你的主題或子主題中(要注意別覆蓋掉之前的修改),或是主題仍沒有提供新版的樣板,你可以使用 WooCommerce 2.1 版後內建的 Template Debug Mode 來檢視你的主題與新版本的 WooCommerce 樣板的相容性。當你啟用了這個功能後,若你是以管理者身份登入,覆寫的樣板將會失效,也就是會以 WooCommerce 內建的樣板來顯示。

template_debug_tool