亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

實(shí)現(xiàn)WordPress主題側(cè)邊欄切換功能的PHP腳本詳解

 更新時(shí)間:2015年12月14日 16:26:35   作者:吳釗  
這篇文章主要介紹了實(shí)現(xiàn)WordPress主題側(cè)邊欄切換功能的PHP腳本詳解,包括為WordPress主題添加管理選項(xiàng)的方法,需要的朋友可以參考下

作為主題的制作者, 除了實(shí)現(xiàn)功能, 展示界面, 還有責(zé)任使主題靈活多變, 以滿(mǎn)足更多人不同的需求.
可能一些朋友曾為選用雙欄主題 (單側(cè)邊欄) 還是三欄主題 (雙側(cè)邊欄) 而煩惱過(guò). 下面我們以 Classic 主題為例, 談?wù)勅绾卧谥黝}中方便地切換單側(cè)邊欄和雙側(cè)邊欄. 最后我會(huì)提供修改后的主題.

20151214161808473.png (344×174)

添加管理選項(xiàng)
后臺(tái)處理
首先, 我們要修改 function.php, 主要的處理工作都在這個(gè)文件里面, 如果主題沒(méi)有這個(gè)文件, 就創(chuàng)建一個(gè)吧. (沒(méi)有 function.php 說(shuō)明主題不支持 Widget, 可不是一個(gè)好習(xí)慣哦, 還是趕緊新建一個(gè)吧)
我的處理包括 3 大塊: 獲取選項(xiàng), 初始化, 標(biāo)簽頁(yè)操作界面. 這里只創(chuàng)建一個(gè)公告欄, 包括兩個(gè)選項(xiàng) (是否顯示公告欄和公告欄內(nèi)容). 如果要添加更多選項(xiàng), 也只需要代碼中 3 個(gè) TODO 的位置上追加一些代碼而已. 當(dāng)然, 你還需要改一下選項(xiàng)名稱(chēng), 將 Classic 和 classic 全部之換掉.

<?php
/**
 * 選項(xiàng)組類(lèi)型
 */
class ClassicOptions {
 
 /* -- 獲取選項(xiàng)組 -- */
 function getOptions() {
 // 在數(shù)據(jù)庫(kù)中獲取選項(xiàng)組
 $options = get_option('classic_options');
 // 如果數(shù)據(jù)庫(kù)中不存在該選項(xiàng)組, 設(shè)定這些選項(xiàng)的默認(rèn)值, 并將它們插入數(shù)據(jù)庫(kù)
 if (!is_array($options)) {
  $options['notice'] = false;
  $options['notice_content'] = '';
  // TODO: 在這里追加其他選項(xiàng)
  update_option('classic_options', $options);
 }
 // 返回選項(xiàng)組
 return $options;
 }
 
 /* -- 初始化 -- */
 function init() {
 // 如果是 POST 提交數(shù)據(jù), 對(duì)數(shù)據(jù)進(jìn)行限制, 并更新到數(shù)據(jù)庫(kù)
 if(isset($_POST['classic_save'])) {
  // 獲取選項(xiàng)組, 因?yàn)橛锌赡苤恍薷牟糠诌x項(xiàng), 所以先整個(gè)拿下來(lái)再進(jìn)行更改
  $options = ClassicOptions::getOptions();
 
  // 數(shù)據(jù)限制
  if ($_POST['notice']) {
  $options['notice'] = (bool)true;
  } else {
  $options['notice'] = (bool)false;
  }
  $options['notice_content'] = stripslashes($_POST['notice_content']);
 
  // TODO: 在這追加其他選項(xiàng)的限制處理
 
  // 更新數(shù)據(jù)
  update_option('classic_options', $options);
 
 // 否則, 重新獲取選項(xiàng)組, 也就是對(duì)數(shù)據(jù)進(jìn)行初始化
 } else {
  ClassicOptions::getOptions();
 }
 
 // 在后臺(tái) Design 頁(yè)面追加一個(gè)標(biāo)簽頁(yè), 叫 Current Theme Options
 add_theme_page("Current Theme Options", "Current Theme Options", 'edit_themes', basename(__FILE__), array('ClassicOptions', 'display'));
 }
 
