need help creating theme options

1 replies
hello guys and girls,

ive been creating wordpress themes for a little bit now (mainly css)

i have now created my own theme code (custom widget area, dynamic classes for titles, post page titles h1 instead of h2)

this works great so far (no styling, working on the backend for now)

i want to have some theme options for the theme, theres lots of tutorials i know, but im still struggling.

rather than having a "theme options" page, i wanted to have my own top level dashboard item and seperate the theme options into sub pages.

i found a tutorial to do this and it work great. heres the code.

<?php


// this is where you add menu items
// Hook for adding admin menus
add_action('admin_menu', 'mt_add_pages');

// action function for above hook
function mt_add_pages() {
// Add a new top-level menu (ill-advised):
add_menu_page('Architect settings', 'Architect settings', 'administrator', 'as_main_page', 'settings_page');

// Add a submenu to the custom top-level menu: styles
add_submenu_page('as_main_page', 'Design and Layout', 'Design and Layout', 'administrator', 'sub-page', 'design_layout_page');

// Add a second submenu to the custom top-level menu: Social Info
add_submenu_page('as_main_page', 'Social Info', 'Social Info', 'administrator', 'sub-page2', 'social_info_page');

// Add a third submenu to the custom top-level menu: About me
add_submenu_page('as_main_page', 'About Me', 'About Me', 'administrator', 'sub-page3', 'about_me_page');

// Add a forth submenu to the custom top-level menu: Ad Spaces
add_submenu_page('as_main_page', 'Ad Spaces', 'Ad Spaces', 'administrator', 'sub-page4', 'ad_spaces_page');
}

// settings_page() displays the page content for the custom Test Toplevel menu
function settings_page() {
echo "<h2>Architect Settings</h2>";
echo '<div class="wrap">';
echo '<p>"put stuff here"</p>';
echo '</div>';
}

// design_layout_page() displays the page content for the first submenu
// of the custom Test Toplevel menu
function design_layout_page() {
echo "<h2>Styles</h2>";
echo '<div class="wrap">';
echo '<p>"put stuff here"</p>';
echo '</div>';
}

// social_info_page() displays the page content for the second submenu
// of the custom Test Toplevel menu
function social_info_page() {
echo "<h2>Social Info</h2>";
echo '<div class="wrap">';
echo '<p>"put stuff here"</p>';
echo '</div>';
}

// about_me_page() displays the page content for the second submenu
// of the custom Test Toplevel menu
function about_me_page() {
echo "<h2>About Me</h2>";
echo '<div class="wrap">';
echo '<p>"put stuff here"</p>';
echo '</div>';
}

// ad_spaces_page() displays the page content for the second submenu
// of the custom Test Toplevel menu
function ad_spaces_page() {
echo "<h2>Ad Spaces</h2>";
echo '<div class="wrap">';
echo '<p>"put stuff here"</p>';
echo '</div>';
}
?>


this makes the pages fine, but i dont know how to add multiple options to each page? i found a way to add one option per page, but thats no good.

i heard about using arrays, but again i learn by copy and paste rather than reading and every way i try doesnt seem to work.


each page has 1 function, can i make that function create other functions? i think i could get it to work that way.

