Theme change only in CSS and a few images

Question

We created a theme that has a lot of changes in it. Now we want to enable that theme on our site in different colors, and a few images different:

What we're doing is duplicating the theme, and then making a few changes in the CSS, and change a few images. But it seems an overkill - to copy the all the theme files just to make so few changes. Moreover, if we ever have to change something functional in the theme, we'll have to go through all the duplications and apply it.

Is there a way to give users the option of changing colors & images, without duplicating the theme?

Answer 1

I would create a Theme Option for Color Scheme, then split out the color-scheme-specific CSS declarations into separate CSS files (e.g. blue.css, green.css, red.css, etc.).

Then, you simply enqueue the appropriate color-schme stylesheet, based on the Theme Option.

e.g.:

function mytheme_enqueue_color_scheme_stylesheet() {
    $theme_options = get_option( 'theme_mytheme_options' );
    $colorscheme = $theme_options['color_scheme'];
    $stylesheet = $colorscheme . '.css';
    $stylesheetsrc = get_template_directory_uri() . '/css/' . $stylesheet;
    wp_enqueue_style( 'colorscheme', $stylesheetsrc );
}
add_action( 'wp_enqueue_scripts', 'mytheme_enqueue_color_scheme_stylesheet' );

Answer 2

We ended up using child themes, mainly because the site manager wanted to get a preview of the color change that would occur when changing CSS, and that was done best by the theme switching page, but also because it was easier...