Tag Archives: Drupal Theme

Drupal 7 – Setup Bootstrap 3 Theme with Gulp for LESS compilation

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


Drupal 7 – Create Zen subtheme using Drush command

1. Download the Zen theme

  • drush dl zen


2. Clear all cache.

  • drush cc all


3. Create the subtheme from the Zen starterkit.

  • drush zen “<subtheme name>”


Done =)

Reference: The drush zen command won’t work until cache is flushed

Drupal 7 – Create your own theme function on your custom block

More than a year ago, we have talked about some basic theming in Drupal 6.

In Drupal 7, there are some changes on the theming functions as well as the block hooks. So here is a slightly modified versions from the example of Drupal – Introduction to Drupal Theming @ 3. The logic behind is exactly the same.

Continue reading Drupal 7 – Create your own theme function on your custom block

Drupal 7 – Override the .tpl.php in Advacned Forum

Advanced Forum has some default themes which are located @ sites/all/modules/advanced_forum/styles/<theme>.

Naked/Naked Stacked themes could be used for customization. So copy the .tpl.php which you want to customize in the sites/all/modules/advanced_forum/styles/naked folder to your theme folder.

For example, i want to customize the advanced-forum.naked.author-pane.tpl.php.
Continue reading Drupal 7 – Override the .tpl.php in Advacned Forum

Drupal 7 – Customized comment.tpl.php for specific content type

The comment.tpl.php is located @<drupal-root>/modules/comment/comment.tpl.php. If you want to customize it for different content type. Copy it to your theme folder and rename it to

  • comment–node-<content-type>.tpl.php

For example, the machine name of Article is article. So the file name should be comment–node-article.tpl.php.

Done =)


Drupal 7 – Strengthen the core Forum module by Advanced Forum

I am now working a new website project which includes a forum. With the Forum module bundled in the Drupal core. It is easy to build a forum based Drupal site. In the coming days, i would like to share suggestions when working on forum site.

First of all, you could equip your Drupal website with the basic forum features by enabling the core Forum module. However, that may be not enough for meeting the client’s requirements or it is difficult to customize it. That’s why we need the Advanced Forum module.
Continue reading Drupal 7 – Strengthen the core Forum module by Advanced Forum

Drupal 7 – Apply sticky footer in Omega theme

We can make the section-footer sticky in Omega theme by adding the following piece of code in <your-theme>-alpha-default.css.

/* sticky footer */
html, body {height: 100%; margin: 0;}
#page {display: table; width: 100%;}
html>/**/body #page {height: 100%;}
*:first-child+html #page {height: auto;}
.section {display: table-row;}
html>/**/body .section-content {height: 100%;}
*:first-child+html body .section-content {height: auto;}


Kudos to Karl Kasischke.

Done =)

Reference: Has anyone tried to get a sticky footer to work with Omega?