讀者權益

在閱讀前,請容許大叔聲明幾件事情:這些事情對您可能蠻重要的:

  • 內容中連結可能有參加聯盟計畫,這並不影響您的購買權利。
  • 聯盟計畫和廣告收入都會做為網站經營基金。
  • 而部份收入將捐給流浪動物基金會。(公益捐款明細)
  • 喜歡我的文章的話,請幫我這樣做,點擊下面的拍手圖示。

#20 Elementor Template 範例 – 讓你的網站更具吸引力

使用 Elementor 模板的好處包括:

  • 節省時間:使用現成的模板,可以省去自己從頭開始設計的時間,讓你更快速地建立美觀的網站。
  • 降低成本:如果雇用設計師建立網站,成本可能非常高。使用 Elementor 模板,你可以省去這些費用,同時還可以得到專業設計師的風格指導。
  • 適應性強:使用 Elementor 模板,可以讓你的網站適應不同的螢幕大小和設備,從而提供更好的用戶體驗。
  • 自定義選項:使用 Elementor 模板,你可以自由地修改模板,以符合你的品牌形象和需求。
  • 大量範本可用:Elementor 提供了豐富的模板庫,涵蓋各種類型的網站,你可以根據自己的需求進行選擇,而且每個模板都可以進行自定義。
  • 因此,使用 Elementor 模板可以讓你更快速地建立網站,節省成本,並提供更好的用戶體驗。

    Elementor 是什麼?

    如果你正在打造自己的網站,但不想花費大量時間和金錢聘請開發人員,那麼你絕對需要了解 Elementor 這個 WordPress 插件。

    Elementor 可以讓你快速而簡單地創建專業而美觀的網站,它的三大特點:

  • 「拖放式 (Drag and Drop)」編輯介面 – 簡單易操作,讓任何人都能夠輕鬆設計和編輯網頁。
  • 不需要具備程式設計能力 – Elementor 將想得到的功能都設計成元素,直接「拖放」就能使用。
  • 網上最多模板和教學資源 – 使用 Elementor 模板和範本讓我們站在巨人的肩膀上。加上你可以在網路上找到任何關於 Elementor 的問題和教學,省下大量解決問題的時間。
  • 此外,在最新的統計中,Elementor 是最受歡迎的 WordPress 編輯,例如說:

  • 平均每 10 秒創建一個網站
  • Elementor 是一個開源的平台
  • 自 2016 年推出,至今已擴展到 180 多個國家/地區
  • 超過 5,000,000 次活躍安裝
  • WordPress 網站 超過 5000 條五星級評論

  • 以下是 Elementor 的一些特點:

  • 優秀的性能:Elementor 能夠快速載入,不會讓你的網站變得緩慢。
  • 大量模板可用:Elementor 提供了豐富的模板庫,涵蓋各種類型的網站,你可以根據自己的需求進行選擇,而且每個模板都可以進行自定義。
  • 無需程式背景:Elementor 的編輯界面簡單易用,讓你可以輕鬆設計和修改網站的外觀和功能,而且不需要任何程式設計知識。
  • 免費和付費版本:Elementor 提供了免費和付費兩個版本,免費版本已經足夠使用,但付費版本可以提供更多功能和模板。
  • 網上大量免費學習資源:Elementor 是最受歡迎的 WordPress 編輯工具,超過 800 萬網站使用,可以在網路上找到大量的學習文章。
  • " controls="" src='https://elementor.com/marketing/wp-content/uploads/2021/06/02_MainVideo_1066_600_HR201-1.mp4'>


    Elementor 是基於 WordPress 開放系統下的網頁編輯工具軟體,可以從 Loading Page 到電子商務網站等幾乎所有網頁應用中使用,是大叔最喜歡且常使用的編輯器之一。

    Elementor 的強大功能和簡單易用的編輯界面,讓它成為了最受歡迎的 WordPress 編輯工具之一,無論你是新手還是有經驗的網站開發者,都可以輕鬆使用它來打造出美觀而實用的網站。

    什麼是登入頁 ( Landing Page )?

    Landing Page 的主要目的就是告訴使用者正確的方向。

    也就是「引導」的工作,像是讓用戶…

  • 了解公司服務
  • 購買商品
  • 留下連絡資料等
  • 而登入頁就像某人來到陌生的地方要問路的時候,他會由登入頁的…

  • 外觀 – 決定我們是不是夠不夠專業,是否值得詢問。
  • 標題 – 決定是否為他的目標對象。
  • 內容 – 決定我們的服務和商品是否配合他的期待。
  • 當我們都過關了,他自然會相信我們給他的「引導」。

    常見的引導有什麼呢? 例如說:

  • 購買商品
  • 最新活動相關內容
  • 留下連絡資料
  • 所以良好的登入頁 ( Landing Page ) 設計,是為會公司帶來很高的轉換率,也就是業績啦。

    那我們就開始吧。

    Elementor Template 模板教學

    Step1.載入 Elementor 版型

    新增個頁面,然後點擊新增版型。

    在搜尋框打上 Landing Page 選一個你喜歡的吧。

    Elementor Template

    然後插入它。

    影片出現問題,請連絡我

    Step2.修改內容

    再來先修改內容,最好先決定你希望用戶看到什麼內容。我們將針對這幾點做修改。

  • 商標
  • 標題
  • 簡述
  • Call To Acting
  • Elementor Template


    Step3.修改商標 LOGO

    一般網站用 LOGO 都是長高比約 2:1 ,如果你還沒有自己的商標的話,網路上可以找到很方便的 LOGO 設計。

    參考文章: 【Logo 設計】2022 自己品牌自己做 – 品牌DIY

    修改標題

    Elementor Template

    標題的重點就是「簡單」,最好很清楚的了解你的核心服務或是商品。也有人這樣樣使用…

    「品牌」加上「關鍵字」,例如說…

    台灣大哥大的網頁 TITLE 就是【台灣大哥大 5G 能所不能】,關鍵字就是 “5G” 這樣的感覺。

    修改簡述

    寫作的朋友可能知道,研究表示一個人停留在標題的時候只有 0.3 秒,如果他停下來看你的內容的時候。

    簡述只有 3秒來決定他要不是再往下看。

    3秒的關鍵時間,你只能在 1-2 句話給用戶一個留下的理由。

    再換個照片吧!

    我把手機的照片換成了我的背影。

    調整版面

    再來你一定覺得哪裡怪怪的,所以我們就需要調整一下設計版面;並希望調整到下面的樣子。

    版面的設計可依你的個人喜好,大叔的作法只是提供你一個參考的選擇。

    Elementor Template

    在過程中,我們調整的地方有:

    編輯段

  • 版面配置 – 內容寬度改為方框 800 px
  • 拉伸段 – 打開
  • Elementor Template
  • 邊框間距
  • Elementor Template

  • 背景顏色 分別為:#F3EAE3 – 膚色、#6D7C69 – 墨綠色,讓大家參考。
  • Elementor Template

    新增空白間隔

  • 空白間隔高度為 300px
  • 背景顏色為 #6D7C69
  • Z-index – 0
  • 位置 – Absolute
  • Horizontal Orientation -20px
  • Vertical Orientation -20px
  • 然後圖片的 Z-index 要改為 9 這樣才不會被空白間隔給擋住。

    改完後,就成了新的首頁的樣子;是不是看起來不錯。

    Elementor Template

    心得 & 總結

    Landing Page 十分的重要,如果你可以在這放上最重要的內容,讓用戶更了解你的品牌和核心價值。

    大叔目前網站也是使用【Elementor】設計的,如果你對這套工具有什麼問題,都可以在下面留言發問,如果我可以為你服務的話,這是我的榮幸。

    讀者優惠

  • Elementor Pro + Crocoblock 組合包
  • 主機 + Elementor Pro 優惠計畫
  • 「中年大叔的秘密武器,WordPress 網站獲利攻略大揭密!」 – 下一篇給他看下去
  • 限時優惠,滿$1,000即享9折優惠'
    複製優惠碼
    AO230401
    04/01-12/31
    HAHOW 好學校
    大叔限時優惠,單堂 86 折 / 兩堂 82 折 /三堂以上只要 79 折
    複製優惠碼
    lashi23
    今日- 2023/12/31
    HAHOW 好學校
    九月全站活動 - 99 購課季:基礎優惠:
    複製優惠碼
    免優惠碼
    9/4 - 9/22
    HAHOW 好學校

    目錄:
    #20 Elementor Template 範例 – 讓你的網站更具吸引力

    菈喜大叔 - 減法生活提案

    關於大叔

    文章歡迎轉載,請說明出處。

    相關文章

    發佈留言

    發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *