Theme folder structure of drupal 7



The Theme Folder Structure


The first thing that you should be aware of is the folder structure in Drupal 7. The core themes that come shipped with the Drupal installation are placed in the themes directory of root folder. It is advisable to place all the extra themes in sites/all/themes directory. Meanwhile it is a good practice to place all the downloaded themes called themes in a separate folder called along with the custom themes in a folder called custom.

This is what a typical folder structure will look like :

..
..
sites
..all
….themes
…...contrib
……..bluemarine
……..omega
…...custom
……..blue
……..blue_admin

A basic pictorial representation of the Bartik theme.


Overview of Theme Files

The files associated with creating a theme are a mix of “one” text file (that is the .info file), PHP script, Javascript and Cascading Style Sheet file i.e CSS file.

Of all these files, the one you require is the .info file which tells Drupal about your theme. Though a CSS file is also necessary without which theme will look like a bunch of black text and images thrown in a webpage. All the other files are to make the theme more gripping and to customize the UI according to the palette. Below is the list of files that a theme can contain:

  1. .info — A required file which provides information about the theme.
  2. html.tpl.php—It displays the basic html structure of a single Drupal page.
  3. page.tpl.php — The main template that defines the content on most of the pages.
  4. style.css — The CSS file that sets the CSS rules for the template.
  5. node.tpl.php — This file defines the content of the nodes.
  6. block.tpl.php — It defines the content in the blocks.
  7. comment.tpl.php — It defines the content in the comments.
  8. template.php—It can be used to hold preprocessors for generating variables before they are merged with the markup inside .tpl.php files.
  9. theme-settings.php—You can modify the entire theme settings form.
  10. logo.png — Your logo, if you are using one.
  11. screenshot.png — This is a screenshot of your theme that is used in the admin panel and in the user account settings if you have enabled more than one theme so that visitors can choose which theme they want to use.

.info file

name = Theme Name
description = A Custom Drupal 7 Theme
core = 7.x
regions[header] = Header
regions[banner] = Banner
regions[content] = Content
regions[sidebar] = Sidebar
regions[footer] = Footer



Related Post


Latest Post


Recent Posts Widget

Make sure to never miss a thing...

Get the latest news from the creative industry along with other creative goodies, conveniently delivered to social media.