You are currently viewing WordPress佈景主題 OceanWP 免費功能 用 Elementor增加左右側選單

WordPress佈景主題 OceanWP 免費功能 用 Elementor增加左右側選單

用Wordpress打造網站30幾個之後,發現好用的佈景主題確實能夠加快架站的速度,用OceanWP主題後,不需要懂HTML與CSS也能做出讓人喜歡的網站風格

網站的側欄可以做很多活用,前兩篇的Sidebar介紹之後,這次仔細介紹用Elementor去新增自訂你的左右欄位~

版面內建Sidebar與Elementor欄位的差別在於?

Sidebar可直接設置於很多個頁面,修改內容時只需要去小工具修改設定即可多頁連動修改,但Elementor欄位設定則是針對某個頁面的設定,但修改時並不會連動,也不會影響其他頁面,這點須注意,因此若需要多個頁面有同樣的側欄選單或是設定好不讓客戶動的內容的話請到Sidebar去設定喔~

很多版型沒有搭配好用的視覺編輯器,就會讓你覺得卡卡,客戶總是希望我這邊再加個選單,這邊再加個分享之類的,參考今天這篇介紹就可以符合各種奇奇怪怪的需求喔~

那接下來就進入正題~~~一步一步來吧~~~GOGO

用Elementor的免費功能自訂側欄版型

首先開啟一個頁面或是文章都可以,接著點選使用,就會看到以下畫面

打開畫面後有兩個按鈕,右邊進去後可以載入很多版型,免費板也有提供幾款可以使用,但我今天要教學左右欄位,就直接是使用左邊那個加號去增加欄位囉~~

選擇欄位樣式

這邊可以看到很多不同的欄位,我今天使用的是下排第三款

手動調整欄位寬度

這邊可以用手動去調整欄位寬度,就可以依照你內容的寬度去做手動縮放

並且點滑鼠”右鍵”擊下圖看到深灰色功能鍵可以新增欄位,就可以變成3欄.4欄或是更多

若不小心調整壞了想要調回來,也可以點選中間的功能鍵就可以調整回預設寬度

編輯側欄Sidebar內容加入選單

接下來就可以拖移到你想放進去的欄位囉~

以下圖來說右欄我先放了網站預設Sidebar,不過跟之前不一樣的是,我是用拖移的方式將Sidebar放到我要放的位置,此Sidebar內容會跟著小工具裡面內容做更動,需要這個功能可以去看看之前的Sidebar教學

左側欄位則拖移加入導覽選單功能,此功能可想像成為,產品的分類選單。選單先於外觀>選單製作好內容,才能在選單列表內看到內容。

圖一圖二兩個功能都是同樣增加選單,但圖一的是WP內建的選單列表,所以顯示出來是WP基本設計,而圖二選擇的是OceanWP主題附掛的選單列表,所以呈現出來的會是OceanWP的選單列表設計,也有開放字體大小讓你做基本的設定,如下圖

到這邊為止就是側欄的教學了~

以上教學就到這邊~若有遇到其他問題歡迎留言與我討論~


此文章非贊助,純粹是出於愛用而撰寫之文章,若有其他的問題歡迎留言詢問,也希望您不吝嗇您的掌聲幫我點likecoin,贊助我寫教學文章囉~

Loading

發佈留言