Drupal Technical

[Drupal] How to create Custom Theme in Drupal 7

Premshankar.pb | | 2 min read

Creating a custom theme in drupal is nearly a simple thing if you are good at css styling. Let us take a walk through the structure of theme implementation in drupal.

Structure of a theme

A Drupal theme is just a few PHP files, a CSS file, and an info file. You can have a check in to the theme named 'bartik' which is the default theme of the drupal(your project folder/themes/bartik).

So the main contents of a drupal theme are:

  • An .info file
  • Screenshot.png and logo.png
  • Template.php file
  • Template tpl files
  • Css files

An .info file

An .info file to tell Drupal about your theme. Create a folder (projectfolder/sites/themes/), and info file, yourthemename.info file. The .info file is a static text file for defining and configure a theme.
An info file have, 


  name = theme name
  description = description of theme.
  version = VERSION
  core = 7.x
  engine = phptemplate // not required in drupal 7
  stylesheets[all][] = style.css//includes the css files
  stylesheets[print][] = print.css

  //set the name for the regions (below is the drupal 7 default regions)
  regions[header] = Header
  regions[highlighted] = Highlighted
  regions[help] = Help
  regions[content] = Content
  regions[sidebar_first] = Left sidebar
  regions[sidebar_second] = Right sidebar
  regions[footer] = Footer

You can check for more features in .info file from here.

Screenshot.png and Logo.png

Make a screenshot from the design file (294px wide). Put it in your theme folder. Name the file ad screenshot.png. Make a logo image, (logo.png) and drop it in there as well. By default screeshot.png will be called for screenshot for the theme listing page and log.png is taken in the project`s header as its basic logo.

Template.php file

If you want to override a theme function not included in the basic list (block, box, comment, node, page), you need to tell PHP template about it. To let it know, create template.php file in the custom theme's directory(sites/all/themes/custom themefolder/). Start with a PHP opening tag Please refer this.

Core template tpl files

Core comes with a number of default template files. To override these templates, you need to copy them into your theme folder (from the drupal community site)and clear the theme registry. Here you can also override these templates in a more targeted way. Refer here for the various core templates available in drupal 7 and its functionalities

Css files

The css files are for styling the div and items in the core templates. Include the new css files in the .info file.
See here , how the pages are custom styled.

Your custom theme is ready !!. You can enable and make it default from the themes option in your project page.

 

 

?>

Related Topics