1. The Fastest Way to a Drupal Site:
Think it, Plan it, Build it.
Introduction
Whether youâve 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 youâre 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.
Acquia ⢠acquia.com MSKU#: 0071-110901
2. 2 The Fastest Way to a Drupal Site
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, youâll need to list all of the
pages of 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 template 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:
SourceâInteractionâDisplay
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?
Acquia ⢠acquia.com
3. 3 The Fastest Way to a Drupal Site
⢠A contributor? Drupal Gardens FAQ
⢠An automated feed
How is Drupal Gardens Drupal? Or
⢠A module open source? â Drupal Gardens
is a new kind of product: OSSaaS
⢠Site visitors? (Open Source Software as a
Service) built on Drupal. Along the
Interaction: Who interacts with this and how? These questions are very similar
way, Acquia has put thousands of
to the previous set (source) and can usually also be answered with a different
hours of thought and work into the
combination of user roles, permissions and module configuration.
Drupal core and many contributed
⢠Who can see it? modules.
⢠Who can change it? Do I own my data? â Yes. Export
your Drupal Gardens site at any time
⢠Who can add to it?
and run it on any Drupal-compatible
hosting. The export is 100% un-
Display: Where and how is this displayed? The answers to these questions lie
hacked Drupal. No kittens were
in the configuration of blocks, selection and presentation of content in views,
killed during the making of your site.
menu- and module configuration, and so on.
What modules are available in
Just to be clear, by âdisplayâ I mean the functional aspects of your site like
Drupal Gardens? â Create a site
pages and block regions, not â200 pixels wide and blueââsetting the look and
today at http://drupalgardens.com
appearance of your site is called âthemingâ in Drupal.
and go to the Modules page of your
⢠Where on the page does this appear new site to find out!
⢠Is it in a block? In which region and on which pages What if I want to add more modules
to my site? â Export it. You can then
⢠Is it a link? Is it a menu item?
add compatible modules and get
⢠Is it a teaser or a full node? development help from 1000s of
Drupal service providers around the
With a bit of practice and experience building sites, this formula should become world.
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
Letâs look at my wireframes and run through the practical application of Source-
Interaction-Display on part of my overall site plan.
Acquia ⢠acquia.com
4. 4 The Fastest Way to a Drupal Site
As you go through the SourceâInteractionâDisplay process on your own sites,
youâll start hitting more and more elements youâve already covered. This should
give you some peace of mind that you are covering all the bases.
Hereâs the plan for my front page:
This shows my siteâs sub-pages and how my main menu will work:
Acquia ⢠acquia.com
5. 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â
thatâs 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
Drupalâs 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
donât change muchâlike the welcome text on my ice cream parlorâs 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 youâre good
to go.
A custom block is a great way to present short, important informationâlike 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, thereâll
also be two other pages, each with a single authorâs 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 âWhoâs
newâ.
Most of us can probably use a couple other dynamic pages that arenât built in
to Drupal. Thatâs where modules like Views and Simple Views come in. They
give you a variety of powerful options to make the rulesâcalled âviewsââto build
dynamic pages and blocks.
Acquia ⢠acquia.com
6. 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 pageââwhich is only a title, and
a body textâfor everything on your site, but itâs like throwing a bunch of colored
toy blocks into an open box:
⢠The information might all be there, but itâs hard to sort 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 wonât be sortable.
⢠One product might be described one way and another completely differently.
⢠Youâll lose sales if itâs 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 plus 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
Acquia ⢠acquia.com
7. 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:
Acquia ⢠acquia.com
8. 8 The Fastest Way to a Drupal Site
Source-Interaction-Display - element by element Theming Drupal
Planning every element of every page pays off in reduced build and This white paper does not cover
configuration time. Due to space constraints, I am not able to do that here. developing the look and feel of your
Below are some highlights to give you the idea: site, known as âthemingâ in Drupal
(there is an article in this issue, âPSD
Items marked with an asterisk (*) are included in the Drupal Gardens template I To Drupal 7 Themeâ that covers
chose for the site. some Drupal theming basics).
It would take a lot more space that
Site name*, Site slogan*
I have here to even begin to cover
⢠SOURCE: Site administrator. Set via Configuration > Site information all of the possibilities in this rapidly
evolving areaâfrom in-browser
⢠INTERACTION/DISPLAY: Visible in the header region by default.
WYSIWYG tools like the Drupal
Gardens ThemeBuilder to templating
Logo* languages, tools, modules, base
themes, theme families and systems.
⢠SOURCE/DISPLAY: Site administrator. Actually a theme element, set using the Drupal
Gardens ThemeBuilder (via Appearance > Brand > Logo). Set your siteâs âfaviconâ while
Remember that we use a content
you are there.
management system like Drupal to
separate theming from functionality.
Menus (main*, footer, products page sub-menu) Choose a solid, flexible base theme;
make your site work right (access,
⢠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 dynamic pages, links, etc.), then
and configure custom Footer and Product page menus via Structure > Menus > â+ Add make it pretty.
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.
Acquia ⢠acquia.com
9. 9 The Fastest Way to a Drupal Site
Custom blocks (Contact page message, Flavor of the month*, Store hours*, Drupal jargon, a micro-
Copyright & thanks) glossary
⢠SOURCE: Site administrator. Create custom blocks via Structure > Blocks. Attribution: sourced in part and
inspired by http://drupal.org/
⢠INTERACTION: Block texts include links to relevant pages.
node/19828. See this white paperâs
⢠DISPLAY: Flavor of the month block placed in Sidebar A, Store hours block in Sidebar âFurther readingâ section for links to
B, Copyright & thanks block in the Copyright region, displayed on all pages via Structure more references online.
> Blocks. The âGot something to tell us?â block is displayed in the Highlighted Content
region on the Contact page only.
Node - The basic unit of content
in Drupal. All nodes are of a given
Module generated blocks* content type (page, blog entry, etc.).
All nodes have a title; most have a
⢠Twitter feed* SOURCE: Aggregator module. Site administrators configure the Twitter
feed and âOverheard on Twitterâ block via Configuration > Feed aggregator. Get the text body.
feed URLs from your account page at http://twitter.com.
Block, Region - Pages on your
⢠Mailing list* SOURCE: Mailing List module. Site administrators can create lists and
Drupal site are laid out in regions.
set subscription confirmation messages via Structure > Mailing lists.
Blocks (including menus, module
⢠Mailing list* INTERACTION: All site visitors can enter their name and an e-mail output, views or static content) are
address. Site administrators can see and download all submissions for use elsewhere. displayed within those regions.
⢠DISPLAY: Set display at Structure > Blocks.
Module - A set of code that enables
specific functionality on your site.
Front page welcome message* Most create a set of permissions
when activated. Some make new
⢠SOURCE: âBasic pageâ node created by site administrators.
blocks and menu items available
⢠INTERACTION: Comments deactivated. when they are activated.
⢠DISPLAY: Save this node with the following âPublishing optionsâ (via the content Users, Permissions, Roles - The
creation page):
combination of roles assigned to a
user and the permissions assigned
⢠Published (visible to site visitors)
to those rolls determine what a
⢠Promoted to front page (displayed on front page) site visitor can see and do on your
site. All unregistered site visitors
⢠Sticky at top of lists (no matter what else might appear on the page, this will be
displayed at the top). have the âanonymousâ user role. All
registered and logged-in users have
⢠Other âBasic pageâ static content on the site includes: Where to buy, Wholesales, the âauthenticatedâ user role and any
About us* & How to find us pages.
other roles theyâve been assigned.
Acquia ⢠acquia.com
10. 10 The Fastest Way to a Drupal Site
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 viewâs 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 pageâas 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 pre-
configured 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.
Acquia ⢠acquia.com
11. 11 The Fastest Way to a Drupal Site
⢠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 About Acquia
blog posts and press releases) and which should not (products, staff biographies, and Acquia empowers enterprises
the like). Comments on content â The same goes for which content types site visitors with the open-source
should be allowed to comment on. After activating comments, set the comment
permissions (post comments is the critical one) via People > Permissions. content-management
system Drupal. Co-founded
⢠Want more than a mailing list? â You might want to know more that a name and by Drupalâs creator in 2007,
an e-mail address. Make a powerful webform instead to collect e-mails along with
Acquia helps customers
multiple choice, free text and other kinds of questions, using the Webform module (the
engine behind the Drupal Gardens âFormsâ feature. manage their growth and
scale their online properties
⢠Links - When you add links to other pages within your site by hand, format the link
with confidence. Acquiaâs
like this: <a href=â/contactâ>Contact page</a>, Drupal will fill in the rest of your site
URL for you! software, consultation, cloud
infrastructure, and services
enable companies to realize
the full power of Drupal while
Or just go for it! minimizing risk, as itâs done
Think of your Drupal Gardens site it as a living wireframe. Thanks to its site for Examiner.com, Al Jazeera,
templates, features and ease of repeatability (you can copy and reuse whole and over 700 others.
sites and themes), Drupal Gardens lets you get away with a little less planning See whoâs using Drupal at
up front and a little more experimentation along the way. Just think âSourceâ http://showcase.acquia.com
InteractionâDisplayâ every time you want to add something new. and learn more at
http://acquia.com.
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 Š 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
Acquia ⢠acquia.com
Editor's Notes
Have performed services for payers such as:IT Roadmap and Strategy DevelopmentDemand Management StrategyResource and Role RACI DevelopmentApplication Rationalization