網站設計基礎篇 Elementor教學PART 4 常用小工具報你知

190719 每日_工作區域 1

嗨~又到了網頁設計的教學時間啦,上次光先生介紹過了Elementor主題建構器,今天要來教大家網站設計最常用的小工具,讓大家在製作網頁時,可以設計的專業又不失美感哦!到底一個網頁的構成都使用了哪些元素呢?跟著光先生一起看下去吧!

每日學,內容精要,重點快速瀏覽學習,輕鬆掌握重點。

常見元素小工具介紹

Elementor除了基本的頁面編輯器功能外,還有很多非常有特色的功能
如標題、文字編輯器、圖片、影音、列表、文章、按鈕、價格表、客戶評價、表單等,當選擇不同小工具,左側都會自動切換成對應的選項編輯欄,相較於其他編輯器,Elementor小工具的種類和功能都有一定水準,不需要過多的設定便能設計出漂亮的頁面!

如何使用元素小工具3步驟

1.在左側欄位挑選小工具
2.右邊頁面先建立好段或是找好要放置的位置
3.滑鼠壓住拖拉到右側頁面的欄位就完成啦!

這邊光先生挑選了較常用的小工具來跟大家介紹,讓我們來瞧瞧吧!

圖片轉盤

可作為banner或是圖片展示,因為圖片可輪播所以能有效利用版面,但是圖片要連結的話只能夠導向一個網址

社群圖示

網站除了以文字方式放上基本資料外,還可以用圖示連到社群連結,無論是fb、google、instagram等,顏色樣式也可隨著網頁樣式做更改!

按鈕

可為網站帶來不錯的引導及注意力,透過立即詢問、了解更多、前往查看等文字讓訪客點擊按鈕,達到轉換的效果!

分頁

此小工具能夠像資料夾標籤一樣整合網頁內容,無論是圖片或是影片等皆能有效的將訊息一一做分類!

光先生星期一!

光先生星期二!

光先生星期三!

光先生星期四!

光先生星期五!

地圖

最基本也是重要的地圖,內建google地圖可供顯示商家位置,有實體店面的話不妨加上地圖,可讓瀏覽者了解實際位置及查找店面!

這邊是要升級pro才有的功能

幻燈片/媒體輪播

使用這兩種可達到banner的效果,幻燈片可個別為圖片加上文字及按鈕,而圖片轉盤則無加字的功能

光先生
就是我
點擊這裡
光先生
點擊這裡

導航選單

可將選單置入達到網站頁面切換的功能,或是商品、文章分類等皆能使用選單,是立即性且便利的功能!

「分享」按鈕

無論是頁面、商品頁還是文章,使用分享的按鈕後,可讓當前頁面分享至社群,讓網頁增加更多推廣

分享在 facebook
Facebook
分享在 google
Google+
分享在 twitter
Twitter
分享在 linkedin
LinkedIn

facebook粉絲專頁

除了一般的社群圖示外,可將粉專整個嵌入,讓訪客在訪問網站時能一起接收到粉專的消息,或是直接點進粉專查看,是很便利的功能!

表單

可用來收集名單、詢價單、作為顧客聯繫用途,內容可以設置選項或是填空,可放置在首頁、聯絡我們頁面等,樣式修改一樣很簡單!

Elementor Pro是什麼?

如果只是設計一般的頁面,免費版的Elementor功能已經蠻夠用了, Elementor Pro主要增加了這些功能

  • 自定義CSS可編輯
  • 全域小工具
  • 強大的動畫特效
  • 50多個高級元素,如文章列表、portfolio列表、幻燈片、聯繫表單、客戶評價、CTA等
  • 可搭配電子商務WooCommerce功能
  • Elementor Theme Builder,可自定義頁首和頁尾,無需代碼就可修改主題
  • 300多個專頁版型,但很多內建版型需升級Pro才可使用
  • 彈出式頁面建構,多樣化的組合版型供選擇

如果你需要用到上面列出的功能,那光先生蠻建議升級成 Pro版本,畢竟功能使用起來非常方便,特別是主題建構器的功能,非常實用,使用起來也簡單好操作。

無論您是使用免費版還是Pro版,如果你需要用到上面列出的功能,那光先生蠻建議升級Elementor是一款非常強大的編輯器,它改變了WordPress的編輯習慣,有著多樣的設置和人性化的編輯體驗,不用使用到程式碼即可修改頁面。

介紹到這邊,相信大家對於Elementor好用的小工具應該有更加的了解, 你在找購物網站/電商/官網/一頁式網站嗎?選擇我們的網站不僅有提供Elementor pro專業版還送你網站教學影片!辣麼好的優惠快來了解吧!手刀前往

喜歡的話請幫我們到「光先生」粉絲團按讚分享,或訂閱我們的Youtube頻道哦!我們會推出更多的內容及影片的!

「以不一樣的思維進行廣告行銷,進而認同品牌價值」,
立志讓更多人知道原來廣告行銷也可以這麼好玩!!

每日學,文章推廣

每日學,內容精要,重點快速瀏覽學習,輕鬆掌握重點。

發表留言