Drupal 7 Theming Cookbook

Over 95 recipes that cover all aspects of customizing and developing unique Drupal themes with this book and ebook

Drupal 7 Theming Cookbook

Cookbook
Karthik Kumar

Over 95 recipes that cover all aspects of customizing and developing unique Drupal themes with this book and ebook
$26.99
$44.99
RRP $26.99
RRP $44.99
eBook
Print + eBook
$12.99 p/month

Want this title & more? Subscribe to PacktLib

Enjoy full and instant access to over 2000 books and videos – you’ll find everything you need to stay ahead of the curve and make sure you can always get the job done.
+ Collection
Free sample

Book Details

ISBN 139781849516761
Paperback364 pages

About This Book

  • Spice up your Drupal themes
  • A complete update for Drupal 7, with added information for the Field API, Views, and Panels
  • Part of Packt’s Cookbook series with lots of practical recipes for solving the most common theming problems

Who This Book Is For

This book is for Drupal developers and administrators who want to refresh the look and feel of their site. We assume that readers are familiar with basic PHP, CSS, and XHTML as well as the general use of Drupal.

Table of Contents

Chapter 1: Drupal Theme Basics
Introduction
Installing and enabling a theme
Uploading a new logo
Uploading a new favicon
Adding a slogan to the theme
Displaying a different theme foradministration
Adding an existing block to the theme
Adding a custom block to the theme
Displaying a block only on the front page
Controlling block visibility based on user role
Controlling block visibility based on node type
Chapter 2: Beyond the Basics
Introduction
Understanding the anatomy of a theme
Creating a subtheme based on a core theme
Overriding base theme elements in a subtheme
Changing the screenshot image of a theme
Including a CSS file in a theme
Enabling CSS optimization
Creating the mysite module to hold our tweaks
Adding a CSS file from a module
Displaying a different theme for each day of the week
Creating a fresh look using the Color module
Chapter 3: Custom Themes and Zen
Introduction
Clearing the theme registry
Creating a theme from scratch
Creating myzen a Zen-based theme
Choosing a CSS layout for myzen
Overriding Zen template files with myzen
Adding a custom region to myzen
Adding a background image to the theme
Adding a conditional stylesheet in Zen
Modifying myzen's theme settings
Chapter 4: Templating Basics
Introduction
Changing the structure of a page using template files
Customizing the appearance of a particular node type
Customizing the appearance of a specific node
Theming made easy using the Devel module
Theme overrides using the Theme developer module
Styling the site maintenance page
Chapter 5: Development and Debugging Tools
Introduction
Finding the right function to use to theme an object
Analyzing variables using the Devel module
Generating sample content using the Devel generate module
Resetting the default theme manually
Live preview with Web Developer
Validating HTML and CSS using Web Developer
Turning off JavaScript in the browser
Disabling CSS in the browser
Inspecting elements and debugging CSS using Firebug
Diagnostic logging of JavaScript using Firebug
Chapter 6: Advanced Templating
Introduction
Adding a variable to all node templates
Deleting a variable from the page template
Adding a custom theme setting
Hiding all regions on a page
Displaying the last updated date instead of the submitted date
Module-based variable manipulation
Optimizing using hook_preprocess()
Displaying the date field in calendar form
Chapter 7: JavaScript in Themes
Introduction
Including JavaScript files from a theme
Including a JavaScript file only for certain pages
Giving the username textfield keyboard focus
Exporting a variable from PHP to JavaScript
Adding default text to the search textfield
Displaying comments in compact form
Minimizing and maximizing blocks using JavaScript
Chapter 8: Navigation
Introduction
Adding a menu to our theme
Adding content pages to the menu
Styling the Main menu
Contextual submenus using the Menu module
Adding a drop-down navigation menu
Customizing breadcrumbs in Zen-based themes
Hiding node links using CSS
Styling all external links in a page
Styling the Drupal pager
Chapter 9: Form Design
Introduction
Finding the form ID of a form
Changing the height of a textarea
Replacing Drupal's textareas with aWYSIWYG HTML editor
Reorganizing fields in a form
Replacing a standard submit button with an image button
Styling the comment form
Using a fieldset to group fields
Theming form elements from a module
Adding class attributes to form elements
Chapter 10: Theming Fields
Introduction
Creating a new node type
Displaying fields together using fieldgroups
Manipulating display layouts using fieldgroups
Theming a field using a template file
Adding image fields using the Image module
Using Image styles to scale and crop images on the fly
Adding lightbox support for images
Chapter 11: Views Theming
Introduction
Creating a simple View
Styling a node listing using a Grid display
Embedding a View inside a node template
Overriding the Views table style format
Creating a custom Views style plugin
Chapter 12: Rapid Layouts with Panels
Introduction
Using Panels to create a front-page layout
Embedding content in a panel
Styling a panel with rounded corners
Creating custom styles with the Stylizer module
Changing the layout of a panel
Creating a custom panel layout
Replacing the site contact page with a panel

