Previously i have a post about using Bootstrap 3 theme in Drupal 7.
If the website you are building needs IE 8 support, a few hacks has to been done. Please note that using CDN to serve the Bootstrap source files will not work in this case. So you have to use method 1 to serve the Bootstrap source files locally when installing the Bootstrap 3 theme in Drupal as stated here.
1. Copy the system/html.tpl.php from the Bootstrap 3 base theme to your subtheme templates folder.
Continue reading Drupal 7 – IE fix for Bootstrap 3 theme
Got a new responsive site freelance and i would like to try Bootstrap 3 theme in Drupal 7. A little bit confused at the very beginning because the theme has a lot of features and bug fixes ongoing. So the documentation is a bit lacking and i have to make some trials and errors before knowing what to do.
Some Drupal developers may also have problem on compiling LESS. So here i include a gulp script and some NodeJS packages to help.
Assume you have setup the Drupal 7.
1. Download the Bootstrap 3 Drupal theme. The current stable version is 7.x-3.0 which is a bit old and only works with Bootstrap 3.0.x. I am going to use 7.x-3.1 which supports the latest Bootstrap version (v3.3.2 at the moment i write this post). The 7.x-3.1 is still in beta (7.x-3.1-beta2). You could download it from the releases listing page.
2. Extract the Bootstrap 3 base theme to the sites/all/themes folder. You would found the starterkits folder containing the subthemes. as follow. Continue reading Drupal 7 – Setup Bootstrap 3 Theme with Gulp for LESS compilation
Say i have the following text field which i would like to show the tooltip on the right.
<input type="text" class="form-control" name="nickname" rel="txtTooltip" title="tooltip text" data-toggle="tooltip" data-placement="right"/>
The tooltip above has a limited width.
Continue reading Bootstrap 3 – Tooltip width
The generator-angular written by the Yeoman team comes with Bootstrap integration. But instead of using Bootstrap, i would like to use Foundation 5 with Sass. The following example is created under Node.js v0.10.29.
1. Create your project directory. In my case, i will name the project ng-foundation.
2. Move to the ng-foundation folder.
3. Scaffold the AngularJS project using the generator-angular as usual.
Continue reading Yeoman – Setup AngularJS and Foundation 5 with Sass
Update @ 2015-09-23: Using PowerShell is just my personal preference, You could use MS-DOS in Windows if your machine doesn’t have PowerShell installed.
1. Download Node.js and install it and make sure you have the npm package manager selected before the installation.
Continue reading Setup Yeoman in Windows PowerShell