WordPress 安装Options Framework主题框架方法

我们使用过WordPress商用或者付费主题的朋友会发现大部分主题设置后台都长的样子差不多。实际上这个是主题后台使用的是主题框架，市面上大大小小几十款可用的WordPress主题框架。老蒋看到大部分国内的主题开发者习惯使用Options Framework框架。

老蒋目前还未曾开发过WordPress主题，在这篇文章中熟悉体验看看如何在主题中安装Options Framework主题框架的。简单的记录为后续可能需要用到做一些准备。

第一、Options Framework框架下载安装

Options Framework 框架尽量从官方下载最新版本，确保安全。

下载地址：https://github.com/devinsays/options-framework-theme/archive/master.zip

这里我们直接下载。

这里我们需要安装Options Framework框架到主题中的话，在开发主题的时候先添加上面images、inc、options.php 复制到主题根目录中。

//加载框架文件
if (!function_exists('optionsframework_init')) {
  define( 'OPTIONS_FRAMEWORK_DIRECTORY', get_template_directory_uri() . '/inc/' );
  require_once dirname( __FILE__ ) . '/inc/options-framework.php';

  // Loads options.php from child or parent theme
  $optionsfile = locate_template( 'options.php' );
  load_template( $optionsfile );
}
//菜单名字
add_filter( 'optionsframework_menu', 'of_options_menu_filter' );
function of_options_menu_filter( $menu ) {
  $menu['mode'] = 'menu';
  $menu['page_title'] = __( '主题选项', 'of' );
  $menu['menu_title'] = __( '主题选项', 'of' );
  $menu['menu_slug'] = 'of-theme';
  return $menu;
}
//示例：添加自定义 js
add_action( 'optionsframework_custom_scripts', 'optionsframework_custom_scripts' );
function optionsframework_custom_scripts() { ?>
<script type="text/javascript">
jQuery(document).ready(function() {
  jQuery('#example_showhidden').click(function() {
      jQuery('#section-example_text_hidden').fadeToggle(400);
  });
  if (jQuery('#example_showhidden:checked').val() !== undefined) {
    jQuery('#section-example_text_hidden').show();
  }
});
</script>
<?php
}

然后将这些代码添加到当前主题中的Functions.php文件中。

这个时候我们再去后台刷新看看是不是已经添加到"主题选项"菜单。

第二、简单的主题框架配置调用

在上面，老蒋就简单的将Options Framework主题框架安装，但是目前对于主题是不起作用的。我们需要配置才可以，这里我简单的整理几个调用设置，但是后面如果有准备朝这个方向整理的时候再详细记录。

$options[] = array(
    'name' => __( 'Input Text', 'theme-textdomain' ),
    'desc' => __( 'A text input field.', 'theme-textdomain' ),
    'id' => 'example_text',
    'std' => 'Default Value',
    'type' => 'text'//文本框（单行）
);

比如要调用 example_text 值，这里调用：

$oox = of_get_option( 'example_text', 'Empty');

如果我们希望添加主题设置最上面切换的选项卡：

$options[] = array(
    'name' => '新选项卡',
    'type' => 'heading'
);

后面以后慢慢实践的时候再看。