《WP筆記》如何將佈景設定改為後台設定

加入Wordpress佈景製作的人愈來愈多,最近網友Carrie也正好在研究佈景製作,問起了丫湯後台設定的寫法,該如何去整合一些設定到後台,其實丫湯也是參考其它佈景的設定,再加上自己的一些想法來將設定寫入後台,因此我們今天就來大概說明一下簡易的後台設定,如果對於製作佈景有興趣的可以參考看看哦,不過內容對於不太熟悉php的朋友們可能有點難懂,慢慢研究囉。

範例說明-將RSS位址設定移至WP後台:

比如我們原本寫在佈景的RSS程式碼如下,而我們主要就是要將http://feeds2.feedburner.com/steach  這一個網址修改成能夠在後台設定,請往下來看。

<a href="http://feeds2.feedburner.com/steach" title="訂閱『<?php bloginfo('name'); ?>』的RSS"  target="_blank">
    <img src="<?php bloginfo('template_url'); ?>/i/rss_32.gif" alt="訂閱RSS">
</a>

先將以下這一大段編輯進functions.php裡,我們後面再來一一說明。

<?php
class SOptions {
 
    function getOptions() {
        $options = get_option('S_options');
        if (!is_array($options)) {
            $options['feed_url'] = '';
            update_option('S_options', $options);
        }
        return $options;
    }
 
    function add() {
        if(isset($_POST['S_save'])) {
            $options = SOptions::getOptions();    
            $options['feed_url'] = stripslashes($_POST['feed_url']);
            update_option('S_options', $options);
        } else {
            SOptions::getOptions();
        }
        add_theme_page ('佈景設定','佈景設定', 'edit_themes', basename(__FILE__), array('SOptions', 'display'));
    }
    function display() {
        $options = SOptions::getOptions();
?>
        <h2>佈景設定</h2>
            請輸入RSS位址:
            <br />
             <input type="text" name="feed_url" id="feed_url" class="code" size="60" value="<?php echo($options['feed_url']); ?>">                 
        <p class="submit">
            <input class="button-primary" type="submit" name="S_save" value="儲存設定" />
        </p>
 
<?php
    }
}
add_action('admin_menu', array('SOptions', 'add'));
?>

再來將原本寫在前端佈景RSS的程式碼改為以下程式碼,也就是將原本的RSS網址改成讀取feed_url這一個變數,並在前面加上一個讀取設定。

<?php $options = get_option('S_options');?>
<a href="<?php echo $feed_url; ?>" title="訂閱『<?php bloginfo('name'); ?>』的RSS"  target="_blank">
    <img src="<?php bloginfo('template_url'); ?>/i/rss_32.gif" alt="訂閱RSS">
</a>
我們到後台看,也會多了一個佈景設定,裡面就有剛剛寫進functions.php裡的設定項目,如此一來就可以從後台直接設定RSS。
01

functions.php設定說明:

一開始這一段是用來宣告設定變數,S_optoins是丫湯設定的佈景設定名稱,你也可以自己修改為其它名稱,而feed_url就是定義給rss位址的變數,一樣你可以改為其它名稱,前面這一段是宣告變數的陣列,如果你還有更多的變數要一同宣告,可以再往下加options,比如$options['email']='';,接續在feed_url下方下去即可。

<?php
class SOptions {

    function getOptions() {
        $options = get_option('S_options');
        if (!is_array($options)) {
              $options['feed_url'] = '';
             update_option('S_options', $options);
        }
        return $options;
    }

stripslashes這一個php函數就不特別說明是為什麼要加入這個步驟,如果想深入了解請Google,只要先記得,只要是資料輸入框的變數都要加入此步驟,有多個變數的話一樣往下接續寫即可,而下方的佈景設定則是要顯示在WP後台的選單名稱,你也可以自行修改其它名稱。

function add() {
        if(isset($_POST['S_save'])) {
            $options = SOptions::getOptions();    
            $options['feed_url'] = stripslashes($_POST['feed_url']);

        } else {
            SOptions::getOptions();
        }

        add_theme_page ('佈景設定','佈景設定', 'edit_themes', basename(__FILE__), array('SOptions', 'display'));
    }

    function display() {
        $options = SOptions::getOptions();
?>

再來就是顯示在後台選項的項目,輸入框的對照value設定為feed_url變數。

<h2>佈景設定</h2>
請輸入RSS位址:
<br /><input type="text" name="feed_url" id="feed_url" class="code" size="60" value="<?php echo($options['feed_url']); ?>">

最後再加入啟用剛剛宣告的設定到admin_menu也就是後台的選單中,這樣就完成囉。

<?php
    }
}
add_action('admin_menu', array('SOptions', 'add'));
?>

 

以上全部的步驟看起來很像有點複雜,其實很簡單,只是需要實際操作過一遍,熟能生巧,這只是最簡單的將資料寫進資料庫,再去做讀取而已,不用想的太複雜,而其它更多的應用方式就要靠自己去變化囉,像是加入jquery選單、是否啟用項目等等,你也可以拆解丫湯寫過的佈景對照,或許可以更清楚。