can someone help me?
#creating #options #theme
  • Profile picture of the author iwantmore
    okay guys, im surprised noones posted an answer here, but lukily i foun out how to do it.

    now i have encountered another problem.

    i want to have an option to choose a stylesheet from a folder on the site full of .css file.

    does anyone know how i could go about having a dropdown menu that would show all available stylesheets in say a theme/styles/ folder.

    here is my updated code that i am working from

    <?php
    // this is where you add menu items
    // Hook for adding admin menus
    add_action('admin_menu', 'mt_add_pages');

    // action function for above hook
    function mt_add_pages() {
    // Add a new top-level menu (ill-advised):
    add_menu_page('Architect settings', 'Architect settings', 'administrator', 'as_main_page', 'settings_page');

    // Add a submenu to the custom top-level menu: styles
    add_submenu_page('as_main_page', 'Design and Layout', 'Design and Layout', 'administrator', 'sub-page', 'design_layout_page');

    // Add a second submenu to the custom top-level menu: Social Info
    add_submenu_page('as_main_page', 'Social Info', 'Social Info', 'administrator', 'sub-page2', 'social_info_page');

    // Add a third submenu to the custom top-level menu: About me
    add_submenu_page('as_main_page', 'About Me', 'About Me', 'administrator', 'sub-page3', 'about_me_page');

    // Add a forth submenu to the custom top-level menu: Ad Spaces
    add_submenu_page('as_main_page', 'Ad Spaces', 'Ad Spaces', 'administrator', 'sub-page4', 'ad_spaces_page');

    // add options for settings page
    register_setting (
    'settings_page', 'gw_code', '');
    register_setting (
    'settings_page', 'ga_code', '');
    register_setting (
    'settings_page', 'head_code', '');
    register_setting (
    'settings_page', 'footer_code', '');

    // add options for design layout page
    register_setting (
    'design_layout_page', 'layout_select', '');
    register_setting (
    'design_layout_page', 'custom_background', '');
    register_setting (
    'design_layout_page', 'header_back_color', '');
    register_setting (
    'design_layout_page', 'content_back_color', '');
    register_setting (
    'design_layout_page', 'sidbar_back_color', '');
    register_setting (
    'design_layout_page', 'title_font', '');
    register_setting (
    'design_layout_page', 'title_color', '');
    register_setting (
    'design_layout_page', 'sub_title_font', '');
    register_setting (
    'design_layout_page', 'sub_title_color', '');
    register_setting (
    'design_layout_page', 'headings_font', '');
    register_setting (
    'design_layout_page', 'h1_color', '');
    register_setting (
    'design_layout_page', 'h2_color', '');
    register_setting (
    'design_layout_page', 'h3_color', '');
    register_setting (
    'design_layout_page', 'h4_color', '');
    register_setting (
    'design_layout_page', 'h5_color', '');
    register_setting (
    'design_layout_page', 'h6_color', '');

    }

    // settings_page() displays the page content for the custom Test Toplevel menu
    function settings_page() {
    ?>
    <div class="wrap">
    <div id="icon-themes" class="icon32"></div>
    <h2>My theme options</h2>
    <form method="post" action="options.php">
    <table class="form-table">
    <tr valign="top">
    <th scope="row">Google Webmaster Code</th>
    <td><input type="text" name="gw_code"
    value="<?php
    echo get_option('gw_code'); ?>" /></td>
    </tr>
    <tr valign="top">
    <th scope="row">Google Analytics Code</th>
    <td><input type="text" name="ga_code"
    value="<?php
    echo get_option('ga_code'); ?>" /></td>
    </tr>
    <tr valign="top">
    <th scope="row">Other Codes to go into your website head section</th>
    <td><input type="text" name="head_code"
    value="<?php
    echo get_option('head_code'); ?>" /></td>
    </tr>
    <tr valign="top">
    <th scope="row">Other Codes to go into your website footer section</th>
    <td><input type="text" name="footer_code"
    value="<?php
    echo get_option('footer_code'); ?>" /></td>
    </tr>
    </table>
    <?php settings_fields('settings_page'); ?>
    <p class="submit">
    <input type="submit" class="button-primary"
    value="<?php _e('Save Changes') ?>" />
    </p>
    </form>
    </div>
    <?php }

    // design_layout_page() displays the page content for the first submenu
    // of the custom Test Toplevel menu
    function design_layout_page() {
    ?>
    <div class="wrap">
    <div id="icon-themes" class="icon32"></div>
    <h2>Design and Layout Settings</h2>
    <form method="post" action="options.php">
    <table class="form-table">
    <tr valign="top">
    <h3>Select a basic layout</h3>
    <th scope="row">Choose a layout from the options provided:</th>
    <td><input type="form-select" name="layout_select"
    value="<?php
    echo get_option('layout_selecr'); ?>" /></td>
    </tr>
    </table>
    <?php settings_fields('settings_page'); ?>
    <p class="submit">
    <input type="submit" class="button-primary"
    value="<?php _e('Save Changes') ?>" />
    </p>
    </form>
    </div>
    <?php }
    Signature
    No Half Pixels
    Creative Web Development and Design, NOT A FIXED PRICE SERVICE, if you want the best don't settle for an off the shelf solution.

    We provide cutting edge design, web development with WordPress, WHMCS, PHP, HTML, CSS, jQuery, and personalised hosting solutions to suit any needs.
    {{ DiscussionBoard.errors[1747589].message }}

Trending Topics