Elementor – 最好的WordPress頁面編輯器

Elementor外掛分為免費版和付費版，本文分別介紹這兩個外掛的安裝方法。 簡而言之：Elementor免費版在WordPress外掛庫中搜索后即可安裝，而Elementor Pro（付費版）需要購買后獲取安裝包才能安裝，並且，如果你使用付費版Elementor，免費的Elementor依舊要安裝。 安裝Elementor免費版 前往WordPress後台中的外掛> 安裝外掛頁面，搜索el […]

本文将介绍官方推荐的最适合Elementor的9款免费主题，随着Elementor Theme Builder（主题构建器）的发布，您可以使用任何主题并用Elementor Pro设计网站的页眉、页脚、文章详情页模板和文章列表页模板,但如果你没有Elementor Pro，你可能希望找到这样的主题：具有用于控制布局和设计功能的主题。 Hello Elementor 如果您是開發人員或營銷人員，並且 […]

擁有Elementor Pro讓建站就跟拼圖一樣方便了，那如何省錢的購買Elementor Pro呢？ 如何避開坑呢？ 下面分享自己的實踐經驗。 （還不瞭解Elementor的點這裡） 避坑：不要用Elementor Pro破解版 破解版的主要風險在於：安全風險。 一方面，作為不懂代碼的我們，不知道破解的人在安裝包里植入了什麼，我親身經歷過黑鏈植入（是的，我曾經也想著用用免費的）; 另一方面是，外 […]

可以的。 如果您已經購買Elementor Pro，並且想要將許可證（授權）從一個網站轉移到另一個網站，有如下兩種方法，請按照如下方法操作。 方法1、訪問Elementor官網，登錄你的帳號，找到你的訂閱並管理：Subscription > Manage the Subscription 然後，搜索需要刪除授權的網站，點擊斷鏈按鈕即可，被斷開授權的網站中即便裝了Elementor Pro，也 […]

本文介紹Elementor外掛的兩種使用場景實操：（1）將Elementor老版本的Section轉為Container，（2）Container的區別於Section的常用操作演示。 將頁面中的Section轉為Container 本章節以一個完整的頁面為實例，實操講解如何將Elementor的老版本的Section轉為Container，並對錯誤部分進行修正。 Container的區別於Sec […]

本文是Elementor教學系列中的入門級教學，詳細介紹Elementor3.14版本之後新增的頂部工具列的功能。 如果你喜歡老版的工具列，也可以關閉新的工具列。 下面，我們從左到右，對新版工具列的每個控件進行詳細說明。 Elementor標識 點擊Elementor的logo，將出現如下選項。 主題產生器 點擊「主題產生器」，將進入下圖，如果你使用Elementor Pro，才能使用如下功能，譬 […]

本文介紹兩種隱藏Elementor頁面默認標題的方法，一種是單個頁面隱藏，一種是全域頁面隱藏（適用於hello elementor主題）。 下圖是隱藏標題前後的區別，所用的主題是Hello elementor。 如何單個隱藏頁面標題 下面介紹禁用Elementor頁面標題的操作步驟 如果隱藏標題不起作用，那麼應該跟你用的主題有關，你需要去Elementor全域設置中修改頁面標題選擇器。 首先，打開 […]

本文將介紹Elementor網頁編輯器中如何修改文本的字體、大小、顏色和样式。 許多Elementor元素都提供了編輯文本的字體、大小、顏色和样式的功能。這些設計選項位於元素的“ 樣式”/style選項卡中。 視頻教學 圖文教學 通常，見下方圖片，當你編輯一個元素時，在它的樣式欄中能找到文本的排版設置，點擊筆狀圖示，就可以打開對應文本的設計編輯器，當筆圖示為藍色時，說明當前有自定義的樣式，若想恢復 […]

Elementor自定義代碼（Custom Code）功能是Elementor Pro付費版本功能，它允許你添加代碼片段，如Google Analytics代碼或Facebook Pixel代碼，你可以設定代碼在網站里的展示位置和覆蓋頁面範圍，還能設定的代碼的載入優先順序， 這樣你就不需要編輯你的主題檔來實現代碼的插入了。 備註：如果你沒有Elementor Pro，先看看你的主題是否支援插入自定 […]

本篇教學將介紹Elementor網頁編輯器的全域樣式與設置的常用功能，譬如設置全域的字體、顏色、頁面內容寬度、元素默認間距等等。 功能入口：在用Elementor編輯頁面時，如下圖所示，點擊site setting按鈕 然後你便能看到如下的配置選項了 Design System/設計系統 對全域顏色和全域字體進行設置。 Global colors/全域顏色 全域顏色可以讓我們配置常用顏色，以便在製 […]

