WordPress模板开发之主题选项 Theme Options

少羽.
少羽.
少羽.
1636
文章
92
评论
2019年10月4日15:07:47 评论 6.5K 2188字阅读7分17秒

制作WordPress主题多少会涉及到主题选项(Theme Options)页面,即使是自用的主题,想尽量节省内存减少数据库查询,也要在易用性和性能之间寻求平衡,假如有些设置是很多模板需要用到的,硬编码就太麻烦了。

制作主题选项的方法

  • 用WordPress的Settings API。
  • 用现成的主题选项框架,例如比较有名的Options Framework Theme。
  • 用主题框架中自带的主题选项功能,例如Genesis Framework,Thesis Framework,Elegant Theme的epanel或WooTheme自带的框架等

用WordPress的Settings API是最精简的方法,定制化最高,对编程要求也高。
用Options Framework Theme是最简单的方法,不需要知道什么编程技巧,装上了就可以用,很像傻瓜照相机,所以也不能对定制化和性能有过高期望。
用主题框架,前提用这个框架构建主题,很多优秀的框架开源却不免费。

易用性和性能的平衡

如果既要追求易用性又要追求性能,需要了解一些代码又不用玩命读文档,那还有一个不错的选择,该方法来自这里。

首先下载示例文件,该文件是twentyten的Child Theme,安装方法参考如何安装WordPress主题。

激活主题后,在外观选项看下就会出现Theme Options选项卡。

WordPress模板开发之主题选项 Theme Options

这个主题选项页面主要是又文件夹下的theme-options.php控制的,打开这个文件看看如何通过修改文件来定制我们需要的主题选项界面。

如何使用theme-options.php

1. 引入文件

将theme-options.php放到主题目录下,通过下面代码引入

require_once ( get_template_directory() . '/theme-options.php' );

如果是Child Theme

require_once ( get_stylesheet_directory() . '/theme-options.php' );

2.修改textdomain

WordPress的多语言主题必须有textdomain,这个示例文件中的textdomain是sampletheme,全文替换成自己主题的textdomain即可。

3. 修改外观选项卡下的Theme Options菜单名称

13-18行的代码用于产生Theme Options名称

/**
 * Load up the menu page
 */
function theme_options_add_page() {
	add_theme_page( __( 'Theme Options', 'sampletheme' ), __( 'Theme Options', 'sampletheme' ), 'edit_theme_options', 'theme_options', 'theme_options_do_page' );
}

使用的函数是add_theme_page,函数定义如下,根据定义修改

add_theme_page( $page_title, $menu_title, $capability, $menu_slug, $function);

$page_title控制页面title,$menu_title控制菜单名称

4. 生成选项

select下拉菜单和radio单选按钮通过定义数组产生,分别是$select_options和$radio_options。

select、radio、input或checkbox等HTML结构均在函数theme_options_do_page()中输出。

5. 调用主题选项中的项目


$options是一个数组,输出主题选项页面所有的选项,以安装后默认的选项为例,$options的内容如下

Array
(
    [sometext] => 
    [selectinput] => 0
    [sometextarea] => 
    [option1] => 0
    [radioinput] => 
)

6. 更改存储在wp_options表中的主题选项名称

如果你不想用sample_options作为选项名称,可以修改成自己主题的名字,假设你的主题叫greattheme,将下面的代码

function theme_options_init(){
	register_setting( 'sample_options', 'sample_theme_options', 'theme_options_validate' );
}

替换为

function theme_options_init(){
	register_setting( 'greattheme_options', 'great_theme_options', 'theme_options_validate' );
}

进行全文替换,将sample_options全文替换为greattheme_options,将some_theme_options全部替换为great_theme_options。

register_setting是WordPress Settings API中的一个函数,用来注册选项并通过回调函数(callback)输出HTML结构,函数原型如下

register_setting( $option_group, $option_name, $sanitize_callback ); 

使用这个简单的主题选项模板,很轻量级,不会影响主题性能。

继续阅读
少羽.
  • 本文由 发表于 2019年10月4日15:07:47
  • 除非特殊声明,本站文章均为原创,转载请务必保留本文链接
禁用 WordPress 5.5 图片延迟加载功能 WordPress

禁用 WordPress 5.5 图片延迟加载功能

WordPress 5.5除了不断优化修改区块编辑器之外,还增加了几个新功能,其中的图片延迟加载功能,经本人测试,除了在火狐下有效果,在Chromium内核的浏览器中无效,难道是开发人员也和我一样只用...
WordPress纯代码实现独立相册功能 WordPress

WordPress纯代码实现独立相册功能

其实,这篇文章很早准备发了,一直拖,拖,拖硬生生拖到了现在,今天整合闲着,就更新一下博客吧! 想到这个文章,我忘记发了,今天就补上 hhh 正文 思路是前段时间写模板琢磨出来的,模板写废了,也不准备写...
广告也精彩
匿名

发表评论

匿名网友 填写信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: