Front End Drupal: Designing, Theming, Scripting

Product Author Bios

Emma Jane Hogbin has been working as a Web developer since 1996, helping individuals and organizations to realize both their own potential and the potential of their online presence. She creates systems that enable her clients to succeed–by using her infectious enthusiasm and ability to explain concepts without using technical jargon that puts even the greatest technophobes at ease. Passionate about helping people to acquire knowledge, Emma volunteers with the Drupal and Ubuntu documentation teams. She is well known in the Drupal community not only for her technical knowledge, but also for her engaging and humorous means of bringing Drupal to a wider audience–such as the Drupal socks and their GPLed pattern. Through her consulting company HICK Tech, and at conferences around the world, Emma has inspired people to overcome fear, uncertainty, and doubt and to tackle problems head-on. She is known as “emmajane” on drupal.org and chronicles her adventures at http://www.emmajane.net.

Konstantin Käfer started his adventures into Web development in 1999. In high school, he led the Web development and school Web site class for several years. While still in high school, he also participated in Google’s Summer of Code 2006, doing usability enhancements for the Drupal project. In the Drupal community, he is widely known for his JavaScript skills. Konstantin has been a speaker at several DrupalCons and other Open Source conferences. He is currently studying IT Systems at the Hasso Plattner Institute Engineering in Potsdam, Germany. He also works as a consultant for NowPublic, a large citizen journalism Web site based on Drupal. He can be found blogging on http://kkaefer.com about design, Web development, and Drupal.

“For Drupal to succeed, we need books like this.”

–Dries Buytaert, Drupal founder and project lead

“Drupal faces a common problem on the Web–the relative lack of new, high quality themes. Front End Drupal tackles this problem directly and is designed to help both experienced designers and rank novices get an understanding of how Drupal theming works. In fact, I’ll be the first to admit I learned a lot from this book.”

– Dries Buytaert, Drupal founder and project lead

The Practical, Complete Guide to Customizing Drupal Sites with Behaviors, Themes, and Templates

Drupal is now the world’s #1 open source content management system: Thousands of individuals and organizations are using it to build and update Web sites of virtually every kind. As Web designers and developers adopt Drupal, they need ways to quickly customize the visuals and interactivity of their sites. Drupal offers powerful tools for doing so, but little guidance on using them effectively. Front End Drupal is the solution. In this book, two expert Drupal developers cover everything you need to know to create great visual designs and state-of-the-art interactivity with Drupal’s behaviors, themes, and templates.

Front End Drupal is 100% focused on issues of site design, behavior, usability, and management. The authors show how to style Drupal sites, make the most of Drupal’s powerful templating system, build sophisticated community sites, streamline site management, and build more portable, flexible themes. You’ll also gain hands-on experience through several case studies that walk you through the customization of everything from page templates to Web site forums.

• Prepare and organize content so it’s easier to integrate into Drupal Web sites
• Structure Drupal page templates that are easy to work with
• Configure Drupal with the modules and browser tools you need to customize your site
• Utilize Drupal’s Starter Themes and themes converted from WordPress, Joomla!™, and Drupal 5.x
• Maximize the power and usability of Drupal’s content editing forms
• Build usable community sites with user profiles, comments, and user-generated content
• Use JavaScript™ to make your themes interactive and to enhance usability
• Create powerful animations and AJAX callbacks with jQuery, Drupal’s JavaScript library

About the Web Site

The accompanying site, frontenddrupal.com, contains all sample code and themes presented in this book.

Related Articles

Introduction to jQuery: Use jQuery to Write Simpler, Shorter, More Readable JavaScript Code

Web Page Refactoring with jQuery

Author's Site

Please visit the author's site at frontenddrupal.com.

Customer Reviews

53 of 58 people found the following review helpful Great book that covers more than just "theming", April 30, 2009 By  Addison Berry "add1sun" (Jessup, MD USA) - See all my reviews This review is from: Front End Drupal: Designing, Theming, Scripting (Paperback) To properly orient this review, I should start off by saying that I know Drupal theming pretty well, so my take on things may be a bit different from someone who is totally new to theming. I've also taught a lot of folks though, on every part of the learning curve, so I can appreciate what it means to get some of this stuff to click for people. The book tells you at the start that you shouldn't be a total Drupal newbie. This book is about getting Drupal to look the way you want, but it expects you to bring some basic skills to the table. Now, that said, the first few chapters do take the time to get you oriented with Drupal; so if you are rusty, you get a refresher, and if you are cheeky and like to scoff at "prerequisites," you at least get a toe-hold of the basics before being whisked into the heart of it all. So, off we go. As I started into it, the first thing that I noticed was that this really is not about "just" code. I was expecting to get dumped right into some... Read more Help other customers find the most helpful reviews  Was this review helpful to you?  Report abuse | Permalink  Comment 34 of 38 people found the following review helpful Mixed Feelings, May 21, 2009 By  T. Stone "wastingtape" (Denver, CO) - See all my reviews    This review is from: Front End Drupal: Designing, Theming, Scripting (Paperback) Having never developed a Drupal theme (but being proficient in HTML/CSS/jquery), I found this a rather hard book to follow. It felt like the book really wanted to be a book about front-end drupal, but ends up spending quite a lot of time talking about abstract framework concepts, back-end features, and configurations (I recognize these are part of creating a user experience, but why the book choose to start with them is beyond me). Chapter 3, the actual chapter on drupal themes was even more bizarre. There was perhaps maybe five paragraphs on making a theme. The rest is dedicated to talking about other subjects like converting themes from other CMS's and previous versions of drupal and whatnot. The book feels more like "A Guide to Drupal 6 For People Who've Used Drupal 5 With the Stock Settings and Want To Know How To Customize It" than "Front-End Drupal". I was hoping for a book that was more along the lines of "JQuery In Action" -- a book that is... Read more Help other customers find the most helpful reviews  Was this review helpful to you?  Report abuse | Permalink  Comment (1) 25 of 28 people found the following review helpful Becoming a Pro Drupal web designer, April 18, 2009 By  Victor Opas Kane "Victor Kane" (Buenos Aires, Argentina) - See all my reviews    This review is from: Front End Drupal: Designing, Theming, Scripting (Paperback) This book is what Drupal books ought to be, and uses the same method as other great Drupal books. I could say it takes Drupal's presentation layer apart and puts it back together again, but that would be insufficient. What it does is take the Drupal presentation layer apart in gradual stages... and has you put it back together again. It reveals the seven veils of the mystery through actual practice, and puts you in control with the tools you really need to be effective at every juncture. And the book deals thoroughly with the domain it purports to cover, and doesn't get sidetracked. The spotlight is on web design, but it is brutally honest about what you really need to get the most out of Drupal. As a result there are incursions into other areas the professional web designer really needs to deal with. There is even an example Drupal PHP module, but the book is careful to explain that it is not a book on building modules for Drupal, and recommends the books that are for the... Read more Help other customers find the most helpful reviews  Was this review helpful to you?  Report abuse | Permalink  Comment

