10
 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 D rupal can be intimidating. Fortunately , there is a solution that can provide all of the benets of a content management system, without the steep learning cur ve 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, t his 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 ofcial releases downloaded from drupal.org. Exported Drupal Gardens sites are compatible with Drupal 7 core and modules and fully upgradeable. MSKU#: 0046

Fastest Way to Create Drupal Website

  • Upload
    kchez

  • View
    21

  • Download
    0

Embed Size (px)

Citation preview

5/12/2018 Fastest Way to Create Drupal Website - slidepdf.com

http://slidepdf.com/reader/full/fastest-way-to-create-drupal-website 1/10

 

The Fastest Way to a Drupal

site:

Think it, Plan it, Build it.

IntroductionWhether 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 o modules to choose rom,

and an expandable architecture, an open source ramework like Drupal can be

intimidating. Fortunately, there is a solution that can provide all o the benets

o a content management system, without the steep learning curve you mightexpect.

I you’re interested in building sites that take advantage o cutting-edge web 2.0

eatures, or have been wary o diving into an open source CMS, this white paper is

or you. With illustrated diagrams and easy to ollow instructions, this white paper

will take you through set-up, site administration, and even content organization.

Using Drupal Gardens, the do it yoursel online tool or 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 o 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 ofcial releases downloaded from

drupal.org. Exported Drupal Gardens sites are compatible with Drupal 7 core and modules and

fully upgradeable.

MSKU#: 0046

5/12/2018 Fastest Way to Create Drupal Website - slidepdf.com

http://slidepdf.com/reader/full/fastest-way-to-create-drupal-website 2/10

 

2 The Fastest Way to a Drupal

Acquia

 Think itYou need to know what your site should do beore you can build it quickly and eciently.

I like to start with a list o ideas and needs that I then turn into “wirerames”–simple graphic mockups o the main pages o my

site. Seeing the pages laid out helps me keep track o the details. However you do it, you’ll need to list all o the pages o your s

and what you need on them. Group them into main and sub-pages to get a eeling or what your site navigation will need to lo

like.

For this white paper, I planned a site or an ice cream parlor using the Drupal Gardens “Product” site template. This template

activates and congures a bunch o modules, content types and blocks or me. I only used a small selection o the unctionality

available in Drupal Gardens and only a ew o the block regions available in the standard Drupal Gardens theme layout:

Plan itApply the ollowing “ormula” to every element on every page o your site:

Source–Interaction–Display

Ask yoursel the ollowing questions:

Source: Where does this come rom? Some combination o user roles, permissions and module conguration usually answers

these questions.

A site administrator?•

A contributor?•

An automated eed•

A module•

Site visitors?•

5/12/2018 Fastest Way to Create Drupal Website - slidepdf.com

http://slidepdf.com/reader/full/fastest-way-to-create-drupal-website 3/10

 

  The Fastest Way to a Drupal Site

Acq

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 dierent combination o user roles, permissions and module

conguration.

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 conguration o blocks, selection and presentation

o content in views, menu- and module conguration, and so on.

Just to be clear, by “display” I mean the unctional aspects o your site

like pages and block regions, not “200 pixels wide and blue”–setting the

look and appearance o 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 ull node?•

With a bit o practice and experience building sites, this ormula should become second nature and make you eel condent yo

are covering all the relevant aspects o each page element on your site.

Build it: From wirerame to siteLet’s look at my wirerames and run through the practical application o Source-Interaction-Display on part o my overall site pl

As you go through the Source–Interaction–Display process on your own sites, you’ll start hitting more and more elements you’

already covered. This should give you some peace o mind that you are covering all the bases.

Drupal Gardens FAQ

How is Drupal Gardens Drupal? Or open source? –

Drupal Gardens is a new kind o product: OSSaaS (Open

Source Sotware as a Service) built on Drupal. Along

the way, Acquia has put thousands o hours o 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 kitten

were killed during the making o your site.

What modules are available in Drupal Gardens? –

