用戶使用 Elementor 時常犯的 6 個錯誤
已發表: 2022-05-23Elementor 在用戶體驗和易用性方面一直處於領先地位。 然而,儘管我們的目標是讓事情變得簡單,但總會有一個學習曲線。 為了幫助您有一個良好的開端,我們決定列出人們在 Elementor 中最常犯的錯誤,以及這些錯誤的解決方案。
如果您意識到自己犯了一些錯誤,請不要為此自責。 掌握任何工具或任務意味著總是有更多的東西需要學習。 如果您打算磨練自己的技能,這個想法是保持開放的心態。 讓我們回顧一下這些常見錯誤及其解決方案,這樣您就可以將 Elementor 技能提升到一個新的水平。
錯誤 #1 – 使用不兼容的主題
讓我們從 Elementor 中的第一個常見錯誤開始:使用不兼容的主題。
Elementor 是一個通用插件。 它旨在符合 WordPress 編碼標準,從而使任何遵循 WordPress Codex 的主題都與 Elementor 兼容。 然而,這並不意味著所有與 WordPress 一起使用的主題都遵循編碼標準,也不意味著每個人都在創建主題時考慮到 Elementor。 因此,每隔一段時間,我們就會收到用戶在編輯頁面時遇到問題的消息。
以下是一些源於使用不兼容主題的常見問題:
- 沒有全寬頁面
- 難以刪除標題下方的空間
- 無法更改字體或顏色
解決方案:更改主題
有幾種解決方案可以避免這個錯誤:
最簡單的方法是將您的主題更改為兼容的類似內容。 查找 WordPress 兼容主題的最佳位置是在其存儲庫中。 更好的是,使用與 Elementor 配合良好的主題,如 WooVina 和 Astra。
WooVina 是 Elementor 的輕量級、快速、完全可定制的入門主題。 WooVina 主題為您的新 Web 項目提供了 50 多個準備好導入 Elementor 演示站點。
另一種解決方法是就麻煩的主題聯繫我們的支持團隊,並要求他們修復錯誤。 或者,只要精通一點代碼,就可以自己動手,深入研究代碼並使其與您的需求兼容。
錯誤 #2 – 使用列和間隔小部件來定位元素
我們遇到的下一個常見錯誤是使用列和間隔小部件來定位元素。 我們遇到了許多用戶,他們從第一天開始就使用額外的列和間隔小部件來定位和對齊他們的元素。 這不僅是不必要的,而且對您的頁面也是有害的。
每次向頁面添加列時,都會向 HTML 代碼添加一個標記,該標記充當頁面的骨架。 所有這些額外的標記加起來,讓系統有更多的工作要做,最終在頁面加載時間方面打破平衡。 此外,使用空的“內容”元素來安排您的佈局會給搜索引擎帶來錯誤的印象,從而導致您的網站排名較低。
解決方案:使用填充和邊距
Elementor 中的每個元素和小部件都有邊距、填充和 Z-index 參數。 許多甚至在小部件內容和样式選項卡中都有額外的對齊和定位選項。 通過使用這些選項,Elementor 確保您只在代碼中使用最少的數據。 此外,將這些數據保存在 CSS 代碼中進一步消除了添加到標記代碼的需要。 這樣做還允許您在使用“粘貼樣式”選項時復制/粘貼間距。
快速提醒一下:margin 值定義了小部件框架外的空間,而 padding 值定義了框架內、框架和元素之間的空間。
習慣使用填充和邊距。 畢竟,這就是它們的設計目的。
錯誤 #3 – Inner-Section 小部件的錯誤使用
當我們討論列的主題時,是時候提到另一個常見的列錯誤了。
Inner-Section 小部件或某些用戶所稱的 Column 小部件的錯誤使用。
如您所知,添加新部分的最佳方法是單擊“添加新部分”。 不幸的是,一些用戶養成了為該部分分配列數的習慣,而傾向於拖動 Inner-Section 小部件。
解決方案:使用常規列
設置部分時,最佳做法確實是使用“添加新部分”按鈕,然後選擇所需的列數。 這不僅使您的部分中的所有內容保持美觀和統一,而且還允許您擁有一些獨立的東西,例如動畫背景和前景,同時保持標記光亮。
Inner-Section 小部件旨在允許用戶在一個有點統一的部分中創建區別。 如果您只想在部分中添加一列,只需右鍵單擊列句柄並添加一個新列。

