所見即所得編即器 Visual Composer

Posted on Posted in WP知識家

有在使用內容管理系統的朋友都知道,有一種長得像 Office Word 的編輯器來更新網頁內容,但它也跟 Word 一樣,格式非常容易跑掉,因為它是以 HTML 為語法的編輯器,只要某個標籤漏掉,通常就是災難的開始,會寫 HTML 的朋友或許還有辦法自行解決,不會的朋友真的會求助無門,格式怎麼調都不對。

 

另外在 WordPress 之中有一種叫做 shortcode 的簡碼,它長得像是 HTML 但又不太像,專門設計來定義各種特殊功能或是指定版面的欄寬,萬一漏掉某個引號或等號,整個版面爛掉是稀鬆平常的事,更慘的是,它又不是 HTML,更是非常難修復,往往都必須透過專業人士進行解決。

 

所以,有偉大的工程師來解救我們了,不囉唆,一段兩分鐘的影片讓你看見它的強大之處!

超過四十種小工具

許多製作網頁時的常用工具,都包含於其中,以下就我最常用的幾項工具進行說明:

1.內容相關工具

wordpress-for-business-website-tool-2

請參考—>http://dotcreativestudio.com/wordpressdemo/visual-composer-demo/visual-composer-content-widget/

無論是單欄式、兩欄式到多欄式的版面,Visual Composer 都可以透過簡單的視覺化介面來進行設計,甚至是可以輸入我們想要的分割方式,以便更彈性化的來編排內容。另外基本的內容工具,如文字區塊、頁籤瀏覽、收合選單等等,都能非常方便的建立以及移動,還可以透過複製來快造創造內容。

 

2.圖片相關工具

wordpress-for-business-website-tool-3

請參考—>http://dotcreativestudio.com/wordpressdemo/visual-composer-demo/visual-composer-image-widget/

圖片的部份,除了單純的插入單張圖片外,還有提供最常使用的輪播廣告、淡入淡出廣告、排列式廣告等,另外還提供圖片出現的模式切換,可以設定讓圖片由各種角度進入,增加版面的互動性,以及點擊圖片時放大的燈箱效果,均內建其中。

 

3.社群分享功能

wordpress-for-business-website-tool-4

請參考—>http://dotcreativestudio.com/wordpressdemo/visual-composer-demo/visual-composer-social-widget/

內建四種社群網站分享按鈕,並可切換不同樣式,含計數與排列位置,皆可針對版面的需求進行選擇。內建按鈕樣式,並可插入預設多達數十種的豐富圖標,再搭配長條圖與圓餅圖,非常容易自行設計頁面內容。

 

4.Wordpress 整合

wordpress-for-business-website-tool-5

另外 Visual Composer 也與 WordPress 內建工具無縫整合,我們可以很輕鬆的插入最新文章、最新迴響、自訂選單、標籤雲等小工具,甚至是文章列表也能輕鬆建立,不需撰寫任何程式碼。

 

<三>彈性的客製化空間

許多在 Themeforest 上的熱銷主題商品,像 U-DesignMediCenterThe7 等,都已將該外掛列為基本的套件工具,也就是說,它有能力於各種佈景主題做高度整合。從風格設計開始,在後臺的控制項中可自行定義主色系、背景色、標題色等項目,並可設定元素高度以及欄位間距,如果覺得預設選項不足,還可以直接寫 CSS 於後臺設定中,更便於樣式上的客製化。

 

wordpress-for-business-website-tool-6

如果是覺得小工具不足,還可將我們已經寫好的 shortcode,整合到工具面版中,之後在新增時,便可透過選項欄位,來直接增加 shortcode 的內容,增加使用上的便利性