gogobody 发表于 2022-5-9 12:34

Typecho第一款选项框架 jkOptionsFramework

本帖最后由 gogobody 于 2022-5-9 12:37 编辑

jkOptionsFramework 是由即刻学术开发的一款 Typecho 选项框架,移植于WordPress。

目前完成: 图片设置、图片选择、图片上传、图库管理 颜色选择器、日期选择器 基本的Radio、Text、TextArea、Select 设置分组、设置增加选项(扩展选项) 设置混合选项、不同组件嵌套如:Accordion、Tab、Fiedset 代码编辑器:codemirror支持 颜色:颜色选择、颜色分组、链接颜色、颜色卡 设计字段:背景(链接、颜色、位置),排版(字体大小颜色、文本对齐、间距等),宽度高度(px为单位),间距,边框,微调器,数字 额外组件:滑块组件,可拖动排序组件,switcher开关组件,图标组件,地图组件,链接组件,日期选择,时间选择,图片选择,按钮组, 组件依赖:例如打开开关时才显示相应的选项 验证器:邮件、数子、email 避雷针:将字符串a替换为b//没啥用 备份以及导出

它能做什么?

熟悉Typecho的伙计都知道,typecho 以简洁为主,然而,开发主题或者插件的过程中,其设置选项对于用户来说并不是很友好。 由于内容很多,只简要介绍部分设置。 例如,一个typecho 的主题设置可能长这样:


而使用 jkOptionsFramework 后,它可以是这样:

下面以一个简单的单页设置为例:



点击上传按钮即可上传图片。

更好的图片上传:

更好的媒体库:

当然也可以直接选择图片:

更好的颜色选择:

快速入门指南

下载最新版本的插件github开源地址,上传自Typecho 插件目录,并修改目录名为 jkOptionsFramework ,然后启用插件即可。

打开你的主题的 functions.php 然后粘贴以下代码: 需要注意的是,该选项插件与Typecho的设置选项并无关联。

// Check core class 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'=> 'Tab Title 1',
    'fields' => array(
      // A text field
      array(
      'id'    => 'opt-text',
      'type'=> 'text',
      'title' => 'Simple Text',
      ),
    )
) );
// Create a section
CSF::createSection( $prefix, array(
    'title'=> 'Tab Title 2',
    'fields' => array(
      // A textarea field
      array(
      'id'    => 'opt-textarea',
      'type'=> 'textarea',
      'title' => 'Simple Textarea',
      ),
    )
) );
}
function themeConfig($form)
{
    $params = [
      'args'=> [
            'framework_title' => 'xxx主题设置',
            'footer_text' => '感谢您使用xxx主题',
      ]
    ];
    CSF::setup('my_framework', $params);
    CSF::setTypechoOptionForm($form);
}

如何获取一个配置的值呢?

$options = get_option( 'my_framework' ); // 唯一的识别号
echo $options['opt-text']; // 选项的id
echo $options['opt-textarea']; // 选项的id
更多详情请参考:jkOptionsFramework文档https://www.wolai.com/xvse6BfZ5vMxd9LgjYBjRM

wangnet 发表于 2022-6-29 00:30

这么好的内容没有人顶呢

48hours 发表于 2022-8-6 17:30

看一下。不知道有没有评论设置
页: [1]
查看完整版本: Typecho第一款选项框架 jkOptionsFramework