What You Will Learn

  • Improve your knowledge of the basics of Drupal theming such as installing and enabling a downloaded theme, changing the logo, and adding a slogan
  • Customize the look of your website by configuring and extending your existing themes with sub-themes
  • Create custom themes from scratch for websites that demand a fresh look
  • Use the PHP Template theming engine to override module output and style it using a theme
  • Style and manipulate the content of your website by adding CSS and JavaScript files via themes and modules
  • Manipulate images on the fly using the Image API and the Image module
  • Jazz up the design of your site by incorporating JavaScript elements
  • Design complex site layouts rapidly with Panels

 

In Detail

The greatest strength of Drupal lies in its design which, when employed correctly, allows developers to literally handcraft every aspect of a site, so that it looks and performs exactly how they want it to. While it is reasonably straightforward to download a Drupal theme and install it, doing anything beyond that is not. Using custom themes requires familiarity and experience with Drupal's theming system, especially if you want to easily administer and maintain your themes.

Drupal 7 Theming Cookbook provides a plethora of recipes that enable Drupal template designers to make full use of its extensibility and style their site just the way they want it. It is a well-rounded guide which will allow users to take full advantage of Drupal's theming system.

This cookbook starts with recipes which address the basics of Drupal's theme system, including regions and blocks. It then moves on to advanced topics such as creating a custom theme and using it to modify the layout and style of content. With the introduction of the Field API and the growing importance of Views and Panels in Drupal 7, chapters have been dedicated to each feature. You will also learn many techniques for dealing with Drupal’s templating system, which will allow you create themes which surpass even the existing Drupal and contributed modules.

Authors

Table of Contents

Chapter 1: Drupal Theme Basics
Introduction
Installing and enabling a theme
Uploading a new logo
Uploading a new favicon
Adding a slogan to the theme
Displaying a different theme foradministration
Adding an existing block to the theme
Adding a custom block to the theme
Displaying a block only on the front page
Controlling block visibility based on user role
Controlling block visibility based on node type
Chapter 2: Beyond the Basics
Introduction
Understanding the anatomy of a theme
Creating a subtheme based on a core theme
Overriding base theme elements in a subtheme
Changing the screenshot image of a theme
Including a CSS file in a theme
Enabling CSS optimization
Creating the mysite module to hold our tweaks
Adding a CSS file from a module
Displaying a different theme for each day of the week
Creating a fresh look using the Color module
Chapter 3: Custom Themes and Zen
Introduction
Clearing the theme registry
Creating a theme from scratch
Creating myzen a Zen-based theme
Choosing a CSS layout for myzen
Overriding Zen template files with myzen
Adding a custom region to myzen
Adding a background image to the theme
Adding a conditional stylesheet in Zen
Modifying myzen's theme settings
Chapter 4: Templating Basics
Introduction
Changing the structure of a page using template files
Customizing the appearance of a particular node type
Customizing the appearance of a specific node
Theming made easy using the Devel module
Theme overrides using the Theme developer module
Styling the site maintenance page
Chapter 5: Development and Debugging Tools
Introduction
Finding the right function to use to theme an object
Analyzing variables using the Devel module
Generating sample content using the Devel generate module
Resetting the default theme manually
Live preview with Web Developer
Validating HTML and CSS using Web Developer
Turning off JavaScript in the browser
Disabling CSS in the browser
Inspecting elements and debugging CSS using Firebug
Diagnostic logging of JavaScript using Firebug
Chapter 6: Advanced Templating
Introduction
Adding a variable to all node templates
Deleting a variable from the page template
Adding a custom theme setting
Hiding all regions on a page
Displaying the last updated date instead of the submitted date
Module-based variable manipulation
Optimizing using hook_preprocess()
Displaying the date field in calendar form
Chapter 7: JavaScript in Themes
Introduction
Including JavaScript files from a theme
Including a JavaScript file only for certain pages
Giving the username textfield keyboard focus
Exporting a variable from PHP to JavaScript
Adding default text to the search textfield
Displaying comments in compact form
Minimizing and maximizing blocks using JavaScript
Chapter 8: Navigation
Introduction
Adding a menu to our theme
Adding content pages to the menu
Styling the Main menu
Contextual submenus using the Menu module
Adding a drop-down navigation menu
Customizing breadcrumbs in Zen-based themes
Hiding node links using CSS
Styling all external links in a page
Styling the Drupal pager
Chapter 9: Form Design
Introduction
Finding the form ID of a form
Changing the height of a textarea
Replacing Drupal's textareas with aWYSIWYG HTML editor
Reorganizing fields in a form
Replacing a standard submit button with an image button
Styling the comment form
Using a fieldset to group fields
Theming form elements from a module
Adding class attributes to form elements
Chapter 10: Theming Fields
Introduction
Creating a new node type
Displaying fields together using fieldgroups
Manipulating display layouts using fieldgroups
Theming a field using a template file
Adding image fields using the Image module
Using Image styles to scale and crop images on the fly
Adding lightbox support for images
Chapter 11: Views Theming
Introduction
Creating a simple View
Styling a node listing using a Grid display
Embedding a View inside a node template
Overriding the Views table style format
Creating a custom Views style plugin
Chapter 12: Rapid Layouts with Panels
Introduction
Using Panels to create a front-page layout
Embedding content in a panel
Styling a panel with rounded corners
Creating custom styles with the Stylizer module
Changing the layout of a panel
Creating a custom panel layout
Replacing the site contact page with a panel

Book Details

ISBN 139781849516761
Paperback364 pages
Read More