Acquia acquia.

com

The Fastest Way to a Drupal Site: Think it, Plan it, Build it.
Introduction
Whether youve been building static web pages, managing hosted blogs, or are new to web development altogether building a dynamic, content managed website may seem daunting. With literally thousands of modules to choose from, and an expandable architecture, an open source framework like Drupal can be intimidating. Fortunately, there is a solution that can provide all of the benefits of a content management system, without the steep learning curve you might expect. If youre interested in building sites that take advantage of cutting-edge web 2.0 features, or have been wary of diving into an open source CMS, this white paper is for you. With illustrated diagrams and easy to follow instructions, this white paper will take you through set-up, site administration, and even content organization. Using Drupal Gardens, the do it yourself online tool for building and theming Drupal sites, this white paper will have you launching your next web project today. Note: The Drupal Gardens export is 100% un-hacked Drupal. No kittens were killed during the making of your site.
1

1 Sites exported from Drupal Gardens mirror the state of the Drupal Gardens code base at the time of export. Drupal Gardens may
include patched or developer versions of modules and other code that is still under consideration for, but not yet part of, the official releases downloaded from drupal.org. Exported Drupal Gardens sites are compatible with Drupal 7 core and modules and fully upgradeable.

MSKU#: 0071-110901

2 The Fastest Way to a Drupal Site Acquia acquia.com

Think it
You need to know what your site should do before you can build it quickly and efficiently. I like to start with a list of ideas and needs that I then turn into wireframes simple graphic mockups of the main pages of my site. Seeing the pages laid out helps me keep track of the details. However you do it, youll need to list all of the pages o f your site and what you need on them. Group them into main and sub-pages to get a feeling for what your site navigation will need to look like. For this white paper, I planned a site for an ice cream parlor using the Drupal Gardens Product site template. This templat e activates and configures a bunch of modules, content types and blocks for me. I only used a small selection of the functionality available in Drupal Gardens and only a few of the block regions available in the standard Drupal Gardens theme layout:

Plan it
Apply the following formula to every element on every page of your site:

SourceInteractionDisplay
Ask yourself the following questions: Source: Where does this come from? Some combination of user roles, permissions and module configuration usually answers these questions.
A site administrator?

3 The Fastest Way to a Drupal Site

Acquia acquia.com
A contributor? An automated feed A module Site visitors?

Interaction: Who interacts with this and how? These questions are very similar to the previous set (source) and can usually also be answered with a different combination of user roles, permissions and module configuration.
Who can see it? Who can change it? Who can add to it?

Display: Where and how is this displayed? The answers to these questions lie in the configuration of blocks, selection and presentation of content in views, menu- and module configuration, and so on. Just to be clear, by display I mean the functional aspects of your site like pages and block regions, not 200 pixels wide and bluesetting the look and appearance of your site is called theming in Drupal.
Where on the page does this appear Is it in a block? In which region and on which pages Is it a link? Is it a menu item? Is it a teaser or a full node?

With a bit of practice and experience building sites, this formula should become second nature and make you feel confident you are covering all the relevant aspects of each page element on your site.

Build it: From wireframe to site

Lets look at my wireframes and run through the practical application of Source- Interaction-Display on part of my overall site plan.

Drupal Gardens FAQ

How is Drupal Gardens Drupal? Or open source? Drupal Gardens is a new kind of product: OSSaaS (Open Source Software as a Service) built on Drupal. Along the way, Acquia has put thousands of hours of thought and work into the Drupal core and many contributed modules. Do I own my data? Yes. Export your Drupal Gardens site at any time and run it on any Drupal-compatible hosting. The export is 100% un-hacked Drupal. No kittens were killed during the making of your site. What modules are available in Drupal Gardens? Create a site today at http://drupalgardens.com and go to the Modules page of your new site to find out! What if I want to add more modules to my site? Export it. You can then add compatible modules and get development help from 1000s of Drupal service providers around the world.4 The Fastest Way to a Drupal Site

Acquia acquia.com As you go through the SourceInteractionDisplay process on your own sites, youll start hitting more and more elements youve already covered. This should give you some peace of mind that you are covering all the bases. Heres the plan for my front page: This shows my sites sub-pages and how my main menu will work:5 The Fastest Way to a Drupal Site

Two important choices

The really important part of the products page (see below) is the list of flavors thats what we really want to know about an ice cream place, right? It is the result of two choices you need to understand to really be able to leverage Drupals power and flexibility:
When should I make new content types and why? When should I make static versus dynamic pages?

Static and Dynamic

Understanding what static and dynamic pages (and blocks) are and when you should use each can help you plan and run your site. Static pages and blocks - There are a few pages or blocks on most sites that dont change muchlike the welcome text on my ice cream parlors front page. The Drupal Basic page content type is perfect for pages like this. Add menu links to the main or sub -menus where visitors should find them and youre good to go. A custom block is a great way to present short, important informationlike the store hours block on my site. Dynamic pages and blocks Building and maintaining complex pages by hand is laborious. You should let Drupal assemble them for you. As your site grows and changes, those pages change for you automatically. Some of these dynamic pages and blocks come with Drupal and its modules:
The Blog module lists all blog posts, newest first. If you have two blog authors, therell also be two other pages, each with a single authors entries. Drupal can display a page of all site content tagged with any given taxonomy term. Blocks like Recent [comments/new members/blog posts/gallery images] and Whos new.