Create a site today at http://drupalgardens.com and go

to the Modules page o your new site to nd out!

What i I want to add more modules to my site? –

Export it. You can then add compatible modules and

get development help rom 1000s o Drupal service

providers around the world.

5/12/2018 Fastest Way to Create Drupal Website - slidepdf.com

http://slidepdf.com/reader/full/fastest-way-to-create-drupal-website 4/10

 

4 The Fastest Way to a Drupal

Acquia

Here’s the plan or my ront page:

 This shows my site’s sub-pages and how my main menu will work:

 Two important choices The really important part o the products page (see below) is the list o favors–that’s what we really want to know about an

ice cream place, right? It is the result o two choices you need to understand to really be able to leverage Drupal’s power and

fexibility:

When should I make new content types and why?1.

When should I make static versus dynamic pages?2.

5/12/2018 Fastest Way to Create Drupal Website - slidepdf.com

http://slidepdf.com/reader/full/fastest-way-to-create-drupal-website 5/10

 

  The Fastest Way to a Drupal Site

Acq

Static and DynamicUnderstanding what static and dynamic pages (and blocks) areand when you should use each can help you plan and run yoursite.

Static pages and blocks - There are a ew pages or blocks onmost sites that don’t change much–like the welcome text on

my ice cream parlor’s ront page. The Drupal “Basic page” content type is perect or pages likethis. Add menu links to the main or sub-menus where visitorsshould nd them and you’re good to go.

A custom block is a great way to present short, importantinormation–like the store hours block on my site.

Dynamic pages and blocks – Building and maintainingcomplex pages by hand is laborious. You should let Drupalassemble them or you. As your site grows and changes, thosepages change or you automatically.

Some o these dynamic pages and blocks come with Drupaland its modules:

 The Blog module lists all blog posts, newest rst. I you•

have two blog authors, there’ll also be two other pages,each with a single author’s entries.

Drupal can display a page o all site content tagged with•

any given taxonomy term.

Blocks like “Recent [comments/new members/blog posts/•

gallery images]” and “Who’s new”.

Most o us can probably use a couple other dynamic pagesthat aren’t built in to Drupal. That’s where modules like Viewsand Simple Views come in. They give you a variety o poweruloptions to make the rules–called “views”–to build dynamic

pages and blocks.

Making content types work or youWhen should you create and use new content types? I use twstrategies when planning a site: organization and access.

The organization strategy – Making content types that t

your data helps in collecting, organizing and presenting it.

You could use a simple content type like “Basic page”–whichonly a title, and a body text–or everything on your site, but like throwing a bunch o colored toy blocks into an open bo

 The inormation might all be there, but it’s hard to sort t•

products rom the sta members rom anything else.

I you tag your content, you can at least leverage Drupa•

show things tagged “product” on one page, but it won’tsortable.

One product might be described one way and another•

completely dierently.

You’ll lose sales i it’s dicult or visitors to sort and•

compare your products.

Custom-tailoring (new) content types by adding numerical,text or other elds to them means no matter who adds newproducts on your site, it will be done in a standardized orma

 This also lets you take advantage o views to make dynamic,sortable products pages, while still only having to enter eachproduct a single time.

Example: The “Ice cream” custom content type on my siteincludes a name and text body plus elds like: short descript(text eld), calories per serving (numerical eld); photo (imageld); popularity; ingredients list; allergens list; etc.

The access strategy – Limit content contributors’ access to

only creating and changing content o one or more speciccontent types. Site administrators retain ull access to the baend, but restrict non-technical users, improving security andreducing administrative headaches.

Example:

 Three groups o users need to add and change content •

a school website: the school administration, the PTA, andthe ater school program.

Make a user role or each•

