Tag Archives: Drupal Theme

Drupal Fusion Theme – Customize Grid Definition

I always install Fusion theme as base theme in Drupal development. It supports a 960px fixed width and a 100% fluid theme. 960px theme is very common now but what should we do if we want to define our own fixed theme? Here is a very good tutorial i found @ fusiondrupalthemes.com Continue reading Drupal Fusion Theme – Customize Grid Definition

Drupal – Customized the User Registration Form

For the Drupal registration form, there is no .tpl.php template file for editing the registration form layout. So if you want to add more HTML code around the form, you have to do it on code level.

I found a useful post about modifying the registration form. It make use of the template.php in the theme folder to theme the form. For more information. Please visit Drupal – Custom registration page theme.

In this post, i will modify the registration form by creating a custom module. Continue reading Drupal – Customized the User Registration Form

Drupal – Create your own CSS style

Last time we have added a new font in the Drupal website using the @font-face module.
Drupal – Customize Fonts in Drupal

We can also apply this font-family in the .css file but first we have to add our own .css file and included it in the theme.

Go to your theme folder and create a new folder named as css if it doesn’t exist. Then create your .css file there. After that, go back to the theme folder and add the following line in the <theme>.info file. Continue reading Drupal – Create your own CSS style

Drupal – Add Javascript in Theme

As discussed before, we can add Javascript/JQuery in Drupal modules.
Drupal – Create Javascript for Module

So if the Javascript/JQuery is related to the layout and independent of the module, we should add it in the theme instead. For example, i want to have a alert box whenever a page is loaded, i should then add it to my current Drupal theme. The steps are listed below.

1. Open you current theme folder and add the following line in the theme.info.

  • scripts[] = js/theme.js

Continue reading Drupal – Add Javascript in Theme

Drupal – Customize Block Template File

In the Drupal template architecture, you can customized a specific block just by creating a .tpl.php file in the theme folder. For example, the block.tpl.php determine all the block layout in your Drupal theme.

We can also override the design layout of the block in our customized module which we created yesterday(Drupal – Create a Block). First we have to create the corresponding .tpl.php for our block. In this case, we need a block-[module-name].tpl.php.

So create the block-custom.tpl.php

<strong>Hello World</strong>
<!-- get the block details from the $block variable -->
<p>Subject:<?php print $block->subject ?></p>
<p>Content:<?php print $block->content ?></p>

Continue reading Drupal – Customize Block Template File

Drupal – Create a Garland Subtheme

I would like to edit some PHP and PHP template files but i dun want to modify those files in the default Garland theme. So i’d better create a Garland Subtheme which inherits those files from the Garland theme as well as i could create my own PHP and PHP template files under the subtheme folder for overriding the default.

Actually i am not very familiar with the theme architecture of Drupal, but the following example works as i expected. Continue reading Drupal – Create a Garland Subtheme