Book Image

Instant Premium Drupal Themes

By : Pankaj Sharma
Book Image

Instant Premium Drupal Themes

By: Pankaj Sharma

Overview of this book

Drupal’s theme layer, and the themes that use it, are responsible for the look and feel of a Drupal web site. Themes have the final say and ultimate control over almost every aspect of each page. Good themes consist of all the same elements that you would find on any reputable web site, including standards-compliant XHTML markup, CSS, and JavaScript. How it all comes together is what is so special and what makes Drupal themes so flexible and powerful. Premium Drupal Themes is a practical, hands-on guide filled with clear, step-by-step examples which shows you how to create Drupal themes using HTML. This book will show you the best practices and conventions that you should adopt and utilize so you can change the way Drupal looks using HTML without wasting energy digging through Drupal’s code. Starting with the essentials including Drupal terminology and Drupal theme structures, this book will show you how to configure raw HTML in a Drupal environment. You will learn about the Drupal template variables and also how to populate a Drupal theme with dynamic content. You will also discover how to customize the search result page and how to add regions to your home page. This book will help you familiarize yourself with the theme engines and will help you learn about the core of Drupal’s theme rendering system. Finally, you will learn how to create your very own Drupal theme that will take people’s breath away!
Table of Contents (7 chapters)

Understanding Drupal jargon


Before starting to create a Drupal theme, a user should be aware about Drupal and its terminologies. Knowing Drupal jargon will make the journey smooth. Drupal revolves around a 'node, which has a has special meaning in Drupal as it gives rise to other Drupal terminologies.

In this section the user will get to know the meaning of frequently used Drupal terms.

While designing a Drupal theme, we need to understand the following terms:

  • API (Application programming interface): API is a set of rules and specifications that needs to be followed by Drupal developers to interact with the Drupal core, such as the theme system, Form API, and Field API.

    • Drupal uses the theme system API for the themes that are located at includes/theme.inc.

  • Argument: An argument is part of the path of a Drupal website, or the path to a Drupal website can be considered to be made of 'arguments'. For example, in the /node/937 path, the first argument is node and the second is 937.

  • Article and Basic Page: Article (also known as Story in the earlier version of Drupal) and Basic page (Page) are the two default content types in Drupal.

    • Frequently changed content is assigned to the Article content type (for example, News), while static content is assigned to the Basic page content type.

    Click on Content. The following screen will appear. Now, click on the link highlighted in yellow:

    The following screen displays Article and Basic Page. These are the two important content types in Drupal. You can say they are nodes actually:

  • Base theme: Base themes can be termed as frameworks of the Drupal theme. Some of the popular base themes include Zen, Omega, and AdaptiveTheme. These themes can be reused to create new themes.

    You can see all the available themes in Drupal's themes folder highlighted in yellow in the following screenshot:

  • Region and blocks: A Drupal theme is divided into regions such as the header, footer, content, left sidebar, and right sidebar. Blocks are assigned to regions. So, blocks are a part of regions. Blocks are the areas visible in the regions.

    Examples of blocks are Search Form, User login, and Navigation. If you want to display a Search form in the footer, place the Search form block in the Footer region.

  • Entity: Entity is any defined chunk of data in Drupal. This includes data such as nodes, users, taxonomy terms, files, and so on. Contributed modules can define custom entities. Each entity type can have multiple bundles.

  • Clean URL: Drupal allows us to create a clean URL when the Path module is enabled (for example, http://www.example.com/node/83).

  • Contributed: This term is used for the themes and modules that are not a part of the Drupal core. They are installed separately to enhance the capability of Drupal.

  • Field: These are the elements of data that can be attached to a node or other Drupal entities. Fields commonly contain text, image, or terms.

  • Module: This is the bundle of code written according to Drupal conventions that extend Drupal features and functionality. There are two types of modules, Core and Contributed.

    You can view all the modules in the Admin panel as given in the following screenshot:

  • Menu: In Drupal, the term menu refers both to the clickable navigational elements on a page, and Drupal's internal system for handling requests. When a request is sent to Drupal, the menu system uses the provided URL to determine the functions to be called.

  • Node: Each content in Drupal is a node. Node belongs to the content type. Content type further belongs to taxonomy.

    For example, http://drupal.org/node/937 tells that a node is having an NID (node id) of 937.

  • Tag/term, Taxonomy, Vocabulary: Drupal is a powerful CMS as it revolves around content. Content classification is handled by the powerful Taxonomy module. A term is the basis of Drupal's content classification mechanism. A term is the metadata that is applied on a node. A collection of terms is called Vocabulary.

    You can see this part of Drupal in Admin by clicking on the Structure link as given in the following screenshot:

  • Theme engine: Theme engine is a set of PHP scripts that handles the Drupal theme system. phptemplate is the default theme engine, but there are 19 other theme engines, including Smarty, that can be configured.

    You can check the theme engine at the following path in Drupal code:

    /themes/engines.

  • Theme and templates: A theme is a combination of PHP, INFO, CSS, JPG, GIF, PNG, and HTML, and is responsible for the look and feel of the Drupal website. A theme is a combination of templates. A template is the presentation file where Drupal functions populate data with the help of the theme engine. In simple terms, it's an HTML file having Drupal functions.

    This is how a theme looks in Drupal:

  • Weight: Weight means priority in Drupal. A lower weight value (-10) will float at the top of lists, while heavier (+10) weights will appear at the bottom of lists.

Now let's talk about some other options, or some pieces of general information that are relevant to this task.

Drupal theme engines

The theme engine is the heart of Drupal's theme system. Theme engines handle the integration of PHP templates with the Drupal theme system.

By default, the phptemplate theme engine is available in Drupal, but the user has the freedom to use other theme engines as well. The phptemplate theme engine is faster than other theme engines as template files are written in pure PHP using this theme engine.

There are other main theme engines available, which are as follows:

  • Zengine: The Zengine theme engine is a CSS-oriented theme engine based entirely on phptemplate.

  • Awesomengine: It is similar to the phptemplate theme engine. The power of this theme engine lies in its ability to create dynamic CSS, as PHP code can be embedded in HTML templates and CSS files using this engine.

  • Smarty theme engine: This is based on the Smarty template engine. Smarty is a web template system written in PHP and the objective of Smarty is the separation of the frontend web pages from the backend.

The following is a section with more information relevant to this task, possibly discussing some more options.