Make two simple content types (title and body text only•

“PTA page” and “Ater School page”, along with anything

else you need.PTA and Ater School are only assigned permissions to•

create, edit and delete pages o their own content types

School administration users are permitted to create, edi•

and delete all content and blocks on the site.

5/12/2018 Fastest Way to Create Drupal Website - slidepdf.com

http://slidepdf.com/reader/full/fastest-way-to-create-drupal-website 6/10

 

6 The Fastest Way to a Drupal

Acquia

Here are two important sub-pages, the contact page and my products page:

5/12/2018 Fastest Way to Create Drupal Website - slidepdf.com

http://slidepdf.com/reader/full/fastest-way-to-create-drupal-website 7/10

 

  The Fastest Way to a Drupal Site

Acq

Source-Interaction-Display - element by element

Planning every element o every page pays o in reduced build and

conguration 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 or the site.

Site name*, Site slogan*

SOURCE: Site administrator. Set via Conguration > Site inormation•

INTERACTION/DISPLAY: Visible in the header region by deault.•

Logo*

SOURCE/DISPLAY: Site administrator. Actually a theme element, set using the Drupal Gardens ThemeBuilder (via•

Appearance > Brand > Logo). Set your site’s “avicon” while you are there.

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

SOURCE: Site administrator. Add main menu links while creating the various pages. Add links to sub-pages as “children”•

their respective “parent” menu items. Create and congure custom Footer and Product page menus via Structure > Me> “+ Add menu”.

INTERACTION: Menu items that link to parts o 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 pla•

in the Footer rst region, Product page menu block placed in the Sidebar A region and displayed only on the Productspage via Structure > Blocks. Main menu displayed in the Navigation region by deault.

Rotating banner*

SOURCE: Site administrator. The rotating banners in Drupal Gardens are blocks. Create and congure via Structure >•

Blocks.

INTERACTION: Images can link to any URL.•

DISPLAY: Displayed by deault in the banner block on the ront page only.•

Custom blocks (Contact page message, Flavor o the month*, Store hours*, Copyright & thanks)

SOURCE: Site administrator. Create custom blocks via Structure > Blocks.•

 Theming Drupal

 This white paper does not cover developing the

look and eel o your site, known as “theming”

in Drupal (there is an article in this issue, “PSD

 To Drupal 7 Theme” that covers some Drupaltheming basics).

It would take a lot more space that I have here to

even begin to cover all o the possibilities in this

rapidly evolving area–rom in-browser WYSIWYG

tools like the Drupal Gardens ThemeBuilder

to templating languages, tools, modules, base

themes, theme amilies and systems.

Remember that we use a content management

system like Drupal to separate theming rom

unctionality. Choose a solid, fexible base theme;

make your site work right (access, dynamic pages,

links, etc.), then make it pretty.

5/12/2018 Fastest Way to Create Drupal Website - slidepdf.com

http://slidepdf.com/reader/full/fastest-way-to-create-drupal-website 8/10

 

8 The Fastest Way to a Drupal

Acquia

INTERACTION: Block texts include links to relevant pages.•

DISPLAY: Flavor o the month block placed in Sidebar A, Store•

hours block in Sidebar B, Copyright & thanks block in the Copyrightregion, displayed on all pages via Structure > Blocks. The “Gotsomething to tell us?” block is displayed in the Highlighted Contentregion on the Contact page only.

Module generated blocks*

 Twitter eed* SOURCE: Aggregator module. Site administrators•

congure the Twitter eed and “Overheard on Twitter” block viaConguration > Feed aggregator. Get the eed URLs rom youraccount page at http://twitter.com.

Mailing list* SOURCE: Mailing List module. Site administrators•

can create lists and set subscription conrmation messages viaStructure > Mailing lists.

Mailing list* INTERACTION: All site visitors can enter their name and•

an e-mail address. Site administrators can see and download allsubmissions or 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 ollowing “Publishing options” (via•

the content creation page):

Published (visible to site visitors)•

Promoted to ront page (displayed on ront page)•

Sticky at top o 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 nd us pages.•

Contact orm*

SOURCE: Site administrator. Add contact categories, admin recipient e-mail addresses, and custom auto-reply message•

the contact orm via Structure > Contact orm. Drupal Gardens adds a “Contact” menu item to the main menu by deau

INTERACTION: The “Use the site-wide contact orm” permission is given by deault to all users. Restrict access to the•

contact orm by removing the “Use the site-wide contact orm” permission rom 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.•

Drupal jargon, a micro-glossary

Attribution: sourced in part and inspired by

http://drupal.org/node/19828. See this white

paper’s “Further reading” section or links to more

reerences online.

Node - The basic unit o content in Drupal. All

nodes are o 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 o code that enables specic

unctionality on your site. Most create a set o 

permissions when activated. Some make new

blocks and menu items available when they are

activated.

Users, Permissions, Roles - The combination

o 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 have the “anonymous”

user role. All registered and logged-in users have

the “authenticated” user role and any other roles

they’ve been assigned.

5/12/2018 Fastest Way to Create Drupal Website - slidepdf.com

http://slidepdf.com/reader/full/fastest-way-to-create-drupal-website 9/10

 

  The Fastest Way to a Drupal Site

Acq

Products page favor list

SOURCE: Site administrator. A sorted view o all ice cream favors showing the teaser display (name, photo, short•

description) o the “Icecream” content type.

INTERACTION: When visitors click on the name o the favor, they are taken to its ull page.•

DISPLAY: The view is built to show Icecream nodes as teasers. Site administrators could also “expose” some o the view’s•

lters, allowing visitors to sort the view based on the exposed lters (name, popularity, dairy content, etc.).

Other dynamic pages

Sta & Events pages - built like the Products page–as a view o a custom content type. The Upcoming event on the ro•

page is a node promoted to the ront page, but not sticky at the top o lists. It also appears on the Events page.

Blog* - Blog entries, newest rst, generated by the Blog module•

FAQ* - View o FAQ item content. This content type, page and menu link are pre-congured by the Drupal Gardens “FAQ•

eature.

Pictures* - Landing page displaying all media galleries. Generated by the Gallery module that drives the Drupal Garden•

“Media Gallery” eature. Each gallery also generates a congurable preview block.

Pro tips or the roadHere are a couple things I like to remind mysel o when I am building a site:

Set these beore you start creating “real” production content. Going back and updating content later is a real hassle.•

Author and submission time display• - Decide and set or each content type (via Structure > Content types > edit) whic

ones should display this inormation (good or blog posts and press releases) and which should not (products, sta biographies, and the like). Comments on content – The same goes or which content types site visitors should be allowto comment on. Ater activating comments, set the comment permissions (post comments is the critical one) via PeoplPermissions.

Want more than a mailing list?• – You might want to know more that a name and an e-mail address. Make a powerulweborm instead to collect e-mails along with multiple choice, ree text and other kinds o questions, using the Webomodule (the engine behind the Drupal Gardens “Forms” eature.

Links• - When you add links to other pages within your site by hand, ormat the link like this: <a hre=”/contact”>Contapage</a>, Drupal will ll in the rest o your site URL or you!

5/12/2018 Fastest Way to Create Drupal Website - slidepdf.com

http://slidepdf.com/reader/full/fastest-way-to-create-drupal-website 10/10

 

10 The Fastest Way to a Drupal

Acquia

Or just go or it! Think o your Drupal Gardens site it as a living wirerame. Thanks to its site templates, eatures and ease o repeatability (you ca

copy and reuse whole sites and themes), Drupal Gardens lets you get away with a little less planning up ront and a little more

experimentation along the way. Just think “Source–Interaction–Display” every time you want to add something new.

Further ReadingI getting a Drupal Gardens site online has whetted your appetite, here are a ew great reerences 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 inormative, un, and will help you communicate more eectively wi•

other Drupalistas: http://drupal.org/node/302232

© Copyright 2011, Acquia,

Acquia, 150 Presidential W

Suite Woburn, MA 01

[email protected]

888-9-ACQ+1-978-296-5