最新公告
  • 欢迎您光临笨羊博客,本站秉承服务宗旨 履行“站长”责任,销售只是起点 服务永无止境!立即加入我们
  • WordPress后台主题设置框架ReduxFrameWork精简整合使用教程

    一提到wp的后台设置框架最常见的要属 OptionsFramework ,国内不少原创商业主题均使用此框架来支持后端与前端的各种字段交互来曾强用户对主题的自定义深度。


    OptionsFramework 我也试用过,各种设置项可以说已经很完备了,可以让开发者自由方便地分配想要的设置项目。只不过它有一个小小的瑕疵:就是设置项tab标签是横向排列的,一旦设置项分类比较多会被挤成两行,而且UI相对简陋。
    那么除了用 OptionsFramework 之外还有没有其他选择? 其实要说针对wp的后台设置框架确实还是挺多,光是搜索相关插件就有不少,但值得推荐的却相对罕有,除非开发者自己有能力写一个框架,否则还是选择“站在巨人的肩膀上”比较稳妥。


    今天我要推荐的“巨人”有两个后台框架:1、ReduxFramework;2、CodestarFramework ,而本篇主要针对ReduxFramework的特点和使用进行详细介绍。
    张昊翔博客

    基本介绍

    Redux的官方网站:https://reduxframework.com/
    Redux文档查询:https://docs.reduxframework.com/core/
    Github:https://github.com/ReduxFramework/redux-framework
    进入官网后可以看到Redux的几大特点:
    zhanghaoxiang.net

    • 1、干净的代码库
    • 2、完全品牌化
    • 3、跨浏览器兼容
    • 4、无限的灵活性
    • 5、优秀的社区
    • 6、100%开源
    如何使用它

    由于这东西是老外写的,首次接触Redux,不仅由于是英文,自带的翻译中文语言包对有些英文不起作用,还因为它的各项设置构建功能比较强大,所以若从头啃起来还是比较硬的。

    若要硬啃

    可以从上面的Github链接进入下载页面,直接下载Redux的源码并解压。之后只需要在主题的 functions.php 引用ReduxCore文件夹里的 framework.php(框架核心文件) 以及 引用sample文件夹里的 sample-config.php(配置文件)就会在后台看到此框架的设置入口页面,然后根据配置文件上的各种设置项数组的书写规范来创建自己的设置项即可。

    若不想这么折腾

    所幸的是我熟悉过 OptionsFramework ,配置上的代码也比较容易辨认,我就把语言包给移除了,直接针对配置的php文件 __()函数内的英文进行直接汉化,并且也把最常用也是最典型的一些设置项进行整理,同时精简掉极少用到的那一部份,最后就成了符合我们国人习惯的一个后台设置框架。如下图:(下载地址见下方)

    www.zhanghaoxiang.net

    张昊翔博客www.zhanghaoxiang.net

    redux

    redux

    以上的设置项相比OptionFramework要丰富一些,UI也比较容易让人接受,而且是ajax保存,还是值得考虑的。不足的地方恐怕就是这个框架的文件大小了:解压之后将近3.4M。虽说体积大,但进入后台设置页面在速度上并不会有太大影响,至于最终如何选择,看个人喜好了。

    整合版下载地址以及使用教程

    百度云:http://pan.baidu.com/s/1eSmnHaa
    提取码:rqyq

    下载之后解压,得到redux文件夹,将redux文件夹复制粘贴到主题目录下,然后用functions.php引入,具体操作步骤如下:

    (1) functions.php 引入配置和框架核心文件

    if ( !class_exists( 'ReduxFramework' ) && file_exists( get_template_directory() . '/redux/framework.php' ) && file_exists( get_template_directory() . '/redux/config.php' ) ){
    	require_once get_template_directory().'/redux/framework.php';
    	require_once get_template_directory().'/redux/config.php';
    }

    其中 config.php 是配置文件,在里面你可以设置自己的全局变量和相关参数,还有一个 config-section.php 则是设置项模板文件,你可以参考这个模板里面的各种设置类型来创建自己的设置项!

    (2) 通过参考 config-section.php 来创建修改自定义设置项目

    例如:

    array(
    	'id'       => 'baidu_push_api',
    	'type'     => 'text',
    	'title'    => __( '百度推送接口', 'redux-framework-demo' ),
    	'subtitle' => __( '子标题', 'redux-framework-demo' ),
    	'desc'     => __( '描述', 'redux-framework-demo' ),
    	'default'  => '默认文字',
    )

    修改每项 array里面的数组元素:

    id : 设置项id
    type : 设置项类型
    title : 设置项标题
    default : 设置项默认值
    …… 不同设置类型有不同的元素参数

    (3) 设置项调用 – 使用的是全局变量,这个变量名可以在config.php 参数配置数组中找到 ‘global_variable’ -> ‘inlojv_inlobase’ 来修改

    使用时的调用方法

    <?php 
    global $inlojv_inlobase; // 引入全局变量一次即可,可以放在header.php
    $inlojv_inlobase['设置项id'];  // 在需要的位置使用 echo 输出值
    ?>

    例如:上面array中你创建的设置项id为baidu_push_api,在前端输出方式就为

    <?php echo $inlojv_inlobase['baidu_push_api'];?>

    使用前务必引入全局变量一次<?php global $inlojv_inlobase; ?>

    最后特别强调:这个全局变量 $inlojv_inlobase 是我本人演示用的,在配置文件config.php里面你可以改为自己喜欢的名称。

    好了,其实整个过程并不复杂:下载文件 —— 在functions.php引入文件 —— 自己依样画葫芦创建设置项 —— 前端输出 OK!

    张昊翔博客原创文章,作者:,如若转载,请注明出处:
    1、本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长!
    2、分享目的仅供大家学习和交流,请不要用于商业用途!
    3、本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
    4、如有链接无法下载、失效或广告,请联系管理员处理!
    5、本站资源售价只是赞助,收取费用仅维持本站的日常运营所需!

    笨羊博客 » WordPress后台主题设置框架ReduxFrameWork精简整合使用教程

    常见问题FAQ

    免费下载或者VIP会员专享资源能否直接商用?
    本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。更多说明请参考 VIP介绍。
    提示下载完但解压或打开不了?
    最常见的情况是下载不完整: 可对比下载完压缩包的与网盘上的容量,若小于网盘提示的容量则是这个原因。这是浏览器下载的bug,建议用百度网盘软件或迅雷下载。若排除这种情况,可在对应资源底部留言,或 联络我们.。
    找不到素材资源介绍文章里的示例图片?
    对于PPT,KEY,Mockups,APP,网页模版等类型的素材,文章内用于介绍的图片通常并不包含在对应可供下载素材包内。这些相关商业图片需另外购买,且本站不负责(也没有办法)找到出处。 同样地一些字体文件也是这种情况,但部分素材会在素材包内有一份字体下载链接清单。
    笨羊博客
    一个关注网站建设、网站模板、搜索引擎、小程序的媒体博客

    发表评论