Can't use Sub-Theme [#2338275]

Hi,
I've downloaded and installed the latest dev of the Bootstrap module. After this, I wanted to create a sub theme for my personal CSS changes.
Here are my steps:

copy the "starterkits\cdn" folder as new sub-theme (the documentation is out-of-date because there isn't any "subtheme" folder anymore)
rename the new folder to the new name of the sub-theme (e.g. "mytheme")
rename the file "cdn.starterkit" within the sub-theme to my name (e.g. "mytheme.info")
change the sub-theme configuration ("mytheme.info") to the new name (e.g. "name = MyTheme")
activate my sub-theme

This doesn't work - the output is without any style.

After this, I've downloaded the original Bootstrap to the folder "bootstrat" within my sub-theme and added the follwowing lines to the "mytheme.info" file:

scripts[] = 'bootstrap/js/affix.js'
scripts[] = 'bootstrap/js/alert.js'
scripts[] = 'bootstrap/js/button.js'
scripts[] = 'bootstrap/js/carousel.js'
scripts[] = 'bootstrap/js/collapse.js'
scripts[] = 'bootstrap/js/dropdown.js'
scripts[] = 'bootstrap/js/modal.js'
scripts[] = 'bootstrap/js/tooltip.js'
scripts[] = 'bootstrap/js/popover.js'
scripts[] = 'bootstrap/js/scrollspy.js'
scripts[] = 'bootstrap/js/tab.js'
scripts[] = 'bootstrap/js/transition.js'
settings[bootstrap_cdn] = ''

The result was always the same: the output is without any style.

If I look into the source of the web page, there isn't any link to the Bootstrap CSS. Only the "style.css" of the sub-theme is listed.

Any idea how to use a Bootstrap sub-theme with the current Drupal Bootstrap module?

Regards,
Oliver

Comments

Comment #1

Homotechsual CreditAttribution: Homotechsual commented 21 September 2014 at 12:39

Basically - READ THE MANUAL!

You haven't compiled the LESS files in the sub theme into a Style.css file - so you don't HAVE a CSS file for the .info file to import.

From the manual: (emphasis mine)

Method 1: Bootstrap Source Files
Download and extract the Latest Bootstrap source into your new sub-theme. After it has been extracted, the folder should read bootstrap. If for whatever reason you have an additional bootstrap folder wrapping the the bootstrap folder (like: bootstrap/bootstrap), remove the wrapping bootstrap folder. You will not need to touch these files again. This allows the framework to be updated in the future.

Compile the ./less/style.less file. A new file should be generated as ./css/style.css.

Now, you will need to uncomment the lines under 'METHOD 1: Bootstrap Source' in your sub-theme's .info file (pertaining to this method).

Done.

You're also using the wrong starterkit, the starterkits are used as follows:

starterkits/CDN = Use if planning to use Bootstrap source from BootstrapCDN
starterkits/LESS = Use if planning to use Bootstrap source locally using the LESS css preprocessor
starterkits/SASS = Use if planning to use Bootstrap source locally using the SASS css preprocessor

My advice: Restart your sub theme from the starterkits/LESS folder, get/install a LESS preprocessor on your system - on OSX CodeKit is a brilliant piece of software which watches your project folder for changes and automagically recompiles your LESS file(s) into CSS. Finally - carefully re-read the subtheming documentation.