Most of us can probably use a couple other dynamic pages that arent built in to Drupal. Thats where modules like Views and Simple Views come in. They give you a variety of powerful options to make the rules called viewsto build dynamic pages and blocks.6 The Fastest Way to a Drupal Site

Making content types work for you

When should you create and use new content types? I use two strategies when planning a site: organization and access. The organization strategy Making content types that fit your data helps in collecting, organizing and presenting it. You could use a simple content type like Basic pagewhich is only a title, and a body textfor everything on your site, but its like throwing a bunch of colored toy blocks into an open box:
The information might all be there, but its hard to so rt the products from the staff members from anything else. If you tag your content, you can at least leverage Drupal to show things tagged product on one page, but it wont be sortab le. One product might be described one way and another completely differently. Youll lose sales if its difficult for visitors to sort and compare your products.

Custom-tailoring (new) content types by adding numerical, text or other fields to them means no matter who adds new products on your site, it will be done in a standardized format. This also lets you take advantage of views to make dynamic, sortable products pages, while still only having to enter each product a single time. Example: The Ice cream custom content type on my site includes a name and text body pl us fields like: short description (text field), calories per serving (numerical field); photo (image field); popularity; ingredients list; allergens list; etc. The access strategy Limit content contributors access to only creating and changing content of one or more specific content types. Site administrators retain full access to the back end, but restrict non-technical users, improving security and reducing administrative headaches. Example:
Three groups of users need to add and change content on a school website: the school administration, the PTA, and the after school program. Make a user role for each

7 The Fastest Way to a Drupal Site

Make two simple content types (title and body text only), PTA page and After School page, along with anything else you need. PTA and After School are only assigned permissions to create, edit and delete pages of their own content types. School administration users are permitted to create, edit and delete all content and blocks on the site.

Here are two important sub-pages, the contact page and my products page:8 The Fastest Way to a Drupal Site

Source-Interaction-Display - element by element

Planning every element of every page pays off in reduced build and configuration time. Due to space constraints, I am not able to do that here. Below are some highlights to give you the idea: Items marked with an asterisk (*) are included in the Drupal Gardens template I chose for the site. Site name*, Site slogan*
SOURCE: Site administrator. Set via Configuration > Site information INTERACTION/DISPLAY: Visible in the header region by default.

Logo*
SOURCE/DISPLAY: Site administrator. Actually a theme element, set using the Drupal Gardens ThemeBuilder (via Appearance > Brand > Logo). Set your sites favicon while you are there.

Menus (main*, footer, products page sub-menu)

SOURCE: Site administrator. Add main menu links while creating the various pages. Add links to sub-pages as children of their respective parent menu items. Create and configure custom Footer and Product page menus via Structure > Menus > + Add menu. INTERACTION: Menu items that link to parts of your site that a given user does not have permission to see will not be shown to that user. DISPLAY: Menus are blocks in Drupal. Set their display regions and pages via Structure > Blocks. Footer menu block placed in the Footer first region, Product page menu block placed in the Sidebar A region and displayed only on the Products page via Structure > Blocks. Main menu displayed in the Navigation region by default.

Rotating banner*
SOURCE: Site administrator. The rotating banners in Drupal Gardens are blocks. Create and configure via Structure > Blocks. INTERACTION: Images can link to any URL. DISPLAY: Displayed by default in the banner block on the front page only.

Theming Drupal
This white paper does not cover developing the look and feel of your site, known as theming in Drupal (there is an article in this issue, PSD To Drupal 7 Theme that covers some Drupal theming basics). It would take a lot more space that I have here to even begin to cover all of the possibilities in this rapidly evolving areafrom in-browser WYSIWYG tools like the Drupal Gardens ThemeBuilder to templating languages, tools, modules, base themes, theme families and systems. Remember that we use a content management system like Drupal to separate theming from functionality. Choose a solid, flexible base theme; make your site work right (access, dynamic pages, links, etc.), then make it pretty. 9 The Fastest Way to a Drupal Site

Custom blocks (Contact page message, Flavor of the month*, Store hours*, Copyright & thanks)
SOURCE: Site administrator. Create custom blocks via Structure > Blocks. INTERACTION: Block texts include links to relevant pages. DISPLAY: Flavor of the month block placed in Sidebar A, Store hours block in Sidebar B, Copyright & thanks block in the Copyright region, displayed on all pages via Structure > Blocks. The Got something to tell us? block is displayed in the Highlighted Content region on the Contact page only.

have the anonymous user role. All registered and logged-in users have the authenticated user role and any other roles theyve been assigned.10

The Fastest Way to a Drupal Site

Module generated blocks*

