Building a Drupal site from scratch - part 8 - Theming subtheme CSS

| Drupal Development | 0 seen

<p>In part 2 of series how to build a Drupal site from scratch, I'm talking about how to create a subtheme from Bootstrap theme.</p><p>Today I would like to speak how to actually theme it, because just enabled it comes empty,with all files served from Bootstrap mater theme.</p><p>By default Bootstrap theme is set to be 1200px and wider, this is first thing I would like to change for our customers tourism website we are using in thee Drupal series. I don't mind for ite being 1200px and more wider, just I like to them be 940-980px, to work well on most display's.</p><p>&nbsp;</p><p>In your mytheme/css folder look for style.css file. It's empty, and now let's start overriding it:</p><p>add:</p><blockquote><pre>.container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container {<br>width: 940px;<br>}</pre></blockquote><pre>&nbsp;</pre><pre>This will make themes default witdth to 940px.</pre><pre>&nbsp;</pre><pre>Actually this is it. Of course you must rewrite each h1, h2, h3 .e.t.c tag.</pre><pre>To do this, just apply your CSS on your subtheme style.css file.</pre><pre>&nbsp;</pre><pre>Bootstrap is responsive theme, so before making any huge edits and overrides, plan how to minimaze your CSS, to use % instead of pixels.</pre><pre>For any custom edits on your views I highly recommend to use seperate css file, like custom.css (Read more <a href="http://reinisfischer.com/building-drupal-site-scratch-part-7-theming-vi… to theme views</a>)</pre>