 /* -- 標(biāo)簽頁(yè) -- */
 function display() {
 $options = ClassicOptions::getOptions();
?>
 
<form action="#" method="post" enctype="multipart/form-data" name="classic_form" id="classic_form">
 <div class="wrap">
 <h2><?php _e('Current Theme Options', 'classic'); ?></h2>
 
 <!-- 公告欄 -->
 <table class="form-table">
  <tbody>
  <tr valign="top">
   <th scope="row">
   <?php _e('Notice', 'classic'); ?>
   <br/>
   <small style="font-weight:normal;"><?php _e('HTML enabled', 'classic') ?></small>
   </th>
   <td>
   <!-- 是否顯示公告欄 -->
   <label>
    <input name="notice" type="checkbox" value="checkbox" <?php if($options['notice']) echo "checked='checked'"; ?> />
    <?php _e('Show notice.', 'classic'); ?>
   </label>
   <br/>
   <!-- 公告欄內(nèi)容 -->
   <label>
    <textarea name="notice_content" cols="50" rows="10" id="notice_content" style="width:98%;font-size:12px;" class="code"><?php echo($options['notice_content']); ?></textarea>
   </label>
   </td>
  </tr>
  </tbody>
 </table>
 
 <!-- TODO: 在這里追加其他選項(xiàng)內(nèi)容 -->
 
 <!-- 提交按鈕 -->
 <p class="submit">
  <input type="submit" name="classic_save" value="<?php _e('Update Options &raquo;', 'classic'); ?>" />
 </p>
 </div>
 
</form>
 
<?php
 }
}
 
/**
 * 登記初始化方法
 */
add_action('admin_menu', array('ClassicOptions', 'init'));
 
?>

前臺(tái)處理

要公告欄在首頁(yè)上顯示, 需要修改一下 index.php, 這個(gè)比較簡(jiǎn)單, 只是通過(guò)一些判斷語(yǔ)句決定東西要不要顯示出來(lái)而已. 當(dāng)然, 你可以進(jìn)行其他操作, 關(guān)鍵是獲取到選項(xiàng)的值, 并對(duì)它們進(jìn)行處理.
其實(shí)可以分為兩步:

獲取選項(xiàng) (對(duì)每個(gè) PHP 文件, 獲取一次就行了, 可以在文件頂部執(zhí)行)
對(duì)選項(xiàng)進(jìn)行處理 (這里判斷成立的話就將公告內(nèi)容顯示出來(lái))

<!-- 獲取選項(xiàng) -->
<?php $options = get_option('classic_options'); ?>
 
<!-- 如果用戶(hù)選擇顯示公告欄, 并且公告欄有內(nèi)容, 則顯示出來(lái) -->
<?php if($options['notice'] && $options['notice_content']) : ?>
 <div id="notice">
 <div class="content"><?php echo($options['notice_content']); ?></div>
 </div>
<?php endif; ?>

可以使用管理項(xiàng)來(lái)控制側(cè)邊欄的數(shù)量, 在主題文件中獲取側(cè)邊欄的數(shù)量, 對(duì)不同的數(shù)量作出不同的處理, 以達(dá)到在不同數(shù)量側(cè)邊欄之間切換的目的.

// 側(cè)邊欄數(shù)量, 默認(rèn)為單側(cè)邊欄
$options['sidebar'] = 1;
// 獲得最新提交的值
$options['sidebar'] = $_POST['sidebar'];
<select name="sidebar" size="1">
 <!-- 單側(cè)邊欄 -->
 <option value="1" <?php if($options['sidebar'] != 2) echo ' selected '; ?>><?php _e('Single', 'classic'); ?></option>
 <!-- 雙側(cè)邊欄 -->
 <option value="2" <?php if($options['sidebar'] == 2) echo ' selected '; ?>><?php _e('Double', 'classic'); ?></option>
</select>
 <?php _e('sidebar(s)', 'classic'); ?>.

添加 Widget 支持

因?yàn)橐趩蝹?cè)邊欄和雙側(cè)邊欄中切換, 所以我們需要對(duì)不同的兩種模式定義兩個(gè) Widget 初始化的分支.
這里比較特殊, 為了在代碼中正確獲取 Widget 信息, 就算是單側(cè)邊欄也需要起一個(gè)別名. 就像代碼中的 Sidebar_single. 當(dāng)側(cè)邊欄個(gè)數(shù)為 1 時(shí), 登記 Sidebar_single. 當(dāng)側(cè)邊欄個(gè)數(shù)為 2 時(shí), 登記 Sidebar_top 和 Sidebar_bottom.