Twitter feed* SOURCE: Aggregator module. Site administrators configure the Twitter feed and Overheard on Twitter block via Configuration > Feed aggregator. Get the feed URLs from your account page at http://twitter.com. Mailing list* SOURCE: Mailing List module. Site administrators can create lists and set subscription confirmation messages via Structure > Mailing lists. Mailing list* INTERACTION: All site visitors can enter their name and an e-mail address. Site administrators can see and download all submissions for use elsewhere. DISPLAY: Set display at Structure > Blocks.

Front page welcome message*

SOURCE: Basic page node created by site administrators. INTERACTION: Comments deactivated. DISPLAY: Save this node with the following Publishing options (via the content creation page): Published (visible to site visitors) Promoted to front page (displayed on front page) Sticky at top of lists (no matter what else might appear on the page, this will be displayed at the top). Other Basic page static content on the site includes: Where to buy, Wholesales, About us* & How to find us pages.

Drupal jargon, a micro-glossary

Attribution: sourced in part and inspired by http://drupal.org/ node/19828. See this white papers Further reading section for links to more references online. Node - The basic unit of content in Drupal. All nodes are of a given content type (page, blog entry, etc.). All nodes have a title; most have a text body. Block, Region - Pages on your Drupal site are laid out in regions. Blocks (including menus, module output, views or static content) are displayed within those regions. Module - A set of code that enables specific functionality on your site. Most create a set of permissions when activated. Some make new blocks and menu items available when they are activated. Users, Permissions, Roles - The combination of roles assigned to a user and the permissions assigned to those rolls determine what a site visitor can see and do on your site. All unregistered site visitors

Contact form*
SOURCE: Site administrator. Add contact categories, admin recipient e-mail addresses, and custom auto-reply messages to the contact form via Structure > Contact form. Drupal Gardens adds a Contact menu item to the main menu by default. INTERACTION: The Use the site-wide contact form permission is given by default to all users. Restrict access to the contact form by removing the Use the site -wide contact form permission from one or more roles via People > Permissions > Permissions. DISPLAY: The contact page and menu links to it will not be displayed to users who do not have access to it.

Products page flavor list

SOURCE: Site administrator. A sorted view of all ice cream flavors showing the teaser display (name, photo, short description) of the Icecream content type. INTERACTION: When visitors click on the name of the flavor, they are taken to its full page. DISPLAY: The view is built to show Icecream nodes as teasers. Site administrators could also expose some of the views filters, allowing visitors to sort the view based on the exposed filters (name, popularity, dairy content, etc.).

Other dynamic pages

Staff & Events pages - built like the Products pageas a view of a custom content type. The Upcoming event on the front page is a node promoted to the front page, but not sticky at the top of lists. It also appears on the Events page. Blog* - Blog entries, newest first, generated by the Blog module FAQ* - View of FAQ item content. This content type, page and menu link are preconfigured by the Drupal Gardens FAQ feature. Pictures* - Landing page displaying all media galleries. Generated by the Gallery module that drives the Drupal Gardens Media Gallery feature. Each gallery also generates a configurable preview block.

Pro tips for the road

Here are a couple things I like to remind myself of when I am building a site:
Set these before you start creating real production content. Going back and updating content later is a real hassle.

11 The Fastest Way to a Drupal Site

page</a>, Drupal will fill in the rest of your site URL for you!

About Acquia
Acquia empowers enterprises with the open-source contentmanagement system Drupal. Co-founded by Drupals creator in 2007, Acquia helps customers manage their growth and scale their online properties with confidence. Acquias software, consultation, cloud infrastructure, and services enable companies to realize the full power of Drupal while minimizing risk, as its done for Examiner.com, Al Jazeera, and over 700 others. See whos using Drupal at http://showcase.acquia.com and learn more at http://acquia.com.
Copyright 2011, Acquia, Inc. Acquia, Inc. 25 Corporate Drive, 4th Floor Burlington, MA 01803 USA www.acquia.com sales@acquia.com +1.781.238.8600

Or just go for it!

Think of your Drupal Gardens site it as a living wireframe. Thanks to its site templates, features and ease of repeatability (you can copy and reuse whole sites and themes), Drupal Gardens lets you get away with a little less planning up front and a little more experimentation along the way. Just think Sour ce Interaction Display every time you want to add something new.

Further Reading
If getting a Drupal Gardens site online has whetted your appetite, here are a few great references on Drupal.org:
Understanding Drupal: http://drupal.org/documentation/ understand General concepts - http://drupal.org/node/19828 Terminology - http://drupal.org/node/937 Acronyms and expressions used on drupal.org is informative, fun, and will help you communicate more effectively with other Drupalistas: http://drupal.org/node/302232

Acquia acquia.com
Author and submission time display - Decide and set for each content type (via Structure > Content types > edit) which ones should display this information (good for blog posts and press releases) and which should not (products, staff biographies, and the like). Comments on content The same goes for which content types site visitors should be allowed to comment on. After activating comments, set the comment permissions (post comments is the critical one) via People > Permissions. Want more than a mailing list? You might want to know more that a name and an email address. Make a powerful webform instead to collect emails along with multiple choice, free text and other kinds of questions, using the Webform module (the engine behind the Drupal Gardens Forms feature. Links - When you add links to other pages within your site by hand, format the link like this: <a href=/contact>Contact