Codestar Framework框架使用 - WordPress教程

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

    Codestar Framework,一個輕量且易用的 WordPress 選項框架,在薩龍龍最新設計開發的企業教育培訓類 WordPress 主題 Slearn 中已經使用了些框架。之前的主題都是使用 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、在主題函數文件 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、現在可以準備配置你的框架、Metabox、簡碼、自定義工具
    • e、所有的選項設置在themename/cs-framework/config目錄下
    • 詳情請閱讀文檔

    2、集成在插件中

    • 從?Github?下載插件
    • 方法1:解壓到wp-content/plugins/cs-framework你的插件目錄下
    • 方法2:在網站后臺上傳安裝插件,并激活它
    • 現在可以準備配置你的框架、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的目錄情況下重寫一個文件,只需創建一個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)
    • 數字(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)
    • 和很多擴展字段

    原創部分

    如何使用?

    上面已經提到了,

    那么,如何自定義選項?

    在主題根目錄下的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主題開發

    實例

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

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

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

    Codestar Framework框架使用 - WordPress教程

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

    Codestar Framework框架使用 - WordPress教程

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

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

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

    2019-5-10 15:28:09

    教程

    怎么統計文章字數? - WordPress教程

    2019-5-25 19:10:59

    ??
    Npcink上的部份代碼及教程來源于互聯網,僅供網友學習交流,若您喜歡本文可附上原文鏈接隨意轉載。
    無意侵害您的權益,請發送郵件至 1355471563#qq.com 或點擊右側 私信:Muze 反饋,我們將盡快處理。
    0 條回復 A文章作者 M管理員
      暫無討論,說說你的看法吧
    ?
    個人中心
    購物車
    優惠劵
    今日簽到
    有新私信 私信列表
    搜索
    主站蜘蛛池模板: 午夜影视日本亚洲欧洲精品一区| 99精品高清视频一区二区| 一本大道东京热无码一区| 日韩在线视频一区| 国产人妖在线观看一区二区| 国产精品熟女视频一区二区| 动漫精品一区二区三区3d| 色综合一区二区三区| 精品一区二区三区免费观看| 美女福利视频一区| 成人免费视频一区| 污污内射在线观看一区二区少妇| 午夜天堂一区人妻| 精品无码人妻一区二区三区| 精品无码人妻一区二区三区18| 国产一区美女视频| 国产精品高清一区二区三区| 女同一区二区在线观看| 国产综合一区二区| 视频在线观看一区| 91在线视频一区| 免费在线视频一区| 91国偷自产一区二区三区| 国产免费伦精品一区二区三区| 亚洲一区二区三区在线观看网站 | 国产产一区二区三区久久毛片国语 | 91视频一区二区三区| 波多野结衣高清一区二区三区 | 亚洲AV无码片一区二区三区| 激情内射日本一区二区三区| 国内精品视频一区二区三区八戒| 色狠狠一区二区三区香蕉| 精品无码一区二区三区水蜜桃| 久久久综合亚洲色一区二区三区 | 久久久精品人妻一区亚美研究所 | 无码福利一区二区三区| ...91久久精品一区二区三区| 亚洲日本va午夜中文字幕一区| asmr国产一区在线| 国产精品免费大片一区二区| 国产精品男男视频一区二区三区|