目錄
網站架設基礎
網站是甚麼
網站是一種位於全球資訊網 (World Wide Web, WWW) 上,基於某種協定,以網頁呈現內容的資訊媒體,而網站就是網頁的集合。網站是透過前端與後端技術等程式語言所建構,讓網站能夠與使用者的瀏覽器、伺服器之間彼此互動。
網站常見架構
我們可以把網站想像成一本書,網站內容包含文字、圖片、多媒體等,就如同書本的內容一樣,而網站的內容需要分類與彙整,因此會有網站架構,可以視為書本的目錄,網站架構會因為網站的功能取向、目標客群等而有部分差異,但通常網站架構會包含首頁、關於頁、服務或產品介紹頁、聯絡頁、消息頁等,再因應其他功能而有對應的頁面,例如購物網站就會有會員專區頁、購物流程頁等。
網站企劃
網站的主要目的,就是一種資訊媒體,用來傳達或展示某種理念、價值觀、服務或產品等,也能提供某種特定功能,如社交互動、電子商務等,通常我們可以用網站企劃來釐清網站的目的。要建置一個網站通常要做網站企劃,透過5W1H來規劃,有計畫才不會想到甚麼做甚麼,這種無效率的工作方式可能會導致最後白白花費時間與精力而一事無成,不管是做自己的網站或是為客戶提供專案服務,先做好一份網站企劃釐清需求與期望是很重要的,網站企劃內容一般包含:
網站目的 (Why)
凡事都有目的,做網站也一樣,為何要做網站?網站是要傳達品牌形象?要販售商品?要社交互動?要發佈資訊?還是要全包?先釐清目的,因為這些都會牽涉到後續的網站目標族群設定、網站資訊架構、網站風格、網站介面與功能等各種面向。
網站的目標對象 (Who)
設想網站想觸及的目標族群為何?這些人具備何種屬性?釐清這些人需要甚麼,有助於定義網站需要何種功能與介面、網站要呈現何種風格、網站要提供何種內容等面向。
網站要提供的資訊、內容與價值 (What)
設想目標族群能透過你的網站達成甚麼目標?網站能提供甚麼資訊、內容或價值給他們?這些會影響網站的內容與資訊要如何呈現,以及介面與功能要如何建構。
網站的資訊架構 (Where)
定義網站的資訊與內容的架構,期望目標族群要如何在網站內取用這些資訊與內容?要在網站的何處呈現與配置這些資訊與內容?會牽涉到網站的功能要如何使用、介面要如何建構。
網站的風格、功能與介面 (How)
網站如何影響目標族群的印象?網站的色彩計畫適合女性還是男性?整體風格是簡約大器或是沉穩洗鍊?如何讓使用者取用資訊與內容?網站需要提供新文章訂閱功能嗎?網站要有線上購物功能嗎?要串接金流嗎?網站的CTA按鈕需要有動畫效果嗎?這些都牽涉到網站要呈現何種風格,以及使用者如何透過網站所提供的功能與介面達成目標,並且延伸到後續的網站設計與開發作業。
排程 (When)
上述的規劃,都會有對應的作業項目,會有一個排程表來定義這些作業項目的完成時間,影響最終網站的上線時程。
靜態網站 vs. 動態網站
一般來說網站分為靜態網站 (Static Website) 與動態網站 (Dynamic Website) ,靜態網站是指預先製作好的HTML網頁,網頁的內容是固定不變的,不會因為使用者或情況的不同而呈現對應的內容,如果要修改網頁的內容,需將該張網頁透過網頁編輯軟體重新編輯後,再重新上傳到伺服器。
而動態網站結合伺服端程式語言與資料庫,讓網站的內容能夠依據不同的使用者、不同的情況或規則等,呈現對應的內容。有時候,靜態網站與動態網站的型態是可以並存在同一個網站中的,如果有的頁面內容不會頻繁的修改,那使用靜態網站的型態製作即可;如果有的頁面內容需要因應某種條件或規則來呈現(例如會員專區、購物車等),就需要採用動態網站的型態來製作。
前端技術
網站前端與網站後端,一般可以視為一種網站開發的技術分工,網站前端是指當使用者進入網站後,可以直接瀏覽與操作互動的介面,例如可以看到文字、圖片、多媒體、點擊連結或按鈕、關閉警告訊息等,而前端技術就是用來建構網站與使用者互動介面的相關技術。
前端技術:超文本標記語言 (HyperText Markup Language, HTML)
用來建構網頁的結構與內容,HTML 會包含文字、圖片、超連結等元素,並告知瀏覽器要如何呈現這些元素。
<html>
<head>
<title>我的網站</title>
<meta charset="UTF-8">
<meta name="description" content="這是一個簡單的HTML範例">
</head>
<body>
<h1>我是一級標題</h1>
<h2>我是二級標題</h2>
<h3>我是三級標題</h3>
<p>我是段落</p>
<a href="<https://google.com>" target="_blank"><p>Google</p></a>
<a href="<https://zh.wikipedia.org/wiki/WordPress>" target="_blank"><img src="<https://upload.wikimedia.org/wikipedia/commons/thumb/2/20/WordPress_logo.svg/1920px-WordPress_logo.svg.png>"></a>
</body>
</html>
前端技術:階層式樣式表 (Cascading Style Sheets, CSS)
用來定義網頁元素的外觀與佈局,例如文字的顏色、背景的顏色、框線、圖片的位置等, CSS 需要和 HTML 同時使用。
<style type="text/css">
body{
background:#f7f7f7;
color:#777;
}
h1{
font-weight:bold;
font-style:italic;
font-family:sans-serif;
color:green;
}
</style>
前端技術:程式語言 (JavaScript, JS)
一種物件導向程式語言,可用來處理網站前端的資料處理、網頁元素控制、事件回應等任務。
<script language="javascript">
alert('歡迎光臨');
alert('請慢慢逛\\n不要離開');
</script>
後端技術
相較於網站前端能與使用者直接互動,網站後端通常不會讓使用者直接接觸,網站後端負責接收由前端而來的使用者請求,並執行相關程式邏輯與資料處理,再將結果傳送到網站前端,因此後端技術指的是建構網站功能運作與資料處理的相關技術。
伺服端程式語言
建構網站能處理前端使用者的請求與回應、資料存取等功能的程式語言,常見有 PHP、ASP、JSP、Ruby、Python、Node.js、GO 等。
伺服器
或稱為主機,主要是指網站伺服器,包含主機硬體、作業系統、伺服器軟體、資料庫管理系統等,可存放網站資料與使用者產生的資料、調配資源,並能在網際網路中提供服務,回應使用者的請求。
網域名稱
網站存放於伺服器,而伺服器是 WWW 中的某一部電腦,這部電腦會有專屬的 IP位址,例如 172.16.254.1,使用者可以透過瀏覽器輸入 IP 位址後進入某個網站,但因為 IP 位址對於機器才有意義,對於人類卻不方便記憶,因此才有網址,也就是網域名稱,透過域名系統 (Domain Name System) 來處理IP位址與網址的對應,這樣人類只要在瀏覽器輸入網址,就能進入網站,所以網域名稱可以視為網站的門牌地址,註冊一個有意義且好記的網域名稱,對於網站的營運有很大的幫助。
架設網站好複雜,有沒有更快更簡單的方法?
內容管理系統 (Content Management System, CMS)
可以使用開源 (Open Source) 的內容管理系統 (Content Management System, CMS) 來架設網站,內容管理系統是一種用來編輯、儲存、檢索、呈現資料的系統,而網站具備各種內容,例如文字、圖片、檔案、多媒體等資料,透過內容管理系統,我們可以快速簡便的將這些資料妥善處理後,在網路上呈現給適當的使用者。
內容管理系統包含網站的前台與後台,網站前台是使用者可以直接瀏覽網站內容與操作功能的地方,網站後台提供一組管理介面,讓任何具備使用權限的使用者可以管理與編輯網站資料後呈現在前台。
常見的CMS
目前內容管理系統在網站架設的應用上,有很多選擇,最常見的有 WordPress、Joomla、Drupal 等,也有一些以 SaaS 型態運作的內容管理系統,例如 Wix、Weebly 等。各種內容管理系統都具備專屬的特色,使用者通常需要了解自身的需求並進行一番比較後,才能知道自己適合採用何種系統。
WordPress 身家背景好,那就用它吧!
以個人的經驗來說,起初是玩 Joomla,覺得 Joomla 好強大但好複雜,後來接觸 WordPress,但覺得不好用,而 Drupal 沒碰過,聽說學習門檻很高…再後來深入了解 WordPress 後,驚覺其生態系相關資源之完善與強大 (母公司 Automattic 市值站上30億鎂!) ,在 Joomla 上不好處理的需求或功能(也可能是我個人功力問題@@!),WordPress 幾乎都能快速找到對應的處理方案,等於是讓架設網站這項作業更加簡化與便利了!
所以,好 WordPress ,不學嗎?
WordPress 簡介
WordPress 是以 PHP 開發的的開源軟體,是目前最多人使用的網站內容管理系統,全世界有將近 40% 的網站都是由 WordPress 所建置,因此擁有非常豐富的資源,包含軟體開發商、外掛數量與社群。
WordPress.org? WordPress.com?
WordPress 分為 wordpress.org 和 wordpress.com ,前者是 WordPress 非營利組織的官方網站,提供開源的 WordPress 軟體,下載後自行安裝佈署到自己的主機環境中,系統的管控彈性較大,建置成本也最低;後者是把 WordPress 系統以 SaaS 型態佈署成一個線上服務,申請帳號後,選擇付費方案就可以直接在上面建置網站,管控彈性低,而且建置成本也頗高。一般建議初學者,可以自行下載 WordPress 後再安裝到所租用的主機,這樣的成本是最低的,也可保有系統最大的管控彈性。
WordPress 能做甚麼?
WordPress提供基本的內容管理功能,可以讓使用者透過後台編輯文章與頁面、上傳圖片等,另外透過安裝各式各樣的程式外掛 (plugin) 以及佈景主題 (theme) ,可以賦予網站各種功能與外觀,不管是部落格網站、形象網站、作品集網站、購物網站等,採用 WordPress 皆可以輕鬆達成。
不過,WordPress雖然對於初學者來說相當容易上手,但它的目的就是要讓不懂程式也不懂設計的一般大眾,能夠快速便捷的架設網站,因此在系統結構上採用模組化設計,有一定程度的開發難度,因此如果要客製化 WordPress 系統,所需要的技術與所花的時間成本,並不會比完全客製化的網站系統還少。
WordPress 怎麼玩?
開始架設 WordPress 網站前,有三個前置作業要先完成:
下載 WordPress 安裝程式
先到官方網站下載 WordPress 的安裝程式,下載完成後是一個壓縮檔,直接解壓縮後,所有相關檔案會放置在一個名為 wordpress 的資料夾。
租用主機(伺服器)
如果是正式要上線營運的網站,都需要具備主機來存放網站資料,因此需要先租用主機,而主機的選擇,國內外都有相當多的服務商,主機的類型與等級要考量需求來做選擇:
虛擬主機
虛擬主機也稱為共享主機,指的是在一台實體伺服器上,用軟體技術切分成多個虛擬單位,再提供給多個網站運作,是最常見的主機類型,優點是較為便宜,管理介面也較容易上手,但缺點是須和其他網站共享伺服器資源,穩定性與速度很看服務商的品質,適合預算不高、網站流量不大的使用者。
虛擬專用主機 (Virtual Private Server)
虛擬專用主機與虛擬主機類似,但伺服器資源有專屬限定,不會因為共享的情況而被其他網站拖累,因此穩定性與速度普遍優於虛擬主機,但管理與設定介面較為複雜,適合有一定技術背景、預算稍高且網站有中高度流量的使用者。
雲端主機
雲端主機與 VPS 類似,但具備能因應流量變化而調配伺服器服務資源的能力,知名服務商有 Amazon Web Service,、 Google Cloud Platform 等,通常管理與設定介面具備一定的難度,費用也較為高昂,適合有資深技術背景且需要能夠應付網站瞬間高流量需求的使用者。
專用主機
自己組建一台伺服器,或是跟服務商租一台伺服器,通常都稱為專用主機,因為所有伺服器資源都是自己的網站專用,但相關的費用與技術都不是一般使用者能負擔得起的,除非網站具備非常高的流量,且需要嚴密的資安機制,再來考量專用主機。
註冊域名
正式營運的網站,都會設置域名,可以找尋國內外的域名服務商註冊一個,再設定域名指向到網站所在的主機,就可以讓使用者輸入網址後進入網站。
開始建置 WordPress 網站
因為 WordPress 是模組化的網站內容管理系統,會與一般的網站建置與開發流程有些不同,建置一個 WordPress 網站通常會有以下流程:
安裝 WordPress
使用主機提供的一鍵安裝功能
有一些主機服務商會在主機管理介面提供一鍵安裝 WordPress 的功能,省略讓你一步一步執行 WordPress 安裝程序的步驟,並提供預設管理帳密讓你能在安裝完成後直接進入網站後台,立即開始建置網站。
執行 WordPress 內建的安裝程序
如果主機商沒有提供一鍵安裝 WordPress 的功能,那就要手動執行安裝程序,需要先在主機管理介面中上傳 WordPress 安裝檔案到主機的根目錄,並建置一個空的資料庫,然後把資料庫的相關資料(資料庫名稱、帳號密碼等)記下來,因為在安裝的過程中會需要輸入資料庫的相關資料。然後從瀏覽器輸入網址後,就會進入安裝程序,依據步驟提示輸入相關資料後完成安裝,就可以用自己設定的管理帳密進入網站後台開始建置網站。
Local 端安裝 WordPress
另外一種安裝 WordPress 的方式,可以把 WordPress 系統安裝到 Local 端,也就是自己目前使用的電腦,稱為 Local 端是相對於 Remote 端而言,通常這種情況會是當網站還在開發階段,還不需要佈署到線上的環境時,可以在 Local 端建置好讓網站可以運作的環境,直接在自己的電腦中開發網站。也就是說當你還沒有要讓網站上線,或者你還不想處理主機與網域的申請租用等事務,你只是想測試或練習網站開發,你可以直接把自己的電腦模擬成伺服器的環境,讓網站在上面運作。
WordPress 運作的主機環境,通常稱為 LAMP,包含 Linux、Apache、MySQL、PHP 等開源軟體,也就是伺服器作業系統為Linux、網頁伺服器軟體為Apache、資料庫為MySQL、伺服器端程式語言為PHP。因此如果要讓自己的電腦能夠運作 WordPress 網站,需要具備LAMP的環境,我們可以透過安裝這些開源軟體讓 Local 端電腦具備伺服器相關的軟體環境,如果一個一個獨立安裝,每個軟體都需要進行一些基本設定作業,因此有服務商整合了這些軟體成為解決方案包,只要安裝一套,就可以完成這些軟體的設定。
XAMPP 是上述提到的一個 LAMP 軟體解決方案包,它的優點是可以跨平台,不論你的作業系統是 Windows、Linux、MacOS 等都可以運作,先到它的網站下載對應作業系統版本的安裝檔,將 XAMPP 安裝到電腦後,Local 端電腦就具備伺服器的環境,接下來就執行 WordPress 內建的安裝程序。
Demo & Try It Yourself!
下載 WordPress 與 XAMPP 安裝檔
安裝 XAMPP 到自己的電腦並做基本設定
安裝 WordPress 到自己的電腦
安裝佈景主題 (Theme)
佈景主題是甚麼
佈景主題能讓 WordPress 呈現前端相關元素、介面與功能,透過佈景主題可以讓 WordPress 網站在不更動核心架構與主要功能的情況下,替換不同的外觀風格,而網站前端的相關介面與功能如何呈現和運作,和所選的佈景主題有很大的關係,因為不同的佈景主題都有各自的設定,有的佈景主題包山包海,不管你需要或不需要,各種想得到的前端功能都有內建,只要一套佈景主題就可以打造出品牌網站、購物網站、作品集網站等各種風貌與功能,但這種佈景主題的缺點就是檔案肥大、容易造成網站運作效能低落,例如 Avada 等 。而有的佈景主題著重在輕巧精簡,提供基本的外觀呈現與功能介面,再結合其他相關的外掛程式,讓你能依需求打造各種型態的網站與功能,例如 Astra、OceanWP 等。另外也有特別強調某一種功能類型的佈景主題,針對特定取向的功能強化,例如線上購物網站常見的 Flatsome、部落格新聞媒體網站常見的 Soledad 等。
如何取得佈景主題
當 WordPress 安裝好時,就已經安裝了幾套官方的佈景主題,另外也可以透過官方的佈景主題目錄找尋其他免費的佈景主題。如果要取得更多功能強大的佈景主題,可以進入 Themeforest 商城選購自己喜歡的佈景主題。另外也有一些知名的佈景主題開發商,會在自己的官網販售自家的佈景主題,例如 Astra、OceanWP、DIVI 等,而這種由佈景主題開發商所提供的產品,通常是以訂閱制會員方案銷售,會享有更完善的支援與售後服務。
如何安裝佈景主題
透過 WordPress 後台,可以連結到官方的佈景主題目錄,直接安裝佈景主題,也可以將自己在 Themeforest 商城或其他佈景主題開發商所購買的佈景主題檔案,以上傳佈景主題的方式安裝。系統內能夠安裝多套佈景主題,但只能啟用一套佈景主題。佈景主題安裝完成後,就可以依據佈景主題所具備的功能自訂網站的外觀。
Demo & Try It Yourself!
下載 Astra 佈景主題
安裝 Astra 佈景主題並啟用
設置網站的外觀
安裝外掛 (Plugin)
外掛是甚麼
外掛是一種程式套件,可以讓 WordPress 實現某種特定功能,當 WordPress 安裝完成時,已經有基本的內容管理系統相關功能,例如編輯文章與頁面、上傳媒體等,但如果要增加更多的功能,就可以透過安裝外掛來達成,想要讓人在網站購物,就安裝 Woocommerce ,想要呈現漂亮的大型輪播 Banner,就安裝 Slider 類型的外掛,要提供表單讓人填寫資料,就安裝 Form 類型的外掛等。在 WordPress 的生態系中,有高達好幾萬種的外掛,網站應該具備的所有功能,幾乎都可以找到對應的外掛。但因為外掛是由各家軟體開發商所提供,不同外掛之間可能存在相容性的問題,通常建議同一種功能取向的外掛只要安裝一套即可。另外有些外掛開發商之間也會讓自家的外掛能彼此整合,例如頁面建置外掛 Elementor 就能結合自訂欄位外掛 ACF ,或是專門為大型的知名外掛開發附屬的外掛,例如就有蠻多開發商基於 Woocommerce 開發了延伸其功能的外掛。
如何取得外掛
外掛的取得方式與佈景主題差不多,可以透過官方的外掛目錄來找尋需要的外掛,也能在 Codecanyon 商城選購外掛,另外各家外掛開發商的官網也有提供訂閱制會員方案。外掛常見的商業模式為提供具備基本功能的免費版本,但如果需要更全面且強大的功能,就要升級付費版。以下列出幾項個人經驗中認為必要安裝的外掛:
外掛名稱 | 主要功能 | 類似外掛 |
---|---|---|
Rank Math | 搜尋引擎最佳化相關設定,提升網站的SEO成效 | Yoast SEO、All in One SEO |
Breeze | 網站快取功能,讓網站運作加速 | WP Rocket |
All in One WP Migration | 網站搬遷與備份 | UpdraftPlus |
Akismet Spam Protection | 阻擋垃圾留言 | |
Contact Form 7 | 製作聯絡表單 | WP Forms |
Smart Slider | 製作內容輪播功能 | Slider Revolution、LayerSlider |
Mailpoet | 提供電子報功能 | Mailchimp for WordPress |
Woocommerce | 提供購物車相關功能 | |
Elementor | 客製化版面製作 | Divi Builder |
Wordfence Security | 提升網站資安防護 | |
WP Mail SMTP | 讓網站具備SMTP發信功能 | |
如何安裝外掛
外掛的安裝方式也和佈景主題差不多,透過 WordPress 後台,可以連結到官方的外掛目錄找尋需要的外掛安裝,也可將自己在 Codecanyon 商城或其他外掛開發商所購買的外掛檔案,以上傳外掛的方式安裝。外掛安裝完成後,可自行決定是否要啟用該外掛,當網站中安裝且啟用了越多外掛,通常有可能會影響網站的運作效能,因此建議只安裝必要的外掛即可。
Demo & Try It Yourself!
安裝 Contact Form 7
安裝 Ultimate Addons for Gutenberg
安裝 Duplicate Page
安裝 All in One SEO
安裝 All in One WP Migration
WordPress 基本設定
WordPress 安裝完成後,也安裝了佈景主題、外掛等,再來就要先做一些系統基本設定,讓系統能更符合自己的需求,包含:
一般設定:網站標題、網站說明、時區、日期格式、是否開放註冊會員、註冊會員預設角色等設定。
寫作設定:預設文章分類、預設文章格式、email發布文章相關設定等。
閱讀設定:網站首頁內容型態、文章顯示數量、阻擋搜尋引擎等。
討論設定:留言相關設定。
媒體設定:圖片尺寸相關設定。
永久連結設定:自訂網址結構相關設定。
隱私權設定:設定網站的隱私權頁面。
Demo & Try It Yourself!
完成上述的 WordPress 基本設定
製作頁面與建立內容
內容類型
接下來開始建立頁面與內容,WordPress 本身是內容管理系統,內建的內容型態包含:
頁面:通常是指靜態頁面,回顧一下靜態網站的定義,也就是頁面上的內容不會因為使用者或某種條件情況而變動,這種頁面通常用來呈現不會因為時間而需要常變動的內容,例如關於我們、聯絡我們等。而 WordPress 的頁面還能包含動態的區塊,也就是該頁面中可以呈現動態網站的資料,例如首頁本身是靜態頁面,但可以呈現商品的列表、文章的列表等。
文章:WordPress 早期的定位是部落格系統,也就是能呈現依據時序排列的文章,就是常見的部落格型態的網頁,通常文章會隸屬於某種分類,預設會以列表的型式呈現,只顯示部分的內容如標題與摘要等,點選列表後可以瀏覽完整的文章內容。
媒體:WordPress 內建媒體庫,可以上傳各種媒體檔案,並運用在頁面或文章中。
留言:文章中的留言。屬於使用者生成內容 (User Generated Content, UGC) ,也就是由訪客或會員所貢獻的內容。
分類法:WordPress 本身有兩種基本的分類法,一種是文章的分類,另一種是文章的標籤,在我的觀點中,分類是將相同主題內容的文章歸納一起,例如歸類在遊記中的文章和歸類在讀書心得中的文章,就是依據不同的主題內容來分類。而標籤是該文章所具備的特色或屬性,具備相同特色或屬性的文章可以用標籤關聯起來,例如歸類在網站設計中有一篇文章講到專案管理,另一篇歸類在平面設計的文章也講到專案管理,那這兩篇文章雖屬不同分類,但可以用同一個專案管理的標籤關聯起來。
區塊編輯器
WordPress 提供區塊編輯器來讓我們編輯頁面與文章的內容,可以在不需要接觸語法的情況下,視覺化的建立頁面內的各種元素區塊。除了內建的區塊編輯器,有一些外掛開發商也有開發自家的區塊編輯器,可以挑選自己用起來順手的編輯器來使用。
Demo & Try It Yourself!
建立文章分類
建立文章
製作頁面,包含首頁、關於我們頁、聯絡我們頁、最新消息頁、服務介紹頁
建立選單與設置小工具
選單
導覽選單是網站介面中最重要的元素之一,關係到使用者如何取用網站的內容與資訊。當我們建立了頁面與文章後,就可以開始建立選單,如果有安裝其他擴展 WordPress 內容類型的外掛,例如 Woocommerce 商品分類,也可以把該種內容建立到選單中。
小工具
小工具是一些通常會放在網站側邊欄 (sidebar) 或是頁腳 (footer) 的次要資訊或功能區塊,例如搜尋欄、文章分類、文章彙整、文章標籤等,用來分隔網站的主要內容區和次要內容區。每一種小工具都有基本的設定,有一些外掛也會提供專屬的小工具。
Demo & Try It Yourself!
依據所建立的內容,製作對應的選單
在文章列表頁和文章內容頁的側邊攔建立一組小工具,包含搜尋欄、文章分類、文章彙整、文章標籤、最新文章
設置相關外掛功能與測試
依據功能需求尋找對應的外掛,安裝並啟用後,接下來進行該外掛的相關設置。通常建置網站時,這部分的作業會比較花時間,因為每種外掛都有自己的操作邏輯,設置的難易度不一,通常都需要摸索一番,建議先瀏覽該外掛開發商所提供的說明文件,以正確的觀念和步驟來設置外掛。當相關外掛都設置完成後,就可以開始在前台測試相關的功能,例如跑一次訂購流程、填寫表單送出、訂閱電子報等。
Demo & Try It Yourself!
設置 Contact Form 7
設置 All in One SEO
運用 Ultimate Addons for Gutenberg 建立一些特別的頁面區塊 [section block] content width: full width, inherit inner width from theme: On
網站上線相關設定
當網站的內容建立完成,相關外掛功能也設置完成後,網站準備上線營運前,還需要做一些上線的相關設定,包含:
主機端
主要是網域信箱的相關設定,讓網站能夠透過主機的郵件伺服器寄送信件,網站需先安裝 SMTP 相關外掛。
平台相關服務
整合 Google Analytics :網站需整合 Google Analytics 網站分析工具,可以了解網站營運的流量狀況。
登錄 Google Search Console :將網站登錄到 Google Search Console 並提交 sitemap ,讓 Google 搜尋引擎能夠建立網站的資料,對於SEO的操作有所幫助。
另外也可以視情況整合 Google Tag Manager 與 Facebook Pixel 。
相關資源
素材
圖庫
ICON
線上學習
Web技術
數位行銷
https://learndigital.withgoogle.com/digitalgarage-tw
Geekdad Norman、Info-Tech Town、國立暨南國際大學管理學院
本文章內容為”WordPress網站開發線上共學營”簡報專用