Elementor的theme style主題樣式可設置各種元素的默認樣式，例如背景，標題，按鈕，圖像和表單字段。這些設置將覆蓋主題自帶的樣式設置，從而使您可以使用Elementor為非Elementor構建的元素設置樣式。 默認情況下，這裡的樣式只會應用於非Elementor元素， 例如WooCommerce結帳字段，Contact Form 7標籤等等。你也可以強制將主題樣式設置應用於Elem […]

本教學詳細介紹Elementor網頁編輯器中元素或容器的Advanced高級設置功能，包括：佈局、動畫效果、變換效果、背景、邊框、遮罩面具、回應式、屬性、自定義CSS進行設置等等，合理使用下文所述的高級功能，能提升網頁設計效果。 提示：某些功能只對特定元素或容器有效，下面我們開始逐一講解。 Layout 佈局 Motion effect 動作效果 Scrolling effects 滾動動效 （P […]

在Elementor的頁面設置功能中，你可以設置當前頁面/文章/產品的標題、發佈狀態、頁面佈局、頁面背景、自定義CSS等等，按下圖所示，我們打開頁面設置面板，你將能看到三個標籤頁：設置、樣式、高級設置，接下來我們逐一講解。 常規設置 在常規設置中，對於頁面、文章，有不同的設置項，文章比頁面的設置項多了：摘要、特色圖像、評論開關。 樣式設置 高級設置

要設置Elementor的小部件/元素塊為圓角，請左鍵點擊小部件后，在左側找到Style/樣式標籤，其中，如果你能找到border radius/邊框半徑屬性，便可以用於設置圓角。 如果找不到，說明當前元素不支援圓角設置，但是你也可以在Advanced/高級標籤中，找到border並設置整個元素的border radius屬性進行設置。 給圖片設置邊框半徑 如下圖所示，我們可以直接在圖像小部件中設 […]

本篇教學提供3個在wordpress中創建聯繫表單並記錄詢盤的方法： 外掛程式Contact Form 7 + Flamingo，兩者都免費 外掛Elementor Pro+Elementor Contact Form DB，前者付費，是網頁可視化編輯器，後者免費。 外掛Ninja Forms，免費，這是我目前新發現且推薦的方式，相關教學請查看：Ninja Forms：免費的聯繫表單外掛，卻提供了 […]

使用Elementor pro可以創作出多種多樣的頁頭導航，可以不再局限於主題自帶的導航了。 並且Elmentor Pro的範本庫里提供了幾十款導航範本，一鍵導入就可以直接用起來了，還可安裝Envota elements外掛，裡頭還有十幾款頁頭。 2021年4月更新視頻教學 操作步驟如下： 滑鼠放在在「範本」菜單 點擊theme builder 點擊添加新範本 選擇範本類型為header 輸入範本 […]

使用ACF（advanced custom fields）外掛程式可以為woocommerce的產品分類、產品增加自定義字段，譬如視頻、QA等等，疊加運用Elementor Pro的範本功能，就可以製作進階的產品列表頁、產品詳情頁了。 給產品詳情頁增加自定義字段 首先，請安裝ACF（advanced custom fields）外掛，並啟用，按照下述步驟添加字段。 依次輸入字段標籤，譬如QA；字段 […]

思路：用Elementor Pro製作產品詳情頁範本（single product）和詢盤表單彈出層（popup），在產品詳情頁範本上添加一個詢盤按鈕，將按鈕鏈接設置為dynamic調用popup即可。 注意，不要將Ninjaform、Wpforms、contact form7製作的表單放到Elementor的Popup中，會出錯：無法顯示表單或無法提交表單。 2021/5/12更新，最新的ele […]

你是否想擺脫主題的限制，自己製作文章詳情頁的範本？ 本文將教你使用Elementor Pro製作文章詳情頁的Single Post範本，我會介紹兩種範本庫及其使用方式，讓新手可以快速製作一個還不錯的範本，還會講到範本中常見的問題哦~ 製作文章詳情頁範本 1.點擊左側菜單template> add new，選擇範本類型為single post，點擊“create template/創建範本”按 […]

使用Elementor pro可以創作出多種多樣的頁腳，可以不再局限於主題自帶的頁腳了。 並且Elmentor Pro的範本庫里提供了多款頁腳範本，一鍵導入就可以直接用起來了，還可安裝Envota elements外掛，裡頭還有頁腳範本供選用。 2021/4/6更新詳細的視頻教學 下方為簡要的圖文教學 操作步驟如下： 點擊 範本>theme builder 點擊添加新範本 選擇範本類型為fo […]

WooCommerce產品分類和產品標籤側邊欄的樣式是跟隨主題設計的，通常沒有設計樣式功能。 如下圖所示，它是我用Hello Elementor主題+ Elementor Pro製作的產品列表範本，在左側的側邊欄里包含了產品分類和產品標籤。 接下來，我們就講如何用Elementor Pro來將樣式設置為下圖所示的模樣。 首先，我們用視頻講解如何設計產品分類的樣式 然後，針對產品分類的custom […]