找我們做網站
↑
Wordpress · WordPress 佈景主題

Kallyas 主題教學:Smart Areas 智慧區塊與主題設定

WordPress 佈景主題發布 2018.04.08更新 2026.10.02閱讀約 8 分鐘
Kallyas 主題教學:Smart Areas 智慧區塊與主題設定

重點整理
Kallyas 是在 ThemeForest 販售的 WordPress 付費主題,最大特色是 Smart Areas(智慧區塊):同一組區塊可套用到同類型的頁面、商品或文章,修改一次就全部同步。本文介紹主題特色與後台設定。

Kallyas|WordPress主題教學,在架設網站的過程中,常常遇到一個問題,就是如果想要在不同的頁面顯示相同的區塊或欄位,就必須要重複的製作同樣的網站元素,而所編輯元素中的設定,又會因為編輯過程中可能導致的失誤,而造成區塊或欄位所顯示的位置、效果等無法同步,而當遇上這樣的狀況時,又必須將網站頁面一個個點開編輯,如果今天有相當多的商品或文章頁面,就會造成時間上的浪費,那著這樣的狀況要怎麼解決呢?
今天所要介紹的付費佈景主題Kallyas,設計了一個名為 Smart Areas(智慧區塊)的網頁設計功能,可以在單一網站頁面、商品頁面以及文章頁面分別製作同一類別頁面的區塊網頁元素,也可以自定義區塊元素的位置及其它細節設定,相當的實用。另外Kallyas這個主題也支援AMP(手機版網頁加速)、SEO(搜尋引擎優化)、加快網頁載入速度、網站前端編輯頁面即時修改頁內元素等功能。那麼
(小提醒:鵠學苑的所有教學均是以Apple Mac OS X系統 做步驟示範!)

介紹Kallyas佈景主題特色功能

第一步:進入到 envatomar 的首頁,在搜尋種類中選擇Theme & Templates,搜尋框中輸入Kallyas做搜尋,可以在結果頁的第一順位找到Kallyas介紹的連結,點擊圖片進入。

Kallyas
Kallyas
Kallyas
Kallyas

第二步:在Kallyas的介紹頁面中可以看到購買的金額是34美元,在近期購買這個主題的話,享有 50% 的優惠,相較其他主題可以說是相當便宜,點擊主題的圖片或下方的Live Preview按鈕都可以進入範例網站頁面,或點選連結:https://kallyas.net/。

Kallyas
Kallyas

第三步:這裡強調kallyas是具有不需要任何程式語言設計背景,就能夠獨立完成一個完整網站架構的特點,但筆者認為,是必須具有網頁設計基礎知識的情況下,才會有這樣的可能性。

Kallyas
Kallyas

第四步:這個主題中也具有各式各樣的範例網站可供預覽及操作,可以找尋與自己相同目標的版型來做匯入。

Kallyas
第五步:快速的直覺是網站前台編輯,並且不需要使用程式碼來建構網站內容。

Kallyas
Kallyas

第六步:如輕鬆打造專屬特色風格網站,在kallyas只需要三個步驟,

1.在前端編輯中使用Zion builder於頁面欄位放入網頁元素

2.編輯網頁元素,如圖片大小、載入特效、長寬比等設定數值及選項

3.自定義化頁面所有設定,存擋並關閉編輯器,即完成網站修改。

Kallyas
Kallyas

第七步:網頁視覺編輯器,跳脫以往需要不斷切換網站前端與後台查看編輯結果的模式,透過直覺性操作的網頁編輯器,實現所見即所得的快速修改及編輯網站的方法。

Kallyas
Kallyas

第八步:kallyas提供了視覺編輯器模擬操作,以及如何使用視覺編輯器建構網站的教學影片,可以直接點擊下面的影片播放,會有簡單的介紹。

Kallyas
Kallyas

第九步:kallyas提供了響應式網頁設計以適應不同解析度的螢幕設備、AMP加速行動版網頁瀏覽(詳細介紹可以參考這篇文章:Google AMP提升網頁載入速度)、RETINA(Apple開發的高解析度顯示器)、SMART LODER(快速載入網頁重點顯示元素的技術)。Kallyas

第十步:對於SEO搜尋引擎優化的支援,其擁有與Yoast SEO(可參考外掛教學:Yoast SEO 文章內容優化及關鍵排名提升 )高度的相容性可增加網站曝光度與排名;同時也支持使用 WPML 製作多國語言的網站功能。

Kallyas
Kallyas

了解Kallyas在WordPress後台中如何設定主題及功能介紹

第一步:在安裝主題後,會有開始使用前的基本設定(如何安裝佈景主題可以參考鵠學苑的教學文章 WordPress主題選用),下圖中是檢測網站的基本數值以及版本是否正常,如果有出現黃色或紅色的數值,則需要聯絡開發人員或自行重新安裝 WordPress 。

Kallyas
第二步:在 Connection to service 這個選項中點擊 CHECK NOW 的按鈕,就能檢查是否與Kallyas的更新伺服器連線,如果是正常的,則會如同下圖一樣出現打勾的圖示。

Kallyas
Kallyas

第三步:在這裡必需先註冊主題,在https://my.hogash.com/這個網站中使用 Envato account的帳號密碼快速登入,就可以查詢到購買主題的 API KEY,將其複製貼上到圖片中的欄位,點擊 CONNECT 即可。Kallyas

第四步:這裡選擇是否要安裝隨購買主題所附加的第三方開發在 WordPress 使用的外掛,如圖所示可選擇安裝或不安裝,附帶提醒的是,如果可以的話請詳細的了解這些外掛的功能,如果是非必要的就不要安裝,以免影響日後網站的效能。

Kallyas
Kallyas

第五步:在這個步驟可以導入範例網站以作為網站架設的版型,如果說在第二步中沒有輸入 API KEY,在這裡將無法匯入版型。Kallyas

第六步:最後一步可以點選紅色方框中的連結,快速到達想要設定的頁面元素,或者連結到Kallyas的官方說明文件、影片教學、常見問題等解說頁面。
Kallyas

第七步:在網站的前端使用 Zion builder 編輯頁面,如下圖所示,可以快速的加入網頁元素,並以拖拉的方式編輯網頁欄位做排版,熟悉上手之後會相當的節省時間。

Kallyas
Kallyas

第八步:在編輯網頁結束後是不是有遇過明明已經儲存更新了,剛剛變更的內容卻沒有顯示的狀況或錯誤還在的狀況?Zion builder有一個貼心的設計,就是在下途中點選 “Clear Zion Cache“即可清除網站快取,讓頁面內容能正確顯示。

Kallyas
Kallyas

使用主題內建編輯器要注意什麼?

Kallyas 用自家的 Zion Builder 編輯頁面,這類「主題專屬編輯器」方便,但有幾件事要先想清楚:

  • 換主題時頁面多半要重做:用 Zion Builder 做的版面,換成其他主題後通常無法正常顯示,可能只剩下短代碼或零散文字。
  • 更新要跟上:主題、編輯器與內附外掛要一起更新,跨大版本更新前先備份。
  • 快取要記得清:改完頁面沒變化時,先用編輯器內的清除快取功能,再清除快取外掛。
  • 評估長期維護:如果網站會用很多年,選擇通用的頁面編輯器(例如 Elementor)或區塊編輯器,日後換主題或交接比較容易。

常見問題

Kallyas 主題要去哪裡買?

Kallyas 在 ThemeForest(Envato 市集)販售,官方網站 kallyas.net 可以看範例網站。原文提到的價格與折扣是早期資料,目前售價與授權方案請以 ThemeForest 商品頁為準。

Kallyas 的 Smart Areas 是什麼?

Smart Areas(智慧區塊)是 Kallyas 用來建立可重複使用區塊的功能。做好一個區塊後,可以指定顯示在某一類頁面、文章或商品上,之後修改一次,所有套用的位置都會同步更新。

Kallyas 為什麼要註冊 API Key?

註冊後主題才能連線到開發者的伺服器,取得主題更新、匯入範例網站,以及內附外掛的更新。沒有註冊時,原文提到的範例網站匯入步驟無法進行,長期不更新也會有安全風險。

結語

在眾多的付費佈景主題中,Kallyas也許不是擁有最多功能,也不是有最多Demo網站可供匯入的最佳網站架設選擇,但Kallyas標榜以 Zion builder 建構網站不需使用 HTML 建構網頁,也不需要自行寫入 CSS 更改網頁內容樣式,在前端即可編輯或修改網頁的特點,對於新手站長來說就一個很大的誘因,在加上安裝完主題後在Theme options中就可以導入 Google 網站分析及管理工具的追蹤碼,以及設定商品結帳頁面中的 reCaptcha(驗證為使用者而非機器人的功能)等,都指出了使用Kallyas這個主題是真的可以達到完全不必使用程式語法就能夠架設網站的境界,這對於一些佈景主題來說,是難以實現的。
另外推薦Kallyas這個主題的一個原因,就是在於它在 envatomarket 中的售價僅僅只有34美金(50% 優惠期間的價格,原本的定價是60美金左右),相對於其它的付費佈景主題而言,這樣的價位配合上剛剛講述的功能,是相當親民的。

鵠學苑・鵠崙設計鵠崙設計 2014 年成立,專注 WordPress 網站開發,400 多個網站在我們自己的主機上運作。鵠學苑的文章由團隊實際操作後整理,工具與外掛的功能以撰文當時為準。
鵠崙設計

不想自己摸索,
就交給我們做。

外掛設定、主機效能、改版搬家,這裡寫的每一件事,都是我們每天在客戶網站上做的工作。留下需求,1 個工作天內回覆。