31,19 €
Mehr erfahren.
- Herausgeber: Packt Publishing
- Kategorie: Wissenschaft und neue Technologien
- Sprache: Englisch
Drupal is an award winning open source Content Management System. Based on PHP/MySQL, its power and flexibility combined with its exceptional design mean it is already on the way to becoming the de facto standard for CMS Websites. Drupal?¢‚Ǩ‚Ñ¢s modular design and structured source code make it both highly flexible and easily extended and modified. Drupal is extremely scalable, making it ideal for both a simple personal website as well as an industrial strength commercial or institutional web presence.Drupal is a model open source project in that it has a large, friendly community of people who contribute to the project in various ways. Drupal is not only free and easy to use, but this community provides on going mutual support.
Das E-Book können Sie in Legimi-Apps oder einer beliebigen App lesen, die das folgende Format unterstützen:
Seitenzahl: 266
Veröffentlichungsjahr: 2007
Ähnliche
Table of Contents
Drupal 5 Themes
Ric Shreves
Drupal 5 Themes
Copyright © 2007 Packt Publishing
All rights reserved. No part of this book may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written permission of the publisher, except in the case of brief quotations embedded in critical articles or reviews.
Every effort has been made in the preparation of this book to ensure the accuracy of the information presented. However, the information contained in this book is sold without warranty, either express or implied. Neither the author, Packt Publishing, nor its dealers or distributors will be held liable for any damages caused or alleged to be caused directly or indirectly by this book.
Packt Publishing has endeavored to provide trademark information about all the companies and products mentioned in this book by the appropriate use of capitals. However, Packt Publishing cannot guarantee the accuracy of this information.
First published: December 2007
Production Reference: 1171207
Published by Packt Publishing Ltd.
32 Lincoln Road
Olton
Birmingham, B27 6PA, UK.
ISBN 978-1-847191-82-3
www.packtpub.com
Cover Image by Vinayak Chittar(<[email protected]>)
Credits
Author
Ric Shreves
Reviewer
Dave Myburgh
Senior Acquisition Editor
Douglas Paterson
Development Editor
Rashmi Phadnis
Technical Editor
Ajay S.
Editorial Team Leader
Mithil Kulkarni
Project Manager
Patricia Weir
Indexer
Hemangini Bari
Proofreaders
Harminder Singh
Chris Smith
Production Coordinator
Aparna Bhagat
Shantanu Zagade
Cover Designer
Aparna Bhagat
About the Author
Ric Shreves is a partner in water & stone (www.waterandstone.com), a web development company that specializes in open-source content management systems. He works primarily as a consultant and business systems analyst and is currently on extended assignment with Peace Dividend Trust. He lives in Bali with his wife Nalisa, one dog, two cats, three turtles, and a mind-boggling number of fish.
First and foremost, I thank my loving wife Nalisa for her support and patience. It would also be remiss of me to fail to acknowledge my friend (and editor at ComputerWorld) Stefan Hammond, who provides more than a modicum of support and encouragement—together with much-needed reality checks.
About the Reviewer
Dave Myburgh started out in computers when entire operating systems ran on a single floppy disk and 640kb of RAM was a lot! He studied to become a molecular biologist, but never lost his passion for computers. Later, he ran a successful computer company for a couple of years in South Africa, before moving to Canada with his wife. He went back to science on his arrival in Canada, and since discovering Drupal almost two years ago, he has once again started his own company, MybesInformatik. He loves working with Drupal, and is quite handy at theming, as well as hacking modules to make them do what he wants (sometimes, patches even get submitted back to the community). Now, he divides his time—unevenly—between family and Drupal.
I would like to thank Dries and the Drupal community for making Drupal what it is today. Without you guys and gals, I'd probably still be "doing static"—I can't wait for Drupal 6! I'd also like to thank my wife for putting up with my frequent late nights in front of the computer. I tell her it's work, but in reality, it's a lot of fun—just don't tell her I told you that.
Preface
This book sets out to explain the workings of the Drupal theme framework, and how you can use it effectively. The goal of this book is to explain basic principles, demonstrate practical solutions to common problems, and create a reference for theming.
The book begins with an overview of the theme system and an explanation of what is included in the default Drupal distro. We next look at how you can squeeze the most out of the default system. The middle chapters discuss PHPTemplate and introduce using themeable functions and manipulating the Drupal style sheets. To illustrate the principles, we take a common theme and modify it. In the final chapters, we delve into creating themes from scratch and more advanced issues, like forms.
For purposes of this text, we focus on the theme engine included in the default distro—PHPTemplate. Similarly, we only touch on creating themes in pure PHP, without the use of a theme engine.
This book is all about controlling the presentation layer of your Drupal site; accordingly, we do not cover creating new modules, or writing custom functionality.
The author of this text comes from a design background and has only basic programming skills. The explanations given, and the rational for many of the choices, reflect the author's background. In that light, this book may not always satisfy hardcore programmers who expect the technical issues to be explained in detail. It should, however, make the life of many designers a little easier and hopefully, with the reference materials we've included, find a lasting home on the shelves of many Drupal developers.
What This Book Covers
Chapter 1 covers the elements of a Drupal theme. It also takes a look at the contents of the Drupal distro and examines the different approaches of the default themes.
Chapter 2 explains how to set up and configure a theme in Drupal. By way of example, we take a default theme and customize it using only the options provided by the system.
Chapter 3 discusses the use of theme engines in general and the PHPTemplate engine in particular. This chapter also lays the groundwork for techniques to modify themes through the system's CSS and themeable functions.
Chapter 4 takes an in-depth look at the system's default style sheets and the various themeable functions.
Chapter 5 explains the process behind intercepting and overriding the Drupal style sheets and themeable functions. This is a key concept for obtaining full control over the presentation layer—without the necessity of modifying the core files.
Chapter 6 provides a hands-on example of the techniques covered in the previous chapters by taking a default theme and then modifying it extensively.
Chapter 7 covers creating a theme from scratch with the PHPTemplate theme engine and also looks at the basics of implementing a theme without a theme engine.
Chapter 8 discusses modifying the look and feel of the many different forms in the Drupal system.
Appendix A is a listing of all the selectors in the various style sheets.
What You Need for This Book
Throughout this book, we will assume that you have the following package installed and available:
Who is This Book for
The main requirements of this book are knowledge of HTML, CSS, and a touch of creativity! Though this book aims to make Drupal theming accessible to designers, theming in Drupal 5 involves writing some PHP code, and a basic knowledge of PHP will be helpful.
Conventions
In this book, you will find a number of styles of text that distinguish between different kinds of information. Here are some examples of these styles, and an explanation of their meaning.
There are three styles for code. Code words in text are shown as follows: "We can include other contexts through the use of the include directive."
A block of code will be set as follows:
When we wish to draw your attention to a particular part of a code block, the relevant lines or items will be made bold:
New terms and important words are introduced in a bold-type font. Words that you see on the screen, in menus or dialog boxes for example, appear in our text like this: "clicking the Next button moves you to the next screen".
Note
Important notes appear in a box like this.
Tip
Tips and tricks appear like this.
Reader Feedback
Feedback from our readers is always welcome. Let us know what you think about this book, what you liked or may have disliked. Reader feedback is important for us to develop titles that you really get the most out of.
To send us general feedback, simply drop an email to <[email protected]>, making sure to mention the book title in the subject of your message.
If there is a book that you need and would like to see us publish, please send us a note in the SUGGEST A TITLE form on www.packtpub.com or email <[email protected]>.
If there is a topic that you have expertise in and you are interested in either writing or contributing to a book, see our author guide on www.packtpub.com/authors.
Customer Support
Now that you are the proud owner of a Packt book, we have a number of things to help you to get the most from your purchase.
Downloading the Example Code for the Book
Visit http://www.packtpub.com/support, and select this book from the list of titles to download any example code or extra resources for this book. The files available for download will then be displayed.
Note
The downloadable files contain instructions on how to use them.
Errata
Although we have taken every care to ensure the accuracy of our contents, mistakes do happen. If you find a mistake in one of our books—maybe a mistake in text or code—we would be grateful if you would report this to us. By doing this you can save other readers from frustration, and help to improve subsequent versions of this book. If you find any errata, report them by visiting http://www.packtpub.com/support, selecting your book, clicking on the Submit Errata link, and entering the details of your errata. Once your errata are verified, your submission will be accepted and the errata added to the list of existing errata. The existing errata can be viewed by selecting your title from http://www.packtpub.com/support.
Questions
You can contact us at <[email protected]> if you are having a problem with some aspect of the book, and we will do our best to address it.
Chapter 1. The Elements of a Drupal Theme
In this chapter, we will introduce themes and their role in the Drupal system. The chapter also covers the various types of themes, the basic elements of a theme, and the functions those elements fulfil. Near the end of the chapter, we will also look at the themes contained in the distro and examine exactly what it is that makes each theme distinct.
The contents of this preliminary chapter provide the general comprehension necessary to grasp the big picture of Drupal. Think of the knowledge communicated in this chapter as a framework from which we will hang the various skills that follow in the subsequent chapters.
What is a Theme?
In the context of Drupal, the term "theme" means a collection of files that are responsible for the look and feel of the website. Other systems use different names for the files that perform the same function in their particular systems—the most common term used elsewhere being "template."
Throughout, we will use "theme" to refer to the collection of files responsible for displaying the information on the page. We will use "template" to refer to certain specific elements of the theme, particularly in relation to the templating engine used in Drupal.
Conceptually, a theme is a visual container that is used to format and display data on the screen. Expressed in terms of its component parts, a theme is a collection of files that format data into the presentation layer viewed by site visitors and system administrators. Expressed in simplest terms: The theme determines how your site looks!
A theme will contain many files that are familiar to web designers, including typically, style sheets, images, and JavaScript. They are also likely to carry some files that may not be so familiar, for example *.theme, or *.tpl.php files. The former is used by pure PHP themes; the latter extension appears in themes that employ the PHPTemplate templating engine bundled with Drupal.
Official Drupal Online Resources
resource
URL
Main Drupal Site
http://www.drupal.org
Drupal Forums
http://drupal.org/forum
Download Extensions
http://drupal.org/project
Drupal Theming Handbook
http://drupal.org/handbook/customization
What is a Templating Engine?
A templating engine is a collection of scripts and files that serve to interpret the templating language and process the commands contained therein. As the data is produced from the database queries and from outside sources (if any), the template engine fulfills the function of plugging the data into a pre-determined format for display.
There exist a number of popular templating engines, each of which is designed to interpret different templating languages. Drupal is distributed with the PHPTemplate engine. PHPTemplate is popular for a variety of reasons, not the least of which is that the templating language it interprets is good old PHP—a preferred choice for many Web developers today.
Tip
While PHPTemplate is distributed with the Drupal core, there are a variety of other templating engines that can also be installed and used with the Drupal system. Among the most popular are XTemplate, Smarty, and PHPTal. These alternative templating engines can be downloaded from http://drupal.org/project/Theme+engines.
The Range and Flexibility of Drupal Themes
What can be done with a Drupal theme? How much presentation flexibility does the system have? These are key questions that arise when evaluating Drupal for your project. The themes included in the default distro, while useful, don't really offer much in the way of variety. But don't let the default themes prejudice your thinking too much; Drupal can be used to create a wide variety of layout styles, from traditional portal layouts to more cutting edge sites.
When assessing a CMS for flexibility, programmers and designers often look at the issue differently. Programmers tend to focus on the developmental potential the system offers with its range of available theme engines and the use of the popular PHP programming language. Designers, on the other hand, are typically more concerned with determining what restrictions a system imposes on their ability to design the interfaces desired by their clients.
There is good news for both parties. For programmers, the inclusion of the PHPTemplate engine in the Drupal distro means it is possible to tailor the output to match a variety of criteria. The system offers the ability to create custom templates and to specify your modified files over the default files—all without having to actually hack the Drupal core.
For designers, the flexibility of the Drupal approach to site building allows for the creation of attractive and brand-sensitive interfaces (not just a cookie-cutter portal or blog site).
While it may take a while for a new-comer to wade through the Drupal approach to the presentation layer, it is worth the effort, as a little knowledge can go a long way towards allowing you to tailor the system's output to your specific needs.
Who's using Drupal? Some big names...
NASA
http://appel.nasa.gov/
The Onion
http://www.theonion.com
MTV (UK)
http://www.mtv.co.uk/
Ubuntu
http://www.ubuntu.com/
Mozilla (Spread Firefox)
http://www.spreadfirefox.com/
What You See on the Screen
When you access a Drupal website, what you see on the screen is the result of the site's active theme files. As the theme files call the data, the files also set the styling, position, and placement of the content on your screen. A lot of work for a small group of files...
Within a web page layout, a Drupal theme designer will designate certain general areas to fulfill certain functions. For example, in a typical 3-column theme, the center is used to hold the primary content whereas the two smaller side columns contain secondary information. Screen space within each of those areas is also allocated according to the designer's priorities.
Note
In Drupal, that main content area is often called the content column and those columns on the side are usually called sidebars.
Drupal theme files segregate the elements on the page through the definition of markers called regions. A theme developer can place the regions anywhere on the page by adding a short statement to the code of the appropriate file. Wherever regions have been specified, the site administrator can then assign module output, which in Drupal-speak is called a block.
The default Garland theme, showing hard-coded Regions and sample Block assignments. Note how the Blocks are nested inside specific Regions
Regions are, in other words, placeholders inside the page layout into which a site administrator can position functional output; this is most frequently done by assigning blocks to the region desired.
Regions must be coded into your theme files and are, therefore, primarily the province of the theme developer. Blocks, on the other hand, can be created and manipulated by the site administrator (without having to modify the code).
Blocks can be created in two fashions: First, whenever the site administrator activates a module that produces visual output, a parallel block of the same name automatically becomes active. The administrator can then assign the block to where ever they want the module's output to appear. Alternatively, the administrator can manually create and display a new block from within the blocks manager.
Regions that have no content assigned to them are inactive, but remain eligible for block assignment. Note in the illustration that the regions labeled header, left sidebar, right sidebar, and content all have output assigned to them. Those regions are active. The footer region, in contrast, has no output assigned to it and is inactive on this particular page.
To view the block placement in each of the default templates of your distro, log in to your Drupal site as an administrator and then go to administer>site building>blocks. Click each of the themes' names to view the block placement, which will be overlaid on your screen.
The Big Picture: How Drupal Displays a Page
In order to appreciate fully the philosophy behind theming and the rationale behind the approach to modifying and creating themes that is presented in this text, it is useful to see how Drupal functions at run time.
The shortest explanation of how a CMS functions can be expressed as follows: Text and pointers to other kinds of content are stored in the database; that data is then dynamically retrieved, composed, and presented to a user in response to a request sent from a web browser. Drupal functions in the same manner, with the themes playing the crucial role in the formatting and presentation of the contents.
To illustrate the topic in more detail, consider the following:
The diagram shows a hierarchy, wherein the lowest level is the raw data and the highest level is the final output displayed on the page. The diagram also shows an order of precedence in which the items at the top of the hierarchy, nearest the browser, take precedence over items lower in the order.
By way of further explanation:
The Importance of Themes in Drupal
The role of themes in the Drupal system relates to the presentation layer of a website, that is, what the site visitors and administrators experience through their browsers. The files in a theme provide HTML formatting, CSS styling, and additional logic that frames the output of the system's functionality. All of these elements come together to create what the site visitor sees in their web browser.
While the default Drupal distro includes a set of themes which will be sufficient for many users, I assume you are reading this book out of a desire to do more, whether it be only to install additional themes and then modify them to suit your needs, or whether you plan to build your own themes from scratch.
In order to grasp better some of the challenges (and opportunities) associated with the Drupal themes, it is useful to look at three key concepts that impact the way you use the system and the way in which you must plan your theme deployment.
Key Concepts
We're going to look next at three key concepts relating to Drupal themes. Those three concepts are:
You Can Theme It All
One source of confusion for many new users of Drupal is the fact that the default administrator interface is the same as the front-end interface seen by site visitors. Unlike other content management systems, there is not a purpose-built administration interface in Drupal.
During the installation process, the system is configured to display the Garland template for both the front end and the back end. This is yet another example of the high level of integration typical to Drupal. If you want to work with one consistent template throughout, you can.
The seamless integration of the administrator interface into the site works well in some cases, but in others it may be problematic. There will be situations where the use of the same theme for the visitors and the administrators is undesirable, for example, on a marketing-oriented site where the artistic theme used for the site visitors may be impractical for site administrators.
The system's default use of the same page template for both the front end and the back end conceals the existence of a great deal of flexibility and makes it non-obvious that you can do more with the themes. That's the bad news. The good news is that you can do more—much more!
The Drupal system allows you to specify different page templates for different purposes on your site. You can, for example, build one page template for your home page, another for your interior pages, and yet another for your administrator's use. The sky is the limit on this point as the templating engine also gives you the ability to provide a variety of styling for very specific types of contents or for the output of a particular module. The control is highly granular and with a little practice (and a little ingenuity) you will find the system to be very flexible indeed.
In the following chapters, we will look at how to implement multiple themes and how to theme and configure all the various constituent parts of the Drupal system. You can theme it all!
Build with Blocks
As noted earlier in this chapter, the code of a Drupal theme includes placeholders called regions. The regions are areas in a page where content will be displayed. The site administrator can then assign a variety of output to the regions through the admin interface.
One of the most common sources of output is the Drupal modules. Modules are stand-alone bits of code—mini applications in some cases—that extend the functionality of your site. The default distro includes a large number of modules. It is through modules that Drupal provides functions like the Forum, the Aggregator and even additional administrative power, like the Throttle module.
Some modules produce output that appears on the screen, for example, the Forum module produces a threaded discussions functionality with extensive output. Other modules simply add functionality, for example the Ping module, which notifies other sites when your content has changed. The administrator is able to toggle modules on or off and able to assign the output of those modules—called blocks—to the various regions in the theme.
The process of activating modules and assigning blocks to regions on the pages is one of the most basic and most important skills for a site administrator. Understanding how to administer the system and what options are available is key to building interesting and usable sites. A great deal of flexibility can be squeezed out of the system in this area alone.