// Widgets
$options = get_option('classic_options');
 
// 單側(cè)邊欄
if(function_exists('register_sidebar') && $options['sidebar'] == 1) {
 register_sidebar(array(
 'name' => 'Sidebar_single',
 'before_widget' => '<li id="%1$s" class="widget %2$s">',
 'after_widget' => '</li>',
 'before_title' => '<h3>',
 'after_title' => '</h3>'
 ));
 
// 雙側(cè)邊欄
} else if(function_exists('register_sidebar') && $options['sidebar'] == 2) {
 register_sidebar(array(
  'name' => 'Sidebar_bottom',
  'before_widget' => '<li id="%1$s" class="widget %2$s">',
  'after_widget' => '</li>',
  'before_title' => '<h3>',
  'after_title' => '</h3>'
 ));
 register_sidebar(array(
  'name' => 'Sidebar_top',
  'before_widget' => '<li id="%1$s" class="widget %2$s">',
  'after_widget' => '</li>',
  'before_title' => '<h3>',
  'after_title' => '</h3>'
 ));
}

修改側(cè)邊欄結(jié)構(gòu)

首先要明確, 我們現(xiàn)在需要雙側(cè)邊欄結(jié)構(gòu). 怎樣將雙側(cè)邊欄變?yōu)閱蝹?cè)邊欄呢? 只要將前一個(gè)側(cè)邊欄的結(jié)束標(biāo)簽和后一個(gè)側(cè)邊欄的開(kāi)始標(biāo)簽刪除, 兩個(gè)側(cè)邊欄就合并為一個(gè)側(cè)邊欄了. 單純的文字很難將我的想法和實(shí)現(xiàn)表達(dá)出來(lái), 你可以接著看下面的代碼和示例圖片.

<ul class="sidebar_1">
 <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('sidebar_single') ) : // single ?>
 
 <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('sidebar_top') ) : // top ?>
<!-- TODO: 頂部側(cè)邊欄內(nèi)容 -->
 <?php endif; // top ?>
 
 <?php if ($options['sidebar'] >= 2) : ?>
</ul>
<ul class="sidebar_2">
 <?php endif; ?>
 
 <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('sidebar_bottom') ) : // bottom ?>
<!-- TODO: 底部側(cè)邊欄內(nèi)容 -->
 <?php endif; // bottom ?>
 
 <?php endif; // single ?>
</ul>

OK, 這就是側(cè)邊欄代碼結(jié)構(gòu)了. 它可以完美得實(shí)現(xiàn)單雙側(cè)邊欄間的切換. 但它是怎么工作的呢? 我將在后面用圖片列出它的 6 種可能出現(xiàn)的狀態(tài).
因?yàn)橹黝}已經(jīng)支持 Widget 了, 所以代碼中 function_exists('dynamic_sidebar') === true, 則 !function_exists('dynamic_sidebar') === false.
記得添加 Widget 支持時(shí)寫(xiě)的代碼嗎? 側(cè)邊欄為 1 時(shí) sidebar_single 有效, 側(cè)邊欄為 2 時(shí), sidebar_top 和 sidebar_bottom 有效. 這是貫穿整個(gè)思路的關(guān)鍵.

備注:

  • 紅色: 表示選中代碼的值是 false, 不通過(guò)
  • 綠色: 表示選中代碼的值是 true, 通過(guò)
  • 藍(lán)色: 表示選中部分將被選用的 widgets 所取代
  • 灰色: 表示選中部分代碼將會(huì)失效

狀態(tài)一: 單側(cè)邊欄, 沒(méi)使用 Widget

20151214162043469.png (600×223)

狀態(tài)二:雙側(cè)邊欄, 沒(méi)使用 Widget

20151214162105747.png (600×223)

狀態(tài)三: 單側(cè)邊欄, 使用 Widget

20151214162131301.png (600×223)

狀態(tài)四: 雙側(cè)邊欄, 頂部側(cè)邊欄使用 Widget

20151214162152461.png (600×223)

狀態(tài)五: 雙側(cè)邊欄, 底部側(cè)邊欄使用 Widget

20151214162214329.png (600×223)

狀態(tài)六: 雙側(cè)邊欄, 頂部和底部側(cè)邊欄都使用 Widget

20151214162230870.png (600×223)

相關(guān)文章

最新評(píng)論