小码农 – worpdress主题中心开发

小码农小码农

小码农

wordpress,laravel和前端知识学习

worpdress主题中心开发

一个主题如果没有主题中心,那么这个就不能算作主题,因为那里不顺利还需要调整源代码,无疑限制了很多人.经过几天摸索学习终于弄清楚了如何开发主题设置页面.
 

众所周知,wordpress的wp-option表存放的是跟网站相关的信息,一般主题均借助该数据表存放数据,而且该数据表调用简单get_option()即可调用所需内容,因此我们的小主题,一般不存放大量数据的情况下也可以借助该表保存数据.

开发主题中心,首先要明白wordpress的钩子概念,
即wordpress为开发者预留了大量的函数和类开发时调用,
钩子顾名思义,就是挂东西的地方:
比如屋顶下垂一个挂钩我们就可以将灯笼等物品挂上去作为装饰

其实wordpress的钩子也是类似的功能,让我们可以借助wordpress的核心代码,随意的添加我们需要的功能. 

使用的方法是add_action() 

 该函数至少需要两个参数: 

    1.钩子函数  

    2.自定义函数 

例如
add_action('wp_head','myhead'); 

就是将一个myhead()函数挂载到wp_head()上,当wp_head()调用时同时调用我们定义的函数myhead();
 

wordpress官方预留了很多钩子,打开网站时的各个步骤均有预留的钩子,这样就使得我们开发过程就可以控制wordpress的所有位置.详情参考wordpress官方文档

  

接下来就是开发wordpress主题中心

 

 

以下内容均在主题下的functions.php中书写 

1.主题中心即主题启用切在后台打开时调用的,因此其挂载的函数是admin_menu,当加载后台菜单时加载我们的函数

add_action('admin_menu','my_theme_options');

2.书写my_theme_options函数主体部分,该部分需要注册一个主题子菜单作为入口

function my_theme_options(){
//参数1:页面title名称
//参数2:菜单名称
//参数3:调用权限(这个希望多搜索)
//参数4:页面别称(页面url显示)
//参数5:回调函数(页面显示只能写在该函数中)
    add_theme_page(
        'my_theme_title',
        '主题中心',
        'administrator',
        'theme_options',
        'my_theme_view'
    );
}

使用该函数为我们的主题设置放置一个入口

3.我们需要在网站后台初始化(还未加载时)为我们在wp-option表中创建我们的自定义字段,以备调用.此次函数需要在admin_menu之前因此需要挂载在admin_init(后台初始化函数)函数上;

add_action('admin_init','register_options');

function register_options(){
//参数1:自定义字段分组(wordpress会自动转换为字符串数组存档)
//参数2:添加字段名称
    register_settings(
        'my_theme_group',
        'my_theme_options'
    );
}

此时,wp-option表中就会出现我们定义的字段

4.以上准备工作做好了之后就需要开始设计展示界面(这里只作为演示)
界面函数在my_theme_view函数中定义因此

function my_theme_view(){

//这里定义我们需要的字段内容

//参数1:定义该字段覆盖区域(需要将存放数据放在一个数组中)
//参数2:页面上显示的标题
//参数3:(暂时不知道,只知道放一个函数)
//参数4:自定义字段分组(与上边相同)
    add_settings_section(){
        'my_theme_area',
        '基本信息',
        '',
        'my_theme_group'
    }
//补充:此函数类似创建一个空数组

//参数1:id(作用暂时不详)
//参数2:选项名称(后台显示的)
//参数3:回调函数(设置该数组项显示的内容)
//参数4:自定义字段群组(与之前相同)
//参数5:该字段覆盖区域
    add_settings_field(
        'my_name',
        '自定义博客名称',
        'my_name_fun',
        'my_theme_group',
        'my_theme_area'
    );
//补充:这相当于给数组增加项

//参数1:id(作用暂时不详)
//参数2:选项名称(后台显示的)
//参数3:回调函数(设置该数组项显示的内容)
//参数4:自定义字段群组(与之前相同)
//参数5:该字段覆盖区域
    add_settings_field(
        'my_name_1',
        '自定义博客名称',
        'my_name_fun_1',
        'my_theme_group',
        'my_theme_area'
    );
//补充:这相当于给数组增加项,该函数可重复调用生产多个选项

    include('functions/index.php');//由于是界面所以将界面的内容单独放一个文件

}

5. 此时界面仍然没有任何显示,因为我们并没有向界面有任何输出
定义输出内容:
1)add_settings_field中添加的每个项目的回调函数
由于具有html标签和echo的输出,操作相对麻烦,故将html标签单独输出

<?php
function my_theme_area(){
    ?>
<input type="text" name="my_theme_options[name]" value="<?php echo get_option('my_theme_options')['name'];?>"/>
    <?php
}
?>

此处的表单name必须这样写 自定义表单字段[属性] 以保证保存时为数组

2)functions/index.php中的内容

此处为最终呈现的界面

<div class="wrap"><!-- wrap是wordpress后台原生的样式类名,预定义了较多的样式,也可以自行定义书写 -->
    <h2>主题中心</h2>
    <form action="options.php" method="POST">
    <?php
//这里的选项是保存到wp-option表中,所以需要提交到options.php

//以下内容需要调用wordpress的自定义API来使用,包括 输出界面到提交到验证

    $my_theme_group = 'my_theme_group';//保存自定义字段群组

//设置随机验证的表单
    settings_fields($my_theme_group);
//输出所有设置项(类似于将所有选项整理成数组以备提交?)
    do_settings_section($my_theme_group);

//表单按钮,可以传入参数 按钮名称 按钮样式等
    submit_button();

    ?>
    </form>
</div>

6. 前台调用

直接使用get_option('my_theme_options');
返回数组,就可以自己调用想要的数据了;

如此,主题中心已经具备了,这只是原理,具体需要具体设置

 

 

很好 1 差极了 1