Codestar Framework 框架是一個應(yīng)用在WordPress主題和插件開發(fā)后臺比較常用的框架之一。比如我們看到很多的國內(nèi)國外的WordPress主題和插件都是用的Codestar Framework框架開發(fā)的,能夠提高開發(fā)的效率。今天我們就一起來介紹這款Codestar Framework框架。
Codestar Framework 在2.0之前均是免費開源的,但是從2.0之后,他出來2個版本。Free Version、Premium Version 版本。那兩者到底有什么區(qū)別?
我們可以看到,CSF框架免費版本支持Admin Option Framework管理框架,但是對于菜單、用戶自定義、側(cè)邊欄、短代碼等框架是需要Pro版本支持的,但是我們可以看到大部分的簡單的主題開發(fā)基本上免費CSF框架就足夠用的,如果我們確實需要深入開發(fā)全部功能的,我們需要選擇一個高級版本。
如果我們確實需要深入開發(fā)主題或者插件的,建議還是選擇付費的框架,且是永久授權(quán)的。我們可以確保最新版本更新升級,畢竟免費的框架像OP等,還有很多的免費框架都有好多年沒有升級更新,擔(dān)心安全問題或者兼容問題。
如果我們是準(zhǔn)備主題開發(fā)和插件開發(fā)的,建議直接購買付費版本而且是永久不限制使用的。永久版權(quán)49美元,而且不限制項目,這個對于我們準(zhǔn)備職業(yè)開發(fā)的來說是有必要的。這里要順帶提一下Options Framework框架,他是不支持插件的,且OP框架已經(jīng)很久不維護(hù)更新。
我們可以看到最新才更新且兼容最新WP5.9版本。如果我們選擇其他開源免費的WordPress選項框架,升級兼容沒有得到及時的更新,這個對于我們?nèi)f一需要長期維護(hù)的商業(yè)主題插件確實是比較麻煩的。
我們一起看看如何將 Codestar Framework 框架部署到我們的WordPress主題開發(fā)里。
我們將解壓好的CF框架文件夾(codestar-framework)放到當(dāng)前需要采用框架的主題目錄的 inc 文件夾里面。inc 文件夾也是我們自己創(chuàng)建。
然后在 Functions.php 文件中引用框架。
require_once get_theme_file_path() .'/inc/codestar-framework/codestar-framework.php';
這里的URL目錄要配合我們上面的目錄路徑一致,如果你調(diào)整的這里也要調(diào)整。然后我們在 codestar-framework 創(chuàng)建一個 options 目錄。這里我們單獨將配置文件獨立出來,不準(zhǔn)備和 Functions.php 湊到一起,因為 這個 Functions.php 文件以后還有其他站點功能需要用到。
然后我們創(chuàng)建一個 options.lezaiyun.php 文件。
<?php if( class_exists( 'CSF' ) ) { $prefix = 'my_framework'; // // Create options // CSF::createOptions( $prefix, array( 'menu_title' => '主題設(shè)置', 'menu_slug' => 'csf-demo', ) ); // // Create a section // CSF::createSection( $prefix, array( 'title' => '基礎(chǔ)設(shè)置', 'icon' => 'fas fa-rocket', 'fields' => array( // // A text field // array( 'id' => 'opt-text', 'type' => 'text', 'title' => 'Text', ), array( 'id' => 'opt-textarea', 'type' => 'textarea', 'title' => 'Textarea', 'help' => 'The help text of the field.', ), array( 'id' => 'opt-upload', 'type' => 'upload', 'title' => 'Upload', ), array( 'id' => 'opt-switcher', 'type' => 'switcher', 'title' => 'Switcher', 'label' => 'The label text of the switcher.', ), array( 'id' => 'opt-color', 'type' => 'color', 'title' => 'Color', 'default' => '#3498db', ), array( 'id' => 'opt-checkbox', 'type' => 'checkbox', 'title' => 'Checkbox', 'label' => 'The label text of the checkbox.', ), array( 'id' => 'opt-radio', 'type' => 'radio', 'title' => 'Radio', 'options' => array( 'yes' => 'Yes, Please.', 'no' => 'No, Thank you.', ), 'default' => 'yes', ), array( 'id' => 'opt-select', 'type' => 'select', 'title' => 'Select', 'placeholder' => 'Select an option', 'options' => array( 'opt-1' => 'Option 1', 'opt-2' => 'Option 2', 'opt-3' => 'Option 3', ), ), array( 'id' => 'opt-icon', 'type' => 'icon', 'title' => 'Icon', ), ) ) ); }
這里先放一個簡單的演示文件。這里的規(guī)則我們也可以參考CSF的演示文檔,然后進(jìn)行漢化和修改。演示文檔里包括有很多常用的文本,比如上傳、文本框、選擇框等等。
然后我們需要到 codestar-framework 文件夾中的 codestar-framework.php 文件引用,添加。
require_once plugin_dir_path(__FILE__) .'options/options.lezaiyun.php';
這樣子,我們就可以去WP后臺看看我們這個主題。
這里我用CSF框架自帶的基礎(chǔ)功能可以作為主題的后臺,是不是比我們自己做后臺簡單很多?那我們?nèi)绾握{(diào)用后臺設(shè)置配置好的參數(shù)呢?
我們需要先看下 options.lezaiyun.php 文件上面的:
$prefix = 'my_framework';
這個 "my_framework" 可以根據(jù)我們的需要修改自定義創(chuàng)意的,比如 lezaiyun_framework,因為后面調(diào)用數(shù)據(jù)前端顯示的時候需要用到。
<?php echo get_option('lezaiyun_framework')['文本ID']; ?>
或者我們也可以自定義更短的。
在 Functions.php 自定義獲取數(shù)據(jù)方式:
if (! function_exists('lezaiyun')) { function lezaiyun($option = '', $default = null) { $options = get_option('my_framework'); return (isset($options[$option])) ? $options[$option] : $default; } }
這樣我們調(diào)用的時候直接用:
<?php echo lezaiyun('文本ID'); ?>
這樣是不是更簡潔。
這樣,我們就完成Codestar Framework框架的部署到WordPress主題中,我們可以在后端設(shè)置需要調(diào)用的參數(shù)部分,然后在前端主題里調(diào)用出來,這樣就可以依托Codestar Framework框架做比較豐富的主題,而不是讓用戶在主題里修改代碼。
評論