Codestar Framework框架使用 - WordPress教程

    Codestar 提供除了了主題選項外的 Metaboxes,Taxonomy,Shortcoder和Customizer 四種類型的選項,這些將包括一個主題所有選項的需求,了解之后實在愛不釋手

    Codestar Framework,一個輕量且易用的 WordPress 選項框架,在薩龍龍最新設計開發(fā)的企業(yè)教育培訓類 WordPress 主題 Slearn 中已經(jīng)使用了些框架。之前的主題都是使用 Redux?Framework 選項框架,很強大實用,但不是『開箱即用的』,需要修改或者刪除一些模塊,比如廣告。對比了這兩個選項框架,各有千秋,Redux 免費的只提示主題選項的設置,Codestar 則提供除了了主題選項外的 Metaboxes,Taxonomy,Shortcoder和Customizer 四種類型的選項,這些將包括一個主題所有選項的需求,了解之后實在愛不釋手。

    相對來說 Codestar 的模塊還是有很多不足,但不足的地方完全不影響使用,所以今天我來介紹下 Codestar Framework。

    Codestar Framework框架使用 - WordPress教程-Npcink
    Codestar Framework框架使用 - WordPress教程-Npcink

    Codestar Framework - 簡約實用的wordpress主題選項框架

    Codestar Framework框架使用 - WordPress教程

    三、使用

    1、集成在主題中

    • a、從?Github?下載插件
    • b、將 zip 壓縮包解壓并放在主題根目錄下,并重命名:cs-framework
    • c、在主題函數(shù)文件 functions.php 添加代碼:
    //引入設置框架
    require_once get_template_directory() .'/cs-framework/codestar-framework.php';

    文檔建議:

    require_once get_theme_file_path() .'/inc/codestar-framework/codestar-framework.php';
    • d、現(xiàn)在可以準備配置你的框架、Metabox、簡碼、自定義工具
    • e、所有的選項設置在themename/cs-framework/config目錄下
    • 詳情請閱讀文檔

    2、集成在插件中

    • 從?Github?下載插件
    • 方法1:解壓到wp-content/plugins/cs-framework你的插件目錄下
    • 方法2:在網(wǎng)站后臺上傳安裝插件,并激活它
    • 現(xiàn)在可以準備配置你的框架、Metabox、簡碼、自定義工具
    • 查看themename/cs-framework/config里的配置文件
    • 詳情請閱讀文檔

    四、啟用/禁用模塊

    添加 define 代碼到themename/functions.php文件中:

    define( 'CS_ACTIVE_FRAMEWORK', true ); // default true
    define( 'CS_ACTIVE_METABOX', false ); // default true
    define( 'CS_ACTIVE_TAXONOMY', false ); // default true
    define( 'CS_ACTIVE_SHORTCODE', false ); // default true
    define( 'CS_ACTIVE_CUSTOMIZE', false ); // default true
    

    或者直接修改/cs-framework/cs-framework.php文件中的配置

    五、啟用簡約設計模式

    插件默認的樣式是深黑色的,在你的主題或插件中添加以下的代碼,亮灰色樣式就會被激活。

    define( 'CS_ACTIVE_LIGHT_THEME',  true  ); // default false

    六、重寫文件

    你可以在不改動themename/cs-framework的目錄情況下重寫一個文件,只需創(chuàng)建一個themename/cs-framework-override文件夾,例如:

    themename/cs-framework-override/config/framework.config.php
    themename/cs-framework-override/functions/constants.php
    themename/cs-framework-override/fields/text/text.php

    七、特色

    • 選項框架(Options Framework)

    八、選項字段

    • 文本(Text)
    • 文本域(Textarea)
    • 復選框(Checkbox)
    • 單選框(Radio)
    • 選擇項(Select)
    • 數(shù)字(Number)
    • 圖標(Icons)
    • 群組(Group)
    • 圖像(Image)
    • 上傳(Upload)
    • 畫廊(Gallery)
    • 分選器(Sorter)
    • 所見即所得編輯器(Wysiwyg)
    • 開關切換器(Switcher)
    • 背景(Background)
    • 顏色取樣(Color Picker)
    • 混合復選框(Multi Checkbox)
    • 圖像復選框(Checkbox Image Select)
    • 圖像單選框(Radio Image Select)
    • 文本排版(Typography)
    • 備份(Backup)
    • 頭標題(Heading)
    • 子標題(Sub Heading)
    • 字段集(Fieldset)
    • 通知(Notice)
    • 和很多擴展字段

    原創(chuàng)部分

    如何使用?

    上面已經(jīng)提到了,

    那么,如何自定義選項?

    在主題根目錄下的functions.php文件的<?php下添加如下實例代碼即可。

    //自定義的framework設置框架
    
    // Control core classes for avoid errors
    if( class_exists( 'CSF' ) ) {
    
      //// Set a unique slug-like ID
      $prefix = 'my_framework';
    
      //// Create options
      CSF::createOptions( $prefix, array(
        'menu_title' => 'My Framework',
        'menu_slug'  => 'my-framework',
      ) );
    
      //// Create a section
      CSF::createSection( $prefix, array(
        'title'  => '選項卡一',
        'fields' => array(
    
          //// A text fieldarray('id'    => 'opt-text','type'  => 'text','title' => 'Simple Text',
          ),
     array(
          'id'    => 'mirages_testm',
          'type'  => 'media',
          'title' => '媒體一',
       'library' => 'image',
        ),
    
        )
      ) );
    
      CSF::createSection( $prefix, array(
        'title'  => '選項卡二',
        'fields' => array(
    
          array(
            'id'    => 'opt-textarea',
            'type'  => 'textarea',
            'title' => 'Simple Textarea',
          ),
    
        )
      ) );
    
    }
    
    Codestar Framework框架使用 - WordPress教程

    相關位置添加如下代碼

    $options = get_option( 'my_framework' ); // 框架的唯一 id
    
    echo $options['opt-textarea']; // id of the field

    為了function.php文件簡單一點,可以參考這篇文章:

    Codestar Framework框架使用 - WordPress教程-Npcink
    Codestar Framework框架使用 - WordPress教程-Npcink

    WordPress的functions.php引用其他php文件-WordPress主題開發(fā)

    實例

    Codestar Framework 官網(wǎng)只有代碼文檔而沒有使用的例子,幸好,我最近正在學習這個框架,并且正在漢化它,而且,還在制作一些使用的例子。敬請期待吧!

    Codestar Framework使用的例子,這是一份主題,在頁底下載:

    我只漢化了一部分,而且還很粗糙。

    Codestar Framework框架使用 - WordPress教程

    請你在后臺安裝他,并新建一個頁面:

    Codestar Framework框架使用 - WordPress教程

    這只是初步的研究成果,希望能幫助到您。

    Codestar Framework框架使用 - WordPress教程
    下載權限
    查看
    • 免費下載
      評論并刷新后下載
      登錄后下載
    • {{attr.name}}:
    您當前的等級為
    登錄后免費下載登錄 小黑屋反思中,不準下載! 評論后刷新頁面下載評論 支付以后下載 請先登錄 您今天的下載次數(shù)(次)用完了,請明天再來 支付積分以后下載立即支付 支付以后下載立即支付 您當前的用戶組不允許下載升級會員
    您已獲得下載權限 您可以每天下載資源次,今日剩余
    教程

    簡單的贊賞引導按鈕 - wordpress美化

    2019-5-10 15:28:09

    教程

    怎么統(tǒng)計文章字數(shù)? - WordPress教程

    2019-5-25 19:10:59

    ??
    Npcink上的部份代碼及教程來源于互聯(lián)網(wǎng),僅供網(wǎng)友學習交流,若您喜歡本文可附上原文鏈接隨意轉(zhuǎn)載。
    無意侵害您的權益,請發(fā)送郵件至 1355471563#qq.com 或點擊右側(cè) 私信:Muze 反饋,我們將盡快處理。
    0 條回復 A文章作者 M管理員
      暫無討論,說說你的看法吧
    ?
    個人中心
    購物車
    優(yōu)惠劵
    今日簽到
    有新私信 私信列表
    搜索
    主站蜘蛛池模板: 亚洲欧洲一区二区| 亚洲AV无码一区二区三区鸳鸯影院| 国产视频一区二区| 亚洲中文字幕一区精品自拍| 波多野结衣在线观看一区| 丰满爆乳一区二区三区| 亚洲美女一区二区三区| 日本一道高清一区二区三区| 中日韩一区二区三区| 日本一区频道在线视频| 日韩精品国产一区| 狠狠色婷婷久久一区二区三区| 成人国内精品久久久久一区| 无码国产伦一区二区三区视频| 3d动漫精品一区视频在线观看| 香蕉久久一区二区不卡无毒影院| 亚洲无圣光一区二区| 一区二区三区免费在线视频| 精品一区二区三区无码免费视频| 在线观看一区二区精品视频| 中文字幕一区在线观看| 亚洲AV无码一区二区三区久久精品 | 精品亚洲A∨无码一区二区三区 | 国产午夜精品一区二区三区极品| 99精品国产一区二区三区| 国产精品无圣光一区二区| 麻豆精品人妻一区二区三区蜜桃 | 杨幂AV污网站在线一区二区| 国产精品一区二区AV麻豆| 精品国产精品久久一区免费式| 亚洲AV无码一区二区三区牛牛| 一区二区三区四区视频| 91久久精品午夜一区二区| 亚洲午夜电影一区二区三区| 亚洲AV成人一区二区三区观看| 日本免费一区二区三区最新vr| 国产一区视频在线免费观看| 国产一区二区三区夜色| 在线播放偷拍一区精品| 综合激情区视频一区视频二区| 东京热人妻无码一区二区av|