Share your thoughts with other customers:

› See all 20 customer reviews...

Praise For Front End Drupal: Designing, Theming, Scripting

"Content management systems (CMSs) are created largely by Web developers using back-end programming languages (such as PHP, by far the most common choice). The free CMSs are built as open source projects, by volunteers who have many demands on their time. As a result of both of these competing factors, far less time is devoted to the front-end aspects of these CMSs. In turn, the "themes" that define the appearance of a CMS-based website are typically substandard, in the eyes of many Web designers and, most likely, countless users of those sites. This criticism has been leveled even against Drupal, although the situation is improving. A new book, Front End Drupal: Designing, Theming, Scripting, is intended to help Drupal designers everywhere speed up that process of improvement."
– Michael J. Ross, Web developer and Slashdot contributor

Read the complete review on Slashdot.

Online Sample Chapter

The Drupal Page

Table of Contents

Foreword xvii

Preface xix

Acknowledgments xxiii

About the Authors xxv

Chapter 1: Web Page Design 1

Describing Content 2

Organizing Lists of Content 8

Page Design and Layout 14

Interaction 20

Code 22

Work Flow 25

Summary 29

Chapter 2: The Themers’ Toolkit 31

A Gentle Introduction 32

Theming Strategies 33

Drupal Terminology 36

Must-Have Modules 42

Browser Tools 60

Language References 65

Maintaining Your System 69

Summary 71

Chapter 3: Working with Drupal Themes 73

Finding Themes 74

Installing Drupal Themes 78

Administering Themes 82

Anatomy of a Theme 88

Starter Themes 94

Migrating to Drupal 6 99

Summary 104

Chapter 4: The Drupal Page 107

Elements of a Page 107

Sitewide Page Variables 109

Navigation and Menus 115

Grid Work 120

Search 126

Changing Templates 128

Alias: Page 133

Taxonomy Templates 138

Delivering Plain Content 141

Summary 149

Chapter 5: Drupal Content 151

Node Templates 151

Gaining More Control Than $content Provides 155

Node Template Variables 161

Pages and Teasers 165

Images 169

Making Lists of Content with Views 177

Summary 181

Chapter 6: Customizing the Content-Editing Forms 183

Web Forms 184

Form Candy 185

Rich Text Editing 195

Altering Forms with FAPI 201

Multiple-Page Forms 210

Improving Access to Edit Screens 212

Summary 217

Chapter 7: Users and Community Participation 219

Users 219

Granting and Restricting Access 227

Community Comments 231

User-Generated Content 235

Spam 240

Private Web Site Areas 244

Summary 248

Chapter 8: Administrative Interfaces 251

Creating a Custom Administrative Interface 252

Task-Based Navigation 256

Administrative Menus 261

Administrative Dashboards and Control Panels 266

Custom Administrative Screens 270

Error! 279

Summary 283

Chapter 9: Learning JavaScript 285

JavaScript versus DOM 286

The JavaScript Language 287

Object Orientation in JavaScript 293

Summary 309

Chapter 10: An Introduction to jQuery 311

A First Look at jQuery 313

Using jQuery 320

Leveraging jQuery’s Full Potential 333

Using Other JavaScript Libraries 343

Summary 344

Chapter 11: JavaScript in Drupal 345

Server-Side Drupal Integration 345

Architecting a Component 353

Example: Horizontal Scroller 355

Using Plugins and jQuery UI 377

Summary 380

Appendix A: Installing Drupal 381

Setting Up a Development Server 381

Configuring Document Root and Virtual Hosts 383

Installing Drupal–and Common Hurdles to Its Installation 385

A Quick Glance at the Admin Area 388

Installing Modules 389

Appendix B: Supplemental Code 391

template 391

demo-module 397

template-skeleton 400

horizscroll and horizscroll-datasource 404

sparkline 415

Index 419

Sample Pages

Download the sample pages (includes Chapter 4 and Index)

Errata

Download the errata