• wordpress CMS主题:ssmay主题wordpress CMS主题:ssmay主题
  • 首页 > wordpress CMS主题制作 > 用类来添加wordpressCMS主题设置页面(2):添加类文件前段

    用类来添加wordpressCMS主题设置页面(2):添加类文件前段

    作者: 分类:wordpress CMS主题制作 点击: 1,948 次
    wordpress CMS主题:ssmay主题

      在上一章,我们简单阐述了用类添加wordpressCMS主题设置页面的思路,现在,我们就来按照这个思路来一步一步地来做。本章,主要介绍为wordpressCMS主题添加一个设置页面的类文件,有了这个类文件,我们就可以非常方便地为设置页面添加设置选项了。下面,我们就按照上章介绍的类的结构框架来设计这个类。

      第一步:添加类的属性。

      这里我们为类添加4个属性,这4个属性在接下来的代码中会用到。代码如下:

      //类的属性
      var $options;
      var $pageinfo;
      var $database_options;
      var $saved_optionname;

      第二步:添加类的构造函数。

      每个PHP类都会有一个构造函数,即使我们不创建构造函数,类也会有一个默认的构造函数,熟悉PHP的都会知道。这里,我们要为类创建一个新的构造函数,代码如下:

      //类的构建函数
      function __construct($options, $pageinfo) {
      $this->options = $options;
      $this->pageinfo = $pageinfo;
      $this->make_data_available(); //准备设置选项数据

      add_action( 'admin_menu', array(&$this, 'add_themeset_menu') );

      if( isset($_GET['page']) && ($_GET['page'] == $this->pageinfo['filename']) ) {
      //加载css js
      add_action('admin_init', array(&$this, 'Add_JS'));
      }
      }

      通过上面这个构造函数,我们为wordpress主题后台添加了一个菜单,菜单函数名是add_themeset_menu,这个函数会在下面创建。并且还调用了一个 Add_JS 函数,这个也会在下面创建。

      第三步:添加设置页面菜单函数。

      在wordpress主题后台添加菜单有2种,一种是添加后台顶级菜单,一种是添加后台顶级菜单的子菜单。所以,下面的代码中,我们添加了一个判断,如是不是子菜单,就添加顶菜单,否则就添加子菜单到顶级菜单“外观”下。代码如下:

      //创建菜单项函数
      function add_themeset_menu() {
      //添加顶级菜单项
      $top_level = "主题设置";
      if(!$this->pageinfo['child']) { //如果child=false ,就添加顶级菜单
      add_menu_page($top_level, $top_level, 'edit_themes', $this->pageinfo['filename'], array(&$this, 'initialize'));
      define('TOP_LEVEL_BASEAME', $this->pageinfo['filename']);
      }else{ // 否则就添加外观下的 子菜单
      //add_submenu_page(TOP_LEVEL_BASEAME, $this->pageinfo['full_name'], $this->pageinfo['full_name'], 'edit_themes', $this->pageinfo['filename'], array(&$this, 'initialize'));
      add_theme_page( $this->pageinfo['full_name'], $this->pageinfo['full_name'], 'administrator', $this->pageinfo['filename'],array(&$this, 'initialize'));

      }
      }

      第四步:添加CSS和JS调用函数。

      想要让wordpress后台的设置页面显示得好看点,我们还要为设置页面添加CSS样式,如果想在设置页面添加图片上传选项,我们还要为添加相应的JS代码,这个在前面介绍过,不多说。代码如下:

      function Add_JS() { //加载图片上传等的js 以及页面CSS路径
      wp_enqueue_script('wanlimm_options_js', TEMJS_URI.'wanlimm_options.js');
      wp_enqueue_style('wanlimm_options_css', TEMJS_URI.'wanlimm_options.css');
      wp_enqueue_script('thickbox');
      wp_enqueue_style('thickbox');
      }

      第五步:添加选项组函数。

      为了方便后面的设置选项的添加,也为了前台的调用数据,我们在这里添加一个选项组函数,。代码如下:

      function make_data_available() {
      global $wanlimm_option; //申明全局变量

      foreach ($this->options as $option) {
      if( isset($option['std']) ) {
      $wanlimm_option_std[$this->pageinfo['optionname']][$option['id']] = $option['std'];
      }
      }
      //选项组名称
      $this->saved_optionname = 'wanlimm_'.$this->pageinfo['optionname'];
      $wanlimm_option[$this->pageinfo['optionname']] = get_option($this->saved_optionname);

      //合并数组
      $wanlimm_option[$this->pageinfo['optionname']] = array_merge((array)$wanlimm_option_std[$this->pageinfo['optionname']], (array)$wanlimm_option[$this->pageinfo['optionname']]);

      //html实体转换
      $wanlimm_option[$this->pageinfo['optionname']] = $this->htmlspecialchars_deep($wanlimm_option[$this->pageinfo['optionname']]);

      }

      //使用递归将预定义html实体转换为字符
      function htmlspecialchars_deep($mixed, $quote_style = ENT_QUOTES, $charset = 'UTF-8') {
      if (is_array($mixed) || is_object($mixed)) {
      foreach($mixed as $key => $value) {
      $mixed[$key] = $this->htmlspecialchars_deep($value, $quote_style, $charset);
      }
      }
      elseif (is_string($mixed)) {
      $mixed = htmlspecialchars_decode($mixed, $quote_style);
      }
      return $mixed;
      }

      今天就介绍到这里,在下章中我们将为类添加设置选项和处理函数。

       



      QQ二维码

    文章作者:高时银博客
    本文地址:http://wanlimm.com/77201506254519.html
    版权所有 © 转载时必须以链接形式注明作者和原始出处!

    上一篇:
    下一篇:
    wordpress CMS主题:ssmay主题

    或许你会感兴趣的文章:

    发表评论

    电子邮件地址不会被公开。 必填项已用*标注

    This site uses Akismet to reduce spam. Learn how your comment data is processed.