0

I have been working on a theme, initially it only had one design and I made almost all of the front page elements customizable through the theme customizer. Now I would like to offer a few variations of my theme and I am not sure what I should do. The way I setup my theme is that is that when my theme is installed it looks like the demo, since I made the default values of the theme settings match the design. So the defaults are all setup for the one style.

Now since I want to offer a few variations of my theme it makes sense to use child themes that the users can switch to. Although I have no idea how that would work, since most of the elements get there values from the theme settings and not the CSS file so they can be easily customized. Would I not be able to use child themes?

Would it make more sense for me to add a setting for which style is chosen and have my customizer choose different default values depending on that setting? (Have three sets of defaults values in a function, and use logic to choose which defaults are used depending on theme chosen?)

I want to be able to have a demo bar to show the theme variations. So would it be possible to have a child theme that overrides the customizer aswell? So I could switch to a child theme easily in the demo bar?

Any advice would be appreciated.

Improve this question
2
  • "Many good questions generate some degree of opinion based on expert experience, but answers to this question will tend to be almost entirely based on opinions, rather than facts, references, or specific expertise."
    – Chip Bennett
    Nov 24, 2013 at 15:31
  • I ended up creating a json theme settings exporter and importer. I created three theme variations using my own customizer and exported each one after it was done. So the theme will include a blank canvas, with the option of importing the exported demo styles. I am going to post it after I fix a few elements that weren't importing properly.
    – user1632018
    Nov 24, 2013 at 17:12

1 Answer 1

Reset to default
1

I would comment if able. If your theme variations consist solely of style modifications you can add the variation stylesheets @ inc/css/ and then here is an example of the references to make it all tick.

@ \options\options-core.php:

$fields_list[]  = array(
    'name'      => __('Select a Skin Color', 'mytheme'),
    'id'        => 'mytheme_skin_color',
    'std'       => 'default',
    'type'      => 'images',
    'options'   => apply_filters( 'mytheme_skin_color', array(
        'default'   => $directory_uri . '/inc/css/skins/images/default.png'
    ) )

@ \options\options-customizer.php:

/********** Class for skin color selection option starts *************/

class mytheme_skin_selector extends WP_Customize_Control {
    public $type = 'radio';
        
            images-skin-subcontainer {
                display: inline;
            }
            .images-skin-subcontainer img {
                margin-top: 5px;
            }
            .images-skin-subcontainer img.of-radio-img-selected {
                border: 5px solid #5DA7F2;
            }
            .images-skin-subcontainer img:hover {
                cursor: pointer;

                //if get mytheme mod background image has a value then we need to set default bg to none
                $test_skin = $this->value();
                $name = '_customize-radio-' . $this->id;
                $selected = ( $test_skin == $value ) ? 'of-radio-img-selected' : '';
                ?>
                
                                         
                        " name="" link(); checked( $test_skin, $value  style="display:none;" />
                        " class="of-radio-img-img " /
            }
 /********** Class for skin color selection option ends *************/

 // mytheme skin 
$wp_customize->add_setting( 'mytheme_options[mytheme_skin_color]', array(
    'default'        => 'default',
    $wp_customize   -> add_control( new mytheme_skin_selector( $wp_customize, 'skin_color', array(
        'label'     =>  __( 'Skin Color', 'mytheme' ),
        'section'   => 'mytheme_design_section',
        'settings'  => 'mytheme_options[mytheme_skin_color]',
        'choices'   => apply_filters( 'mytheme_skin_color', '' ),
    ) ) );

Hope this helps either way.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.