今天本來預計要撰寫 WordPress 後台左手邊功能欄位的其他套件,還有 Elementor, Monsterinsights 跟 optionMonster 這三個要寫,但是一玩 Elementor 就發現時間過得飛快,也是一個拖拉的方便編輯器
今天主要是紀錄試用 Elementor 筆記
大家好,我是 Jade Chang
Statistic Information 畢業,入職場後於外商從事軟體技術行銷,長期規劃各種線上線下活動像是直播節目/帶狀線上教學,後期負責學生實習計畫與大專院校 Talent Cultivation 與技術社群行銷 Program 為主,過去一年轉任於台灣本土軟體開發商 PM,周旋於客戶、工程師與設計師之間並短期投身新創事業,近期轉換於新竹半導體產業,還在體驗適應中。
Elementor 是 WordPress 熱門編輯器之一,可以從眾多建置 WordPress 網站的教學文當中不斷看到 Elementor 的出現,從官網的 demo 影片當中就可以知道他是一款用拖拉式加入各種功能的編輯方式,同時,Elementor 也有很多模板可以匯入
論版本來看有分成個人版與企業版,比較表如下圖,最大的差別應該是 support跟依照手上有的網站個數比較需要考量,如像我僅有一個網站的就個人版就可以使用了
然而這次會使用到 Elementor 主要是在購買 Soledad 的時候連同主題與編輯器都包成一包購買了,所以自帶 Elementor 頁面編輯器,不需另外購買,是於是不是專業版等後續嘗試後再與大家分享,不過對於初階使用來說應該都算夠用且非常方便了
先登入到 jadechang.blog
當中,Elementor 這個套件就落在左手邊功能其中一欄,前面提到 Elementor 自己也有提供很多模板可以插入頁面,所以在設定上可以去勾選要不要將 Elementor 主題匯入到 WordPress,因為可能會有主題與字型上的衝突,所以設定中可以調整
接著點選 Page,到想要編輯的畫面,會先進到 WordPress 編輯畫面,可以看到左上角有一個 edit with Elementor
點選後會看到很明顯的 Elementor logo 跟 loading,接下來的畫面就會是左手邊出現 Elementor 的編輯功能,是按照不同類型的效果過程一格一格的功能,選擇想要加入的類型用滑鼠拖曳到畫面上想要安插的地方即可,他也有像是使用 photoshop 的圖層概念,A 要在 B 之上或是複製 A 層等設定,可以先用眼睛把不需要的欄位遮起來比較 before and after
還有一個很酷的功能,就是在 Soledad 的佈景主題中再插入主題,在主畫面上按下+
新增的符號,他會顯示詢問要加上
點下 Pencidesign 的 icon,就會出現當初在選 Simple blog 這個樣式一樣的所有佈景,可以在主題中匯入主題,也可以按 block
選擇某一個喜歡的區域,按下 insert 就可以囉
我先會匯入一個主打包包的區塊,旁邊還有主題與說明文字,由於我有勾選 disable Elementor font and color,所以這款編輯區域的色系與字型都是跟著 simple blog (就是當初我選擇的樣式) 進行,避免視覺使顏色上的衝突
簡單查詢,是 WordPress 在 2018 的版本提供的新版編輯器,主要的大概念是採用了「區塊」的概念,將所有網頁上的空間都區塊化,也是我們現在常看到可以被拖拉編輯的地方,讓使用者可以一個區域一個區域進行編輯與擺放像要安插的文字欄位、圖片欄位、表格或影片等各種資料型態
好像緣由是原本 Classic Editor 在使用選擇上大家會優先挑選 Elementor、Divi 這種所見即所得且拖拉式的編輯器,WordPress 才進階更新成新版編輯器,詳情可見Gutenberg 古騰堡編輯器終極懶人包 有清楚說明唷!
鐵人賽文章會 Delay 1-2 天同步放在 Medium
歡迎訂閱或是透過 Facebook 一起來交流 (求指導)