[WordPress教程]新手利用Options Framework搭建后台主题面板

Options Framework Theme是Options Framework的主题版,特点是可以集成到主题中,想象一下那些收费主题的后台选项吧,用这个就可以实现。Options Framework也有插件版,叫做Options Framework Plugin,定制化上比主题版稍差,但重用性和方便性都大大增加了。

1. 将目录下images目录css目录和options.php文件拷贝到自己主题的根目录中。

2. 合并functions.php,打开Options Framework的functions.php,这是框架的初始化代码,放到自己主题的functions.php中

if ( !function_exists( 'optionsframework_init' ) ) {
    define( 'OPTIONS_FRAMEWORK_DIRECTORY', get_bloginfo('template_directory') . '/admin/' );
    require_once dirname( __FILE__ ) . '/admin/options-framework.php';
}

Option Framework 的设置调用函数名称为 of_get_option(),如果你想自定义为其他,需要对源代码本身修改了——打开options-framework.php 这个文件,定位到最后一个定义函数的地方,将of_get_option 改为你需要的,比如:

if ( ! function_exists( 'lvrku_option' ) ) :
function mindia_option( $name, $default = false ) {
	$config = get_option( 'optionsframework' );
 
	if ( ! isset( $config['id'] ) ) {
		return $default;
	}
 
	$options = get_option( $config['id'] );
 
	if ( isset( $options[$name] ) ) {
		return $options[$name];
	}
 
	return $default;
}

就可以实现函数名称为lvrku_option


类型: text (mini)
of_get_option('example_text_mini'): 默认值

of_get_option('example_text_mini'):<?php echo of_get_option( 'example_text_mini', '空值' ); ?>

类型: text
of_get_option('example_text'): 默认值

of_get_option('example_text'):<?php echo of_get_option( 'example_text', '空值' ); ?>

类型: textarea
of_get_option('example_textarea'): 默认文本

of_get_option('example_textarea'):<?php echo of_get_option( 'example_textarea', '空值' ); ?>

类型: select (mini)
of_get_option('example_select'):

of_get_option('example_select'):<?php echo of_get_option( 'example_select', '空值' ); ?>

类型: select2 (wide)

of_get_option('example_select_wide'):


of_get_option('example_select_wide'): <?php echo of_get_option( 'example_select_wide', '空值' ); ?>

类型: select

of_get_option('example_select_categories'): category id =


>of_get_option('example_select_categories'): category id = <?php echo of_get_option( 'example_select_categories', '空值' ); ?>

类型: select

of_get_option('example_select_tags'): term id =


of_get_option('example_select_tags'): term id = <?php echo of_get_option( 'example_select_tags', '空值' ); ?>

类型: select

of_get_option('example_select_pages'): page id =


of_get_option('example_select_pages'): page id = <?php echo of_get_option( 'example_select_pages', '空值' ); ?>

类型: radio

of_get_option('example_radio'):


of_get_option('example_radio'): <?php echo of_get_option( 'example_radio', '空值' ); ?>

类型: checkbox

of_get_option('example_checkbox'):


of_get_option('example_checkbox'): <?php echo of_get_option( 'example_checkbox', '空值' ); ?>

以下是高级类型

类型: uploader
of_get_option('example_uploader'):

of_get_option('example_uploader'): <?php echo of_get_option( 'example_uploader', '空值' ); ?>
   <?php if ( of_get_option( 'example_uploader' ) ) { ?>
   <img src="<?php echo of_get_option( 'example_uploader' ); ?>" />
<?php } ?>

类型: image

of_get_option('images'): 2c-l-fixed


of_get_option('images'): <?php echo of_get_option( 'example_images', '空值' ); ?>

类型: multicheck

of_get_option('multicheck'): Array ( [one] => 1 [two] => [three] => [four] => [five] => 1 )


of_get_option('multicheck'):
<?php $multicheck = of_get_option( 'example_multicheck', 'none' ); ?>
<?php print_r($multicheck); ?>

类型: background

<?php $background = of_get_option('example_background');
			if ( $background ) {
				if ( $background['image'] ) {
					echo '<span style="display: block; height: 200px; width: 200px; background:url(' . $background['image'] . ') "></span>';
					echo '<ul>';
					foreach ( $background as $i=> $param ){
						echo '<li>'.$i . ' = ' . $param . '</li>';
				}
				echo '</ul>';
				} else {
					echo '<span style="display: inline-block; height: 20px; width: 20px; background:' . $background['color'] . ' "></span>';
					echo '<ul>';
					echo '<li>'.$background['color'].'</li>';
					echo '</ul>';
				}
			} else {
				echo "没有值";
			}; ?>

类型: typography

<?php $typography = of_get_option('example_typography');
			if ( $typography ) {
				echo '<ul>';
				foreach ( $typography as $i => $param ) {
					echo '<li>'.$i . ' = ' . $param . '</li>';
				}
				echo '</ul>';
				echo '<span style="font-family: ' . $typography['face'] . '; font-size:' . $typography['size'] . '; font-style: ' . $typography['style'] . '; color:'.$typography['color'] . ';">Some sample text in your style</span>';
			} else {
				echo "空值";
			} ?>

类型: editor

<?php echo of_get_option( 'example_editor', '空值'); ?>

Options Framework怎么设置呢?,一切都定义在options.php中

name – 选项的label名称
id – 这个id很重要,区分每个选项,必须是唯一的,存储和获取选项时这个作为键使用
type – 不同type产生不同的选项

<?php
 
/* options.php line 60 */
 
//初始化存储选项的$options数组
$options = array();
 
//定义一个选项卡,标题是Basic Settings,注意type是heading
$options[] = array("name" => "Basic Settings",
    "type" => "heading");
    //定义一个text类型的input box,type要设置为text,class为mini会让input长度比较短
    $options[] = array("name" => "Input Text Mini",
    "desc" => "A mini text input field.",
    "id" => "example_text_mini",
    "std" => "Default",
    "class" => "mini",
    "type" => "text");
 
//同上,但没有设置class mini,input长度较长
$options[] = array("name" => "Input Text",
    "desc" => "A text input field.",
    "id" => "example_text",
    "std" => "Default Value",
    "type" => "text");
 
//输出一个textarea
$options[] = array("name" => "Textarea",
    "desc" => "Textarea description.",
    "id" => "example_textarea",
    "std" => "Default Text",
    "type" => "textarea");
 
//输出select下拉菜单,$test_array存储下拉菜单的选项,“std”表示默认选中的项
$options[] = array( "name" => "Input Select Small",
 "desc" => "Small Select Box.",
 "id" => "example_select",
 "std" => "three",
 "type" => "select",
 "class" => "mini", //mini, tiny, small
 "options" => $test_array);
 
...

  • 发表评论

      • 龙笑天

        这个教程就很给力了,一直没敢去动后台框架~

        回复
        • 可能你们主题本身就自带设置功能
          我这个原来都是修改代码实现的,所以必须弄个后台框架才能方便操作

          Tmd回复私信