Drupal Demo: Creating a brochure/informational site
As promised earlier I will be using an example driven approach to documenting my Drupal experiences. If you would like to follow along with these examples, you will need your own Drupal install.
- Goal: Create a company brochure/informational site using Drupal 5.x. For this example, we will use 'Aussie Helpers', a company that provides relocation/settling assistance for expatriates.
- Functional Requirements:
- The site will consist of the following pages:
- About Us
- Contact Us
- Frequently Asked Questions
- Products/services (listing, details, prices)
- The content will be provided by non-technical marketing team
- The email servers are unstable, but contact via the site has to be available at all times
- A Drupal theme has already been selected as the visual look and feel of the site
- The site will consist of the following pages:
- Technical Requirements:
- Drupal install
- Drupal modules (add-ons)*: TinyMCE, IMCE, webform
- Drupal theme*: Stylized Beuty
- Drupalspeak: The Drupal tasks accomplished during this walkthrough:
- Configuring Drupal
- Installing and configuring a contributed module
- Installing and configuring a contributed theme
* Installation steps described below
The following notation convention will be used to differentiate between navigating your file system (<folder>/<subfolder>) and navigating Drupal via a web browser (admin >> content). Implementation steps:
- Apply a the Stylized Beauty theme so as to evaluate the display/formatting of all new content
- Download Stylized Beauty
- Decompress it to <your install path>/xampp/htdocs/drupal-5.1/themes, resulting in <your install path>/xampp/htdocs/drupal-5.1/themes/stylized_beauty/*
- Change the theme being used by the site admin >> site building >> themes
- To have meaningful paths to your content (e.g. http://aussiehelpers.com.au/q=aboutus vs http://aussiehelpers.com.au/q=node/1), enable the Path module: admin >> site building, select Path and Save configuration
- Edit the site's meta data: admin >> site configuration >> site information:
Name = Aussie Helpers
Email = contact@aussiehelpers.com.au
Slogan = Experts in helping expatriates in getting settled!
Mission = To assist you in finding your new home, and getting settled in your new neighbourhood.
Footer = © 2007 Aussie Helpers
- Provide the content stubs to be used by the marketing team.
- create content >> Story
Title = About Us
Menu Settings, Title = About Us
Menu Settings, Parent Item = Primary Links
Menu Settings, Weight = 0
URL path settings = aboutus
- create content >> Story
Title = Frequently Asked Questions
Menu Settings, Title = FAQs
Menu Settings, Parent Item = Primary Links
Menu Settings, Weight = 1
URL path settings = faqs
- create content >> Story
Title = Services we provide
Menu Settings, Title = Services
Menu Settings, Parent Item = Primary Links
Menu Settings, Weight = 2
URL path settings = ourservices
- create content >> Story
Title = Concierge Service
Menu Settings, Title = Concierge Service
Menu Settings, Parent Item = Services
Menu Settings, Weight = 0
URL path settings = conciergeservice
- create content >> Story
Title = Pre-arrival Legwork
Menu Settings, Title = Pre-arrival Legwork
Menu Settings, Parent Item = Services
Menu Settings, Weight = 1
URL path settings = prearrivallegwork
- create content >> Story
Title = Pre-arrival Mailbox/Address
Menu Settings, Title = Pre-arrival Mailbox/Address
Menu Settings, Parent Item = Services
Menu Settings, Weight = 2
URL path settings = prearrivalmail
- create content >> Story
- Install the add-on for managing 'Contact Us' submissions
- Download webform
- Decompress it to <your install path>/xampp/htdocs/drupal-5.1/sites/all/modules, resulting in <your install path>/xampp/htdocs/drupal-5.1/sites/all/modules/webform/*
- Select to use the new module with your Drupal site: admin >> site building >> modules, select webform and Save Configuration
- create content >> Webform (leave fields, other than the ones below, with default values)
Title = Contact Us
Description = Submit your feedback or request for information using the following form.
Confirmation message = Your submission has been received. If a follow up is required, you will be hearing from Team Aussie Helpers soon.
Add new textfield, Name = Your name (and mandatory)
Add new textfield, Name = Your email (and mandatory)
Add new textarea, Name = Your message (and mandatory)
Menu Settings, Title = Contact Us
Menu Settings, Parent Item = Primary Links
Menu Settings, Weight = 3
URL path settings = contactus
- Enabling WYSIWYG (graphical user interface) editor use by the marketing team.
- Create the marketing user (team of one for now): admin >> user management >> users, Add user
- Install TinyMCE and IMCE for WYSIWYG editing
- Download TinyMCE and IMCE
- Decompress them to <your install path>/xampp/htdocs/drupal-5.1/sites/all/modules
- Turn the modules on: admin >> site building >> modules
- Configure TinyMCE for use by 'authenticated' users
- admin >> user management >> access control, Select access tinymce for authenticated users and Save permissions
- admin >> site configuration >> TinyMCE, create a new profile
Profile name = TinyMCE Profile
Roles allowed to use this profile = authenticated user
Default state = true
Allow users to choose default: = true
Show disable/enable rich text editor toggle = true
Editor CSS = tinyMCE Default
- Final cleanup:
- To remove the 'submitted by <user> on <date>' on your pages disable Story and Webform on Display post information on admin >> site building >> themes
- To hide the Navigation menu from site visitors (non-logged in users), change the configurations on admin >> site building >> blocks, configure Navigation, select Show block for specific roles = authenticated user.
And your final result should look like:
