How do I modify the theme of my Kickstart 2 site?

I have installed Commerce Kickstart 2 and am happy with the default theme however I need to make changes to colouring etc. of the theme. I roughly know how to sub theme a site, but I'm struggling to sub theme my kickstart site because I'm not sure which theme I need to sub theme. I've looked in profile/themes and I have commerce_kickstart_admin, commerce_kickstart_theme, omega, omega_kickstart and shiny. which of these directories should I copy across to sites/all/themes as my subtheme ?

Thank you

Posted: Sep 23, 2013


mjcarter on September 23, 2013

The reason the styles from the Kickstart don't work is likely that the CSS selectors don't work anymore in your theme due to a different structure or different naming.

The easiest way to fix this would be to use a browser debugging bar to see where the selectors need adjusting. E.g. a style you copied might be #content .widget p, but for your theme it needs to be changed to #main-content .widget p.

melissa on September 30, 2013

Thank you for responding. I gave up trying to do it the beginner's way and moved to ubuntu and installed through drush with no issues. I can't believe all the hours I wasted trying to figure this out when it was so easy using drush! I have learned a lot, though and can't wait to learn more!!!

Carl Bowles on September 24, 2013

For anyone looking at this in the future, I subthemed the default Kickstart theme Omega Kickstart which is in profiles/commerce_kickstart/themes/ and put a sub theme of this into sites/all/themes. I then made changes to this subtheme, rather than using a drupal theme that isn't designed for commerce sites.

melissa on September 25, 2013

I am struggling with the same thing. I have tried using omega tools and I get a sub-theme setup but it looks nothing like the commerce kickstart theme! I tried using the omega html5 starter-kit, then I tried using omega kickstart and finally commerce kickstart which are the options in omega tools. What am I doing wrong? All I want to do is recolor the theme and maybe add some custom css. I have also tried enabling the color module, but still can't figure that one out either. Also can someone tell me where drupal stores text that i input say for example on the about node? I had a crash and had to create a new database and I just want my about file so I don't have to rewrite the whole thing. Sorry I'm also new to all of this.

Carl Bowles on September 30, 2013

Hello, I struggled with this a lot as well, but now I have managed to sub theme the default kickstart theme to make my colour changes so will write down what I did:

1. go to profiles/commerce kickstart/themes and copy the entire omega_kickstart folder

2. paste this folder into sites/all/themes

3. rename this new folder to myomega

4. rename any files and folders in the myomega folder - any file names that contain omega_kickstart or omega-kickstart, replace this with myomega

5. open ALL files in the myomega folder - use the find and replace tool and replace any omega_kickstart and omega-kickstart with myomega

6. open the .info file - change the name to My Omega and the description to A custom sub theme of the Omega Kickstart theme

7. enable your new My Omega theme - once you have enabled this new theme, go into the theme settings at admin/appearance/settings/myomega scroll to the bottom and save the theme settings.

Your new sub theme should look exactly like the theme that came installed with Kickstart 2. You can then make your changes to the global.css file in your new sub theme called My Omega.

Hope this helps, it's what I did - let me know if you need any more help

rionka on May 11, 2014

carlbowles100: Thank you! Pretty useful way how to make my own theme.

Just a note: This process will cause that your new theme will look just like the Omega Kickstart "default" gray theme - not the "Commerce Kickstart" blue-ish one which was discussed at start of this thread. You can't edit the current theme but you can make a duplicate of Omega Kickstart and edit this copy as Carl wrote above.

Carl Bowles on September 30, 2013

Sorry forgot to mention - all of the text is stored in the database in a table called field_data_body. If you have a look in this table you should see all of the content you have added under a field called body_value.