《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。

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選單、是否啟用項目等等，你也可以拆解丫湯寫過的佈景對照，或許可以更清楚。