new-thematic-options

Thematic Options Panel

Posted

Updated: 3/19/12

The latest version of this Thematic Options theme has been completely rebuilt to use the Options Framework Plugin. It’s rather basic and has just a couple settings- but if there’s something else you’d like to see in it please file a ticket or send over a pull request on GitHub.

If you’re interested in building options for a theme other than Thematic, please check out the Options Framework Plugin or the Options Theme.

You can download the latest version of the Thematic Options on GitHub.

About Devin

I'm a WordPress developer based in Austin, Texas. Follow my projects on GitHub, or more general WordPress ramblings as @devinsays on twitter.

131 thoughts on “Thematic Options Panel

  1. Chris wrote:

    Hi Devin,

    first of all thank you for great work!

    I’m brand new in developing wordpress websites with frameworks like thematic. I tested your extention and everything works fine. The only thing I couldn’t follow is the “example option” section. What is it for? Thanks again!

    Best regards
    Chris

    • Devin wrote:

      It’s just to show people how they can add their own options of different types to the panel. “Example Options” if you will. I’d delete those from the array if you aren’t using them.

  2. Anne Quade wrote:

    First off… THANK YOU for making this super easy! I’m having one tiny problem. When I I got to the theme option panel I loose the styling you have on your option panel. I’m using a child theme of thematic, so I’m not sure what I’m missing. Anyone else having an issue or know what I’m doing wrong?

  3. Dannci wrote:

    Hi I have problem with google anlytics bug,
    after saving i get \’ instead ‘ (‘ characters in textarea are replaced by \’.)
    Please help.

    • Devin wrote:

      Make sure you have the latest version from GitHub. It works for me. I also checked to make sure the code was in correctly to strip slashes on textboxes: $ta_value = stripslashes($data[$value['id']]);

      • Dannci wrote:

        Hi again,
        I have the latest version and corect code too.
        It works for me on my local WP installation, but when I upload files on server I have this problem.
        BTW: Great work!!

      • Dannci wrote:

        Here is my working demo:
        http://preuro.eu/preview/02/
        when you check source code in the footer you can see the bug.

      • Devin wrote:

        Make sure you also escape the characters when you output it in the theme.

  4. Justin wrote:

    Would it be possible to offer a checkbox example? For some reason it’s not working as I expected.

    If I’m trying to hide an image if the box is checked, I simply wrote it like this. Doesn’t seem to work, though. Thanks for any tips.

    • Devin wrote:

      Should be something like:

      global $data
      if ( $data['of_checkbox_example'] == ‘true’) { // Do something }

  5. Mark wrote:

    Hi Devin

    thanks so much for the tut – it looks easy AND it looks good – cant wait to start implementing it and playing around.

    One question: Is it possible to create a dropdown/select that lists all the posts of a specified custom post type? Multiple select would also be nice! Any tips or ideas?

    (just followed you on Twitter too)

    • Devin wrote:

      Hi Mark. You can pass any array to a select box (including custom post types). Try looking at how the categories are passed in the example. Multiple selects can also be set up, but it would involve a little bit of customization. I’ll put up a demo of how to do this at some point.

      • Mark wrote:

        Great, thanks Devin, will give it a try

  6. Mr.Mark wrote:

    Hi Devin, Just letting you know how I love these theme options in my WP work. Really makes things lots easier for all of us.
    Just a question of trying to expand the Theme Options…

    Is it possible to have multiple fields under 1 header? For example: “Contact Information” would have 6 text input fields: name, phone, email, address #1, address #2, city. Would it be possible to include them all under one and the same header called “Contact Information”?

    I think this would be more of an issue for the Admin area than the actual functionality of the theme options in general, but still i’d like to know if it’s possible.

    Thanks a lot and keep up the great work. Looking forward what comes out of the development into a plugin.

    • Devin wrote:

      Hey Mark. All the options have classes applied to them- so you could likely just edit the options panel stylesheet to achieve that.

  7. Pingback: Options Framework: add a few options with a dynamic stylesheet - notlaura

  8. chris wrote:

    anyway to use the ajax uploader for a post meta box?

  9. BaoQuoc Doan wrote:

    Question…for the options array, you use esc_html() for the description key. Which i can understand for security probably. But…what if you wanted to create a link to another page, or documentation elsewhere. Maybe, instead of an all or nothing…desc key would filter out all tags except links or bold.

    Great work by the way.

    Cheers,
    Wok

  10. Benji wrote:

    Hi Devin first of all great tutorial, i’m having issues when its time to implement it on my theme for example the logo doesn’t show with the echo get_option('of_logo'); and i dont think i changed the shortname i used it from the box and shows nothing, is there anything i might be doing wrong?

  11. Uranbold wrote:

    Whoa you are awesome man. Thanks, I will expand this today… :D

  12. Uranbold wrote:

    Hey I have got one question.

    -I really want to add new option Slider like premium themes.
    Slider option choose…

    I added some code but i’m not digging this framework code.

    How to add slider choose option and Where i seperated code each slider….

    $my_options[] = array( "name" => "Select a Slider type",
    "desc" => "A list of all the sliders being used on the site.",
    "id" => "Example slider",
    "std" => "Select a category:",
    "type" => "select_slider",
    "options" => $type);

    Then i added admin-interface.php

    case 'slider_type':
    if($type='3D slider') {
    $output .= '3D slider';
    }

    break;
    }

  13. Ramirez wrote:

    I know this is a great plugin.
    I’m new and try to learn by yopur post.

    Download and everything but make me confuse with so many file you have, and some articles is same to me. Link to link make me confusse.

    Do you have a step by step instalation’s article?

    I was download, copy the folder to my theme but nothing happened, the panel option is not show up in my theme (I use twentyten)

    Thanks.

      • Ramirez wrote:

        Thanks so much, Devin.
        Text version of tutorial will be great.
        Is anyone here have complete tutorial?

  14. pixi wrote:

    Hi,

    I just upgraded to WordPress version 3.2 and the footer of wordpress floats on top of the panel like this: http://cl.ly/1i3s1C333o2L1k0C1v2R. I’ve tried adding clear but it didn’t help. Any suggestions?

    • Devin wrote:

      I haven’t updated this code in a while. I’d recommend switching to the plugin version http://wordpress.org/extend/plugins/options-framework/ if you can. But I’ll try to update when I get a chance. I’m guessing that a clear is needed on line 740 of admin-interface.php.

      • pixi wrote:

        Thank you for your response. Unfortunately clear in line 740 didn’t work. Can you give another suggestion if possible?

      • Devin wrote:

        You’re right. If you remove the close div on line 106 it appears to actually fix it, at least with the default demo options, but I really need to give this code an update to match the options framework plugin code.

      • pixi wrote:

        That worked! Thank you very much :)

  15. Jiri wrote:

    Hello,

    first, thank you for releasing this, its really great stuff. I’m having a small issue – I’m testing on localhost, using XAMPP and when I select another css theme stylesheet in options menu, the css file is not loaded. The reason is that the path is not correct:

    Layout css are loaded correctly with correct path, the issue is only with files loaded from styles folder. I guess the issue is in Stylesheets Reader in theme-options.php but not sure how to fix that. Thank you for any help.

  16. pixi wrote:

    Hi,

    We seem to have the same issue Dannci has regarding the Google Analytics code. When we insert the tracking code it is being displayed with slashes even though we haven’t touched the options panel files. We use the latest version.

    • Devin wrote:

      Yes, latest version is still way out out of date. I’d recommend using the Options Framework plugin until I get an update out for this. If you need a fix before then you can add “stripslashes” on the output.

  17. Benji wrote:

    Hey Devin, how can i change in the “select a page” drop down to show the actual page title instead of the id? thanx!

  18. iografica wrote:

    Great! …only i have notice that in example option panel the footer of wordprss stay up the panel

  19. Christian Lopez wrote:

    I also noticed that when you click “Remove” on the uploader, it removes the image visually, but not from the actual server. Anyway to fix this?

  20. Ruturaaj wrote:

    I’m facing the same issue as Pixi… I’ve upgraded WP to 3.3 and I’m getting the WordPress Admin footer overlapping over the Options. I tried removing closing DIV on line 106 in “admin-interface.php” file, but no luck. Can you please suggest me a quick fix. I don’t wish to go with Plug-in and want to include the code in my theme files itself.

    Another thing… in Demo Options Page, there are two “Upload” fields, one is said to be without Text input whilst other is said to have Text input. But in Chrome as well as in Firefox, both these fields appear as buttons. I’ve not looked into this issue as yet since that’s not my theme requirement for now. The Footer overlap issue is more important for me to fix and somehow I’m just lost in the HTML and not able to detect the problem; seeking your help here my friend.

    Other that that, everything else looks good and functional; great work, thanks so much!!

  21. Rifki wrote:

    Hello Devin, this is awsome..! to grab all options you have :

    global $data;
    $data = get_option(OPTIONS);

    echo $data['my_option_id'];

    How to make the implementations more simple like :

    echo get_option('my_option_id');

    I was try but doesn’t work… can you help me?? thanks a lot …

    • Devin wrote:

      All the theme option data is saved into a single serialized array. This is how WordPress recommends to do it, otherwise you’d have dozens of options cluttering up your options tablef or each theme you’ve activated.

      You can build a helper function, if there something you don’t like about $data['option]. Such as function get_my_custom_option(‘option’).

      • Rifki wrote:

        Hello again Devin,

        I’ve one more problems, storing standart / default options when theme activated is not working.. for get the default value i must click the reset button frist.

      • Devin wrote:

        I recommend using the Options Framework plugin instead of this version. I am still working to release an update to this.

  22. Roman wrote:

    Hi Devin !

    First…thank you for this great “Addon” for WordPress…it works great !

    Now my question:
    How can I change the font-face and font-size in the typography-part.
    I dont want to use only the standard font-face (Verdana, Georgia, Tahoma etc.) and pixel as font-size…how can I add more font-face (like fonts from google-fonts) and how can I change the font-size from px to em ?

    Thanks for your help and greetings from Germany,
    Roman

  23. Pingback: Jason Bobich | Expanding accepted HTML tags in the Theme Blvd WordPress theme framework

  24. Satrya wrote:

    Any updated here ? hehe

    I’m so excited waiting you to update this framework :D

  25. pikolo wrote:

    Hi, i have small question , i was wrote simple code for displaing google map in the theme-options.php. Can you tell me how get it in admin-functions.php and displaing it on the page ? great thanks


    $my_options[] = array( "name" => "Web maps",
    "desc" => "Sample internet maps.",
    "id" => "web_maps",
    "std" => "",
    "type" => "textarea");

  26. Sinisa wrote:

    Hi Devin, great work on options theme framework!
    Im trying to add child theme support for my theme, and I was wondering should put options.php and admin folder with other files in that new child theme?
    I see that I should, that will work, but I was wondering is there a way of keeping all options files only in main/parent theme?

    • Devin wrote:

      No. Only copy the options.php code into the child theme if you want to override what is in the parent theme.

  27. Anthony wrote:

    Howdy Devin, this might not be the right forum to ask this but, can one build on the original thematic code as foundation to building another theme/framework? I just dont like the idea of child theming. Been planning to use thematic on a client project……….your advice bro will be appreciated big time.

    • Devin wrote:

      The idea of a framework like this is that you child theme it- otherwise there’s no point to all the actions and filters it uses. If you want to use it to build a better framework to child theme off of, by all means go for it. Otherwise, you’re probably better off using a solid starter theme like _s: https://github.com/automattic/_s

  28. Bogh wrote:

    Hi Devin,

    I am using your old Thematic OP 2.2 to create my child themes, and is too late to upgrade to the latest version cause I have customized it too much. And I was wondering if it’s possible to make my shortcodes work with it, and if I can make it support PHP.
    My shortcodes are made after http://wordpress.org/extend/plugins/shortcode-ninja/ that is used by woothemes.

    Thanks a lot for this great job.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>