錯誤 #4 – 在不禁用或清除緩存的情況下進行編輯
另一個常見的錯誤是在沒有先禁用或清除緩存的情況下編輯您的網站。 網站不斷進行更改和更新。 這是我們認為理所當然的事情。 我們發現,用戶經常會花費數小時在後端對他們的網站進行更改,結果卻發現這對前端的網站(它所在的位置)完全沒有影響。
我們網站的緩存旨在駐留在前端,並響應訪問您網站的人對內容的請求。 緩存保存有流行需求的內容數據,有助於縮短下載時間。 最常見的是我們有瀏覽器緩存,但我們也有緩存插件和主機服務器上的網站緩存。
除非我們讓系統知道我們正在進行更改,否則這些緩存將繼續發送我們最初定義的內容。
解決方案:清除緩存
以下是一些可以幫助您避免此錯誤的方法:
在瀏覽器中刷新頁面將清除瀏覽器緩存。 您可以通過在 Mac 上按 Command + R 或在 PC 上按 Control F5 來執行此操作。
您還可以進入瀏覽器的設置並找到刪除緩存選項。
另一種方法是在地址行中的 URL 之後添加一個問號,然後是一些亂碼。 這會強制瀏覽器搜索此信息。 這樣做時,它會重新加載頁面的新版本。
一些用戶使用緩存插件,如 WP Rocket 或 WP Fastest Cache,它們在瀏覽器之外執行數據緩存,以幫助更快地加載頁面。
在這裡,我們建議您在開始編輯或更改您的網站之前禁用 WordPress 儀表板上的緩存插件。 如果您忘記執行此操作,請使用插件設置中的選項清除緩存
有時,託管服務器上的緩存需要刷新。 如果在 Elementor 編輯器中單擊更新後頁面無法重新加載,我們可以驗證這是否會導致問題。
如果是這樣,在 WordPress 儀表板上,轉到 Elementor >Tools > 並在 General TAB 中,單擊 Regenerate CSS 按鈕,然後單擊 Save。 您可以在我們的文檔中找到針對此類問題的更多選項。
錯誤 #5 – 使用錯誤大小的圖像
下一個常見錯誤是使用錯誤大小的圖像。 不乏用戶上傳的圖片對於頁面上的分配位置而言太小或太大。 然後調整圖像小部件的設置以強製圖像適合。 對於將不同大小的圖像上傳到圖像庫或輪播等內容並發現他們遇到相同困難的用戶來說也是如此。 普通讀者會知道,並且毫無疑問地同意,計劃是正確工作和節省流程時間的關鍵。
解決方案:優化圖像尺寸和大小
計劃每張照片的尺寸和尺寸並提前準備我們的圖像,使用 Sketch 或 Photoshop 等設計工具,甚至 Pixlr 等在線網站,將為您節省大量時間和麻煩。
在計算圖像尺寸時,您還可以處理文件大小。 減慢頁面加載時間的高分辨率圖像肯定會導致大量訪問者從您的網站跳出。 您可以使用 Optimole 等工具自動減小圖像大小,或使用 Tiny PNG 等外部服務。
錯誤 #6 – 未設置默認顏色
下一個錯誤:沒有設置默認顏色。 Elementor 中有許多選項旨在使用戶的生活更輕鬆。 再次,設置您的設計默認顏色將為您節省大量時間,並確保您的配色方案在整個網站中保持一致。
解決方案:提前選擇我們的顏色
最好的做法是在我們的頁面構建開始時執行此操作,一旦您在 Elementor 中打開了第一個空白頁面。 在菜單中,從調色板中選擇默認顏色並應用它們。 我們實際上在之前的大師班中介紹瞭如何設置它。
結論
此列表並未涵蓋用戶所犯的所有錯誤。 還有很多其他我們可以提到的,例如 - 將文本粘貼到文本編輯器中,其中包括內聯樣式,而不是清理文本。 但是,克服這 6 個錯誤將為您提供一個良好的開端,並幫助您更好地理解和利用 Elementor。
您會驚訝於 Elementor 的正確使用將如何立即顯示您製作的網站的巨大改進。
如果您覺得我們遺漏了任何應該提及的常見錯誤,或者您遇到了您或您的客戶在使用 Elementor 時經常犯的一些常見錯誤,請在下面的評論中與我們分享。