Church Website User Manual

St Andrew’s, Marks Tey
Church Website
User Manual
A step by step guide to using your new
Drupal 7 church website
Richard Morgan, 2011
St Andrew’s, Marks Tey : Church Website User Manual
© Richard Morgan, 2011
ISBN 978-1-4709-4031-7
Contact
To contact Richard, use:
Revd Richard Morgan
[email protected]
www.revrichardmorgan.org
or at:
www.good-samaritan.org
For information about Drupal:
www.drupal.org
and especially:
www.drupal.org/documentation
Acknowledgements
This document is inspired by the Drupal 6 end user manual template at: http://drupal.org/node/936846
by Andrew Tuline.
Visual Quickstart Guides from Peachpit Press are great publications and provide the blueprint for the
page layout of this document. This publication is in no way meant to be comparing itself to that series in
any other way than taking inspiration for the page design.
This document has been printed by www.lulu.com [unless you are reading an electronic copy]. This offers
reasonably priced printing which makes distributing a 100 page document a much better experience in
printed manual form than a collection of loose leafs stuck into a binder. More copies can be ordered from
www.lulu.com by searching by author and title.
Copyright
This document has been created for the users of the St Andrew’s Marks Tey church website at
www.marksteychurch.org.uk. It is © Richard Morgan, 2011 and is released under the Creative Commons
Attribution-ShareAlike licensing [you can do what you like with it, but do re-distribute similarly freely] as found
at:
http://creativecommons.org/licenses/by-sa/3.0/
‘Whatever you do, whether in word or deed, do
it all in the name of the Lord Jesus Christ,
giving thanks to God the Father through him.’
Colossians 3:17, NIV
Table of Contents
Introduction:
Chapter One:
Chapter Two:
Chapter Three:
Chapter Four:
Chapter Five:
Introduction
1
Why a Church Website?
Content Types
People, comments & tags
How Drupal builds a page
Administration pages
2
4
5
6
7
Users
9
Registering for a User Account
User Account options
Managing Users
User Roles
10
11
12
14
Creating a Basic Page
17
Create a basic page
Menu Settings
Revisions
URLs
Scheduling
Publishing Options
18
19
20
21
22
23
Managing the Main Menu
25
Re-ordering the menu
Editing menu items
26
28
Articles (Blog posts)
31
Create an Article
Tags
Image
Summary
Text Formats
Comments
Authoring Information
Publishing Options
32
34
36
38
40
41
42
43
Events
45
Create an Event
46
i
Chapter Six:
Chapter Seven:
Chapter Eight:
Chapter Nine:
ii
Date
Image & Description
Options
47
48
49
Sermons
51
Create a Sermon
Event Description
Uploading Audio
Files to Download
Speaker and Series
Bible Reference
Sermon Description
52
53
54
56
57
58
59
Rotating Images
61
Create a Rotating Image
The Image
Linking to Content
Text Overlay
Managing Rotating Images
62
63
64
65
66
The Text Editor
69
Styles
Other Formatting
Links
Media, Tables & Special Characters
Pasting Content
Teaser Breaks
Other options
70
71
72
76
77
78
79
Media
81
Inserting Media
Images
Video
Files
Audio
82
83
88
89
90
Chapter Ten:
Chapter Eleven:
Managing Content
93
Editing Content
Finding Content
Filtering by Status and Type
Bulk Operations
Searching for Content
94
95
96
97
98
Term Descriptions
Where you see Term Descriptions
Editing the Descriptions
Description URLs
Chapter Twelve:
Blocks
What is a block?
How blocks are displayed
Understanding the Context
Editing blocks
Adding a new block
Chapter Thirteen:
Views
What is a view?
View Titles
Number of View Items
Chapter Fourteen:
Backing Up
Why Back Up?
How to back up
How to restore from a backup
Why and how to test a backup
Chapter Fifteen:
Emails
Site email when people register
Setting up email addresses
A new email address
A new email forward
101
102
103
104
107
108
109
112
114
115
117
118
120
121
123
124
125
126
127
129
130
131
132
133
iii
Appendix One:
Modules
Modules – Core and Contributed
Core Modules in Use
Contributed Modules in Use
Libraries
Upgrading Modules
Upgrading Drupal core
Appendix Two:
Theme
Theme settings
Logo and favicon
How a theme is structured
Page Template
Styling (css files and images)
Custom code (template.php)
Appendix Three:
Hosting
Hosting and Domain Name Hosting
cPanel
Cron Jobs
Subdomains
Addon Domains
FTP
Appendix Four:
A clean installation
Why install a clean website?
How?
Appendix Five:
Drupal Resources
Online Resources
Books
Appendix Six:
Images for the Web
Image size and compression settings
Image editors
Using Layers
Good sources of Images
iv
137
137
138
138
142
142
143
145
145
145
146
147
147
147
149
149
150
150
150
150
151
153
153
153
155
155
156
159
159
160
160
160
Appendix Seven:
Appendix Eight:
Audio for the Web
163
163
164
Writing for the Web
167
Page length
Writing style
Appendix Nine:
Appendix Ten:
163
Audio file size
Audacity
Settings for sermon audio
167
167
Feeding Facebook
169
Setting up TwitterFeed
169
Training Users
Exercise Sheets
171
171
v
i
Introduction
In This Chapter
Why a Church Website?
Content Types
People, comments & tags
How Drupal builds a page
Administration pages
2
4
5
6
7
This manual introduces you to using your
new church website. You will learn how to
create and manage the content that makes
up the site. Each chapter will take you
through the basics of the various tasks
involved in this role.
This introductory chapter will introduce
you to some of the principles involved in
managing the website. You will find
understanding some of these basic concepts
helpful in learning the specific tasks you
will be responsible for.
1
Introduction
Why a Church Website?
Before you start adding content to a church
website, it’s worth taking a moment to
think of who it is there for and what it
ought to achieve. There are two broad
categories of visitors to your website –
those who are members of the church
already and those who are not members.
Their needs are different, but a website
that is catering well for existing church
members will also communicate to
someone checking out the church online
that the community is thriving and active.
Conversely, a website that is making the
effort to communicate information about
the church clearly and effectively to nonmembers will avoid pitfalls like
advertising: ‘next Alpha course starts on
Tuesday’ without explaining what an
‘Alpha Course’ actually is. This means that
it will also be communicating well with
members.
There are at least the following reasons
why people will visit your website:
 People visiting a church for the first
time visit its website first. They need
to know where you are and what time
to turn up. They will want to get some
kind of impression about what the
worship service will be like and what
kind of community of people you are.
They may well be interested in what
the church provides for their children.
 Some people will visit the website
looking for specific information. Can I
get married here? What is the Rector’s
phone number / email? How do I
arrange for my child to be baptised?
I’ve seen the national Alpha
advertising; are you running a course
here?
2
 Church members will want to listen to
a sermon again, or catch up on one
they have missed.
 Members will want to check up on
information that they have forgotten
(What were the dates of the holiday bible
club?).
 Members will visit if they’ve been told
that there is information there that
they are interested in. [‘I’ve posted my
notes from the annual general meeting
online…’, ‘There’s a new newsletter from
Nepal online…’]
(These are some of the reasons. It would be a
good exercise to get out a piece of paper and
write out a list of other reasons people might be
visiting.)
Your role will be to make sure that the
needs of these different types of visitor are
well catered for.
 First of all, the church website must be
a good brochure for the church. Think
about the content you write and the
images you post carefully – does the
impression they create accurately and
effectively describe the church?
 You should anticipate the kind of
information that people may be
looking for and make sure that you
provide it clearly and make it easy to
find.
 Events, news and sermons should be
posted regularly and kept up to date.
Content Management
To meet the needs of the various visitors to
your website, you will need to post various
different types of content and make sure
they are kept up to date. The content needs
to be displayed in the right place and
removed when it is no longer relevant (it
Introduction
looks bad when you visit a church website that
is still advertising its Christmas services at the
beginning of January).
The task of managing this content is made
much easier by a ‘content management
system’. A well-known example of a system
that manages content is Facebook. You
type in a message, add a link or upload a
photo and Facebook takes care of the rest.
It chooses where and how (and to whom)
those items are displayed. The system that
manages the church website (called
‘Drupal’) is a bit like this – you add the
content and Drupal will take care of how
and where it appears on the website. If you
can add and delete posts and images from a
Facebook page you will be able to use your
new church website.
Your website has been customised for you.
Its appearance and functionality were
decided in the process of creating a theme
(a set of templates) choosing modules (a set
of functionality) and configuring the
various available options.
As you use the website, you are responsible
for creating and updating the content.
Drupal will take care of how that is laid out
in a page and make a lot of decisions about
what is presented and where. If you create
an article it will display it at the top of the
list of articles as the most recent one; if you
add a sermon it will show that by date
order; if you create an event Drupal will
automatically stop displaying it once the
event has happened.
What is Drupal?
Your website is powered by a ‘content
management system’ called Drupal.
Drupal powers literally millions of
websites. Among countless others, it is the
system used to power the websites of
Amnesty International and the White
House. Many churches use Drupal – in the
UK a few examples would be Holy Trinity
Brompton Church in London
(www.htb.org.uk), Woodlands Church in
Bristol (www.woodlandschurch.net) and St
Paul’s Church, Salisbury
(www.stpaulssalisbury.org).
If you look at those websites you will see
that Drupal is completely customisable. It’s
customised with templates that define the
appearance of the pages, and modules that
add different functionality (like that rotating
banner image on the front page). No two
Drupal websites need look or feel like one
another.
3
Introduction
Content Types
When you add content to the site, you have
to choose a type of content to add. There
are five choices:
 Basic Page
Pages of information about the church.
These should go in the ‘About’ section
of the website. Don’t use basic pages
for news or for listing events – there
are different content types for that.
 Article
This is for news items or ‘blog’ entries
[from ‘web log’]. All ‘Articles’ will be
displayed in the ‘Blog’ section by date
published. The most recent will be also
be shown on the front page.
Figure i.1 The ‘add content’ screen in Drupal.
You simply click on the content type that you want to
add.
 Event
Events coming up. These are displayed
in the ‘Events’ section in date order
and disappear once the event has
happened. The next events that are
happening are also displayed on the
front page.
 Rotating Image
The front page has a rotating image
banner at the top. This creates some
visual interest, and is a great place to
put a few slides which will advertise
the church effectively, as well as
promote anything about to happen.
 Sermon
Details of sermons which you can
attach audio and text files to. These
can be sorted by preacher or by
Sermon Series.
4
Figure i.2 The front page of the website is
compiled from the most relevant content of each type.
The welcome text is in the ‘Basic Page’ type; there is
a ‘Rotating Banner’ top right; underneath this items
are the most relevant ‘Articles’, ‘Events’ and
‘Sermon’ content. Note, especially with sermons that
you don’t have to separately enter ‘Sermons coming
up’ from ‘Most recent sermons’ – Drupal knows
what the date is today and can intelligently display
both these things from one set of data.
Introduction
People, comments & tags
Tags
Drupal stores the content that you enter in
a database. As well as storing the piece of
content, it also remembers the person who
created the content, comments made about
the content and tags that label and help to
categorise the content.
Drupal provides a rich system for
categorising your content. If you ‘tag’ an
article with a word of phrase (‘children’ for
example), then that tag appears beneath the
article. Clicking on the tag will bring up a
list of all articles that share that tag. You
can see that you will want to keep tags
fairly general in scope so that they can be
of used to tag several articles (how many
articles will you really publish which will all be
tagged ‘New Wine Summer 2011’? On the
other hand the tag ‘New Wine’ might apply to
a number of articles).
People & roles
Every piece of content has an author. In
order to create content you must be
registered and ‘logged on’ to the website
and have been given a role which allows
you to publish content. Once a user has
registered and been authorised they can
comment on existing articles. In order to
create content themselves they must be
given the role of an ‘editor’. To be able to
allocate user roles, or to carry out a
number of other functions you must have
the role of ‘administrator’.
Comments
This classification system (or ‘taxonomy’)
is broader than just tags for articles.
Several ‘vocabularies’ have been set up just
for the Sermons content type – to tag
sermons according to Speaker and Series,
and also by type of event (i.e. Communion,
All Age Worship, Service of the Word). This
makes it easy for the website visitor to
quickly find a list of all sermons by a
particular preacher, or all the sermons in a
particular series.
Every piece of content can, in principle,
have comments attached to it. In reality
this is switched off for everything apart
from articles. To prevent spam on the site
every person who wishes to comment must
be registered. Every registration must be
approved by an administrator. It’s also
possible to set the permissions so that
every comment must be approved before it
is visible on the website; but if the
comments are restricted to registered users
it is unlikely that you will want to exercise
that degree of censorship. Editors and
administrators can in any event remove
other people’s comments if something was
posted that was inappropriate.
5
Introduction
How Drupal builds a page
Drupal builds all of its pages from a single
page template that defines the layout of
every page on the site. This page template
consists of a number of regions where
content can be shown – a header, the main
content area, a sidebar, a banner area &
three panels (only used on the front page)
and a footer with two regions (on the left
and right).
Regions, Content and Blocks
The main content of each page is displayed
in the main content region in the middle of
the page. This will either be a single ‘node’
[an event, sermon, page or article] or a list
of ‘nodes’ – for example, the list on the
main ‘blog’ page. The webpage address (or
‘url’) defines what is displayed in this main
content region.
Figure i.3 The home page consists of a header
(where the logo and the main navigation is), a main
content region (on the front page just the small space
with the welcome text) and a number of regions
holding various blocks of content. The banner region
holds the banner image block, the three panel regions
hold blocks displaying recent blog items, events
coming up and information about sermons. Notice
how in the third panel region there are two separate
blocks – the ‘Next Service’ block and the ‘Most
Recent Sermon’ block. At the bottom of the page (not
visible in this illustration) is the footer and the blocks
of content that belong there.
The other regions of the page can contain a
variety of different ‘blocks’ of content.
These ‘blocks’ are displayed according to
context. The basic sections of the site
(home page, about, blog, events and
sermons) are each a different context.
Drupal knows what the context is and
displays relevant blocks accordingly. For
example, the ‘services coming up’ block
displays in the sermons context and the
events context, but not in the blog context.
You won’t usually need to think about
what content goes in the blocks – Drupal
organises this for you. Your task is to
supply the site with the right content.
Drupal takes care of how it is displayed.
6
Figure i.4 The ‘Popular Tags’ and ‘Recent
Article’ blocks are shown in the Sidebar region of the
list of articles page and every individual article page
in the Blog context.
Introduction
Administration Pages
Figure i.5 Admin pages are displayed as an
overlay on top of the website. Notice the two menu
bars at the very top of the page that appear when you
are logged in as an administrator or editor.
Figure i.6 Content can be edited simply by clicking
on the ‘Edit’ link that appears once you are logged
in. The editing is then done in an overlaid window
like the one above.
Figure i.7 Blocks of content, and content items in
lists can be edited by hovering over the gear icon and
choosing ‘Edit’. The number of different things that
you are able to edit this way will depend on the role
you have been given and the editing permissions
allocated to that role.
Once you are logged in you will be able to
access various administration pages. These
contain forms that allow you to add and
manage content, comments, users and
taxonomy (classification / tags). If you have
administrator privileges you will also be
able to configure many different options on
the site, such as which blocks appear
where, or what options appear on the rich
text editor for editing text content.
If you do have the administrator privileges
that allow you to alter much of the
functionality of the site can I strongly
suggest that you exercise caution before
changing something that you then cannot
remember how to change back.
The admin pages usually display as an
overlay on top of the website. You can
access them from the menu that appears at
the top of the website when you are logged
in with the right permissions. The content
editing pages can also be accessed from the
content itself – either as a tab above the
content, or by hovering over the ‘gear’ icon
which appears when you hover over a piece
of content.
7
1
Users
In This Chapter
Registering for a User Account
User Account options
Managing Users
User Roles
10
11
12
14
Before you can edit the website you need to
be registered and have the necessary
permission to create and manage content.
This chapter will talk you through that
process and also explain about the different
roles and permissions that users of the
website can have.
If you have administrator privileges you
will also be able to approve registrations
and assign roles and permissions to users.
Skip this part of the chapter if you know
that you will only be using the ‘editor’ role
on the website.
9
Chapter One
Registering for a User
Account
To register for an account:
1. Click the login link (at the bottom
centre of the footer).
2. Choose the ‘Create new account’ tab.
Figure 1.1 The ‘Log In’ link is at the bottom of
the footer in the center.
3. Choose a Username and an email and
submit the form (press the ‘Create new
account’ button).
4. Check your email – if the site is set up
to require an administrator to approve
every account it will let you know this;
ask someone who has administrator
privileges to get on and authorise your
account.
5. Once your account is approved, you
receive an email with a log in link.
Once you access this link you must set
a password for your account.
Figure 1.2 You arrive at the ‘Log In’ page for an
existing account. If you don’t have an account, you
need to select the ‘Create new account; tab at the top
left.
 Tips
 Your user name will be the name that
is displayed underneath articles that
you post. You are strongly advised to
use your real name (Firstname
Lastname) as your username.
 If you forget your password, you can
get the system to email you another
one to the email address you gave.
(The ‘request new password’ tab on the log
in page.)
10
Figure 1.3 Your Username is going to appear
underneath any articles that you post. Please choose a
sensible username (real names are best).
Users
User Account Options
Everyone can edit their own user account,
and administrators can edit any account.
The most important account option is for
users to keep their email addresses up to
date.
Figure 1.4 Once you are logged in there is a new
menu at the top right of the header – which allows
you access to your account settings and to logging
out.
To change email or password:
1. Choose the link from the top right of
the main administration toolbar which
says: ‘Hello {your name}’.
2. Choose the edit tab.
3. Change your password and email
address as required.
4. Submit the form. (Press the ‘Save’ button
Figure 1.5 Once you have editor or administrator
privileges you also see a top black admin toolbar (and
a grey shortcut toolbar beneath it). The link to your
account (and the log out link) are also here.
at the bottom.)
 Tips
 From this point on the manual
assumes that you have at least the
‘editor’ role on the site. If not, you
won’t see the top administration menu
bars on the website. Get someone to
authorise you as an editor or an
administrator.
Figure 1.6 Your account page has two tabs –
‘View’ which you arrive at, and the ‘Edit’ tab.
 It’s possible to have the site display a
user picture next to each article or
comment. You upload these here.
 Leave the administrative overlay and
locale settings where they are.
 Note that the ‘view’ and ‘edit’ tabs look
different in the administrative overlay
from the normal web view. They are
the same links though.
Figure 1.7 The edit tab brings up an overlaid
form where you can change your details.
11
Chapter One
Managing Users
If you have the ‘administrator’ role you will
be able to enable (or block) user accounts
and give users ‘editor’ or ‘adminstrator’
roles.
To edit a user’s account:
Figure 1.8 The administration and editing options
are accessible from the top black toolbar. The more
commonly used options are also all in the grey
shortcut bar beneath it. ‘People’ brings up a list of
people.
1. Choose ‘people’ from the top admin bar
– or from the ‘shortcut’ bar beneath it
(they are the same link).
2. Choose ‘edit’ for the person that you
want to manage.
 Tips
Figure 1.9 The ‘People’ administration page
(displayed as an overlay on top of the website).
 You can also authorise and assign
roles to users directly from the list
page by ticking the users you want to
manage and using the ‘Update
Options’ drop down.
 You can create a user here using the ‘+
Add User’ button at the top of the
page. You can then create an account
for a new user and ask the system will
send them an email with their details.
Figure 1.10 The far right column present an ‘edit’
link for each user. Here you can set the role for each
user.
You can get straight to a user with a url
(‘Uniform Resource Locator’ i.e. the address of
the webpage) in the form ‘users/{username}’
where {username} is the name of the user in
lowercase with spaces replaced by the ‘-‘
character. To get straight to the edit page,
add ‘/edit’. So to get to the edit page for
Joe Bloggs, type the url ‘users/joebloggs/edit’ into the address bar.
Figure 1.11 If you check some of the users (here
‘Revd Richard Morgan’) you can perform any of the
available ‘Update Options on all the accounts that
you have checked.
12
Users
Figure 1.12 The user edit page. Beneath the
username and password details are ‘Status’ and
‘Roles’ options.
If the website is set to require an
administrator to approve new user
accounts, an administrator will need to
approve each account that someone signs
up for. The website will send an email to
the email address that is set up for the
website [at: ‘admin/config/system/siteinformation’] to let you know that a user
has signed up and would like to be
authorised.
To authorise an account:
1. Go to the edit page of the person you
want ot authorise.
2. Under ‘Status’ select ‘Active’ rather
than ‘Blocked’
3. Save (at the bottom of the page).
 Tips
Figure 1.13 If the user has not been authorised
‘Status’ will be ‘Blocked’. It won’t matter which
roles have been allocated – the user will not be able to
log in.
 If you want to allow users to register
without requiring approval you can
change this option at the url:
‘admin/config/people/accounts’ or by
choosing ‘Configuration’ from the
admin bar, then ‘Account Settings’ in
the ‘People’ section. This is also where
you change the text of the emails that
get sent when users register or apply
for a new password.
 Make sure that the email at
‘admin/config/system/site-information’
[or: choose ‘Configuration’, then ‘Site
information’ from the ‘System’ section]
belongs to someone who is generally
available and willing to respond to
administration requests for the site.
13
Chapter One
User Roles
Every visitor to the website is allocated a
role (or roles). Before a user logs in they
are given the role ‘anonymous’. Once they
have logged in they are given the role
‘authenticated’ and any other roles that
they have been allocated.
The Drupal permissions system allocates
permissions for each role, which define
what each role is able to do. The church
website has been set up with the following
roles:
Figure 1.14 The Admin and shortcut toolbars for
an editor. Editors will not be able to edit user or
configure any of the options on the website. They
have very wide ranging permissions for editing
content. The ‘authenticated’ user doesn’t have either
of these toolbars at all – but they will be able to
comment on articles.
 The anonymous visitor can view all of
the available content.
 The authenticated user can comment
on blog articles and change their own
email and password
 The editor can create, edit and delete
all of the content on the site. That’s a
pretty powerful role. They can’t
manage users or edit blocks (the
regions of the page other than the
main content region).
 The administrator can do everything
that the editor can and also is able to
manage users and edit blocks. They
can also change virtually every aspect
of the site configuration.
You need to decide who should be editors
and administrators. One way to distribute
these roles would be to make everyone who
has been on a full day’s training an
administrator, and everyone else you’d like
to manage content on the website an
editor.
14
Figure 1.15 The Admin toolbar for an
administrator has a lot more options – allowing any
aspect of the site whatsoever to be configured. While
it is worth making sure that anyone who is given the
‘administrator’ role is properly trained and reliable
(they can really mess things up); it is also worth
noting that while editors have many fewer
permissions they can still delete every piece of content
on the site should they press a few wrong buttons.
The real advantage of restricting people to the
‘editor’ role is that you don’t overwhelm them with
options.
Users
To allocate roles:
1. Go to the edit page of the person you
want to allocate a role to.
2. Under ‘Roles’ tick the role you want to
allocate.
3. Save the change (bottom of the page).
 Tips
Figure 1.16 Assigning people roles is as easy as
putting a check in front of the role in the list. The
‘authenticated user’ role can not be unchecked. If you
want to remove the ability of someone to comment on
the site, don’t try to remove this role – simply mark
them ‘Blocked’ in the status section.
Figure 1.17 The ‘Permissions’ tab of the People
page. Permissions are not granted to individuals but
to roles. If you want to let one or two individuals
have slightly more permissions that a standard
editor, you need to create a new role (in the roles sub
menu item) and then assign the permissions to that
role, and that role to the people you want to give the
permissions to.
 Administrators don’t also need the
editor role, because they already have
all the editor permissions allocated to
them. However, if you set up more
roles with finer-grained permissions
you can give people a mixture of
permissions by allocating them a
mixture of roles (for instance ‘blogger’
and ‘sermon uploader’ could be new roles
which would only permit those specific
tasks).
 The permissions tab of the ‘People’
page is where you set which
permissions each role has and create
new roles. The permissions for ‘editor’
and ‘administrator’ have been set when
the site was set up and should not need
to be changed. If you wanted to create
a new role, (say people who can upload
audio, but are not allowed to edit
content) then create it here, and under
the permissions tab add only the
permissions that role needs.
15
Creating a Basic Page
In This Chapter
Create a basic page
Menu Settings
Revisions
URLs
Scheduling
Publishing Options
18
19
20
21
22
23
2
The bulk of this manual will talk you
through creating various types of content.
Each content type is created and edited in
much the same way, so future chapters will
build on the basic knowledge presented in
this chapter.
We’re going to learn how to create a very
basic page. We’ll also allocate it a menu
item which will link to it and place it in the
‘About’ section of the website.
We’ll learn how to re-order the menu
items in the next chapter.
Creating pages with richer content (links,
headings, lists, bold, italic etc…) will be
explained in Chapter 8 (‘The Text Editor’).
Inserting Images, Video and other media
into the text is explained in Chapter Nine
(‘Media’). If you can’t wait, do skip ahead
once you have read this chapter to learn
about this functionality. Otherwise we will
go through the different content types one
at a time before covering the text editor
options.
17
Chapter Two
Create a basic page
Creating content couldn’t be simpler. All
content must have a title, but that’s all. To
create our first page we’ll do just that –
create a page with only a title.
To create a page:
1. Choose ‘Add content’ from the
shortcut bar. [Or, you can choose
‘Content’ from the main admin bar, and
then ‘+ Add Content’ from the top of that
page.]
Figure 2.1 The ‘Add content’ page from where you
choose which type of content you would like to add.
This chapter takes you through creating a ‘Basic
page’ – the first of these options.
2. Choose ‘Basic page’
3. Type a title (say ‘Trial Page’) into the
title field.
4. Save
That’s all there is to it. You now see the
new page (with just a title), and an address
has been created for it (in the address bar,
something like: ‘sitename/about/trial-page’).
We want to have more content that just a
title on the page, so next we’ll edit it.
To edit a page:
1. Choose the edit tab.
2. Make some changes. (i.e. enter some
content in the ‘Body’ field)
3. Save
To delete a page:
Choose delete at the bottom of the edit
page.
18
Figure 2.2 Once you are logged in with the right
permissions each main piece of comment will have
‘View’ and ‘Edit’ tabs above it. Choose ‘Edit’ to edit
any piece on content on the site.
Creating a Basic Page
Menu Settings
The page you have just created has a URL
(address). This means that you can now
view it from anywhere in the world that is
attached to the internet just by typing that
URL into a web browser.
Figure 2.3 At the bottom of the content editing
page are a section of horizontal tabs which control a
variety of options. The first of these is ‘Menu
settings’. Once ‘Provide a menu link’ is checked, the
rest of the options slide down.
It’s a bit useless on the website, though,
unless it appears as a link somewhere –so
we’re going to give it a menu link. Basic
pages should be used for the ‘About’
section of the website, so for this example
we’ll put it there.
To add a menu link:
1. Edit the page
2. Underneath the body field is the
‘Menu settings’ option. Check the
‘Provide a menu link box’ and more
options appear.
3. Alter the title if required (the text
displayed as the menu link) and add a
description if you would like to.
4. The ‘Parent item’ is the most
important field here – choose ‘About’
5. Save
You might now like to click on the ‘About’
section of the website to see your new
menu item in the sidebar.
 Tips
 You can safely ignore the ‘weight’
option – it’s easier and more reliable to
order the menu items in the way you’ll
learn in the next chapter.
19
Chapter Two
Revisions
If you update a page you may want to keep
track of the old version of the page so that
you can keep a record of changes and
revert to the old version at a later point if
required.
To create a revision of the page:
Figure 2.4 The next tab down is the ‘Revision
information’ tab. To create a new revision just check
the check box here before hitting ‘Save’ at the bottom
of the page.
1. In the edit page, choose ‘Revision
information’.
2. Check ‘Create new revision’
3. Save
You are now working on a revision of the
webpage, and there is a new tab marked
‘revisions’. You can only ever edit the
current revision, but you can view the old
revisions by clicking on the revision date in
the list on the revisions tab.
Figure 2.5 Once a revision has been created, a new
tab appears – ‘Revisions’.
To revert to a previous revision:
1. Choose the ‘Revisions’ tab
2. Click ‘revert’ for the revision you want
to go back to.
 Tips
 ‘revert’ actually creates a new revision
that is a copy of the revision you are
going back to. You don’t need to
worry about losing the original once
you start making changes to it.
20
Figure 2.6 The revisions tab lists the revisions and
gives you the option to revert to a previous version.
When you revert to a previous version, what you
actually do is create a brand new revision that is a
clone of the one you are ‘reverting’ to. This means
that once you create a revision you retain a
permanent record of the previous revisions unless you
choose to delete them.
Creating a Basic Page
URLs
Figure 2.7 The next tab – ‘URL path settings’.
The module ‘pathauto’ will create automatic URLs
for you. When ‘Automatic alias’ is checked, the URL
alias field is greyed out. To override the automatic
alias just uncheck ‘Automatic alias’ and you will be
able to enter whatever you like the ‘URL alias’ field.
Good URLs look good in the address bar
and are also helpful for advertising
information on the site. [For instance, in a
parish noticesheet: ‘Go to
www.marksteychurch.org.uk/alpha for more
information’.] They can also help locate the
user within the site [i.e. all sermons have the
address /sermons/{title}].
Drupal will create a sensible URL for you.
The page you just created was given the
URL: ‘about/{page-title}’. Often that will
do just fine. Sometimes, however, you will
want to override what Drupal chooses (for
instance to have ‘/alpha’ rather than
‘about/alpha’.
To override the default URL:
1. Edit the Page
2. Choose URL path settings
3. Uncheck ‘Automatic alias’
4. Fill in the URL alias you want
5. Save
 Tips
 If you use short URLs be very careful
not to use something that is already in
use.
 The URL you enter is always an ‘alias’.
The real URLs in Drupal are
something more like ‘?q=node/134’.
The systems translates your ‘alias’ into
something Drupal can understand
behind the scenes.
21
Chapter Two
Scheduling
By default pages are published as soon as
you hit save and they remain published
until you change that.
Sometimes you might want to delay a
page’s publication, or have it automatically
unpublished. You use the scheduling
options to do this.
Figure 2.8 The ‘Scheduling options’ tab. (We will
consider the ‘Comment settings’ tab in chapter 4 – on
Articles). You can set a time to publish and/or a
time to unpublish.
To schedule (un)publishing:
1. Edit the page
2. Choose ‘Scheduling options’
3. Set the date and time for publishing or
unpublishing (or both). You must fill
in both the date and the time in the
format described on the form. Use a
time of 00:00:00 if you want it to start
at the beginning of the day
4. Save
 Tips
 You can also schedule rotating banner
images. This is especially useful if you
use those for promoting events.
The site updates itself by running an
updating script periodically (called ‘cron’).
The (un)publishing will not occur at the
exact time you schedule it, but at the first
time cron is run after the time you specify.
(Cron has been set up for you to run once an
hour – see appendix 3 for more details.)
22
Figure 2.9 In the ‘Content’ page (admin bar at the
top – or ‘Find Content’ in the shortcut bar) there is a
tab for ‘Scheduled’ items. This will show you a list of
content which has been scheduled and its publish and
unpublish dates.
Creating a Basic Page
Publishing options
As well as scheduling a page to (un)publish
automatically, you can (un)publish it
manually using the ‘Publishing options’
section.
Unpublishing a page will also remove any
menu links from the menu (they will
automatically reappear when you re-publish the
page).
Figure 2.10 The last available tab is ‘Publishing
options’. Pages are published by default. If you
uncheck ‘published’ then you will need to be logged in
to see the page, and it will no longer appear in the
menu, if you have set a menu item.
‘Promoted to front page’ and ‘Sticky at top of lists’
will have no effect on basic pages.
To unpublish a page:
1. Edit the page and choose ‘Publishing
options’.
2. Uncheck ‘Published’
3. Save
 Tips
 This is a good way to work on drafts
of a page before publishing it on the
website. Other editors who are logged
in will be able to visit the URL of the
page you have created but it will not
be visible in the menu, or at all to non
logged in visitors.
 If you want to circulate a draft to
people without a log on, you can
simply leave the page published, but
uncheck the menu link option in Menu
settings. A non logged in visitor can
see the page, but there is no link to it
from the website.
 The ‘Promoted to front page’ and
‘Sticky at top of lists’ options have no
effect on Basic Pages.
23
Managing the Main Menu
In This Chapter
Re-ordering the menu
Editing menu items
26
28
3
The top level items of the main menu are
the section headings: ‘About’, ‘Blog’,
‘Events’, ‘Sermons’. The ‘Home’ page is
reached by clicking on the logo. You can
also switch the ‘Home’ page menu item
back on so that the sections read ‘Home’,
‘About’…
In the ‘About’ section there is also a menu
block on the left which shows menu items
beneath the ‘About’ section heading. If
these second level menu items have items
beneath them, they have a little arrow to
the left of the menu item to indicate that
the menu item has sub-items. They can
either be expanded by default, or will
expand when that menu item is chosen.
The currently active menu item in the
menu block is underlined to indicate where
the user is within the section.
You can re-arrange the menu items
however you like, and use the same menu
editing page to edit the individual menu
items (for convenience - rather than editing
them from within the page that they belong to).
25
Chapter Three
Re-ordering the menu
We learned how to create menu items
within the form for creating and editing
pages.
What if you want to re-arrange the order
in which these menu links are shown?
To re-order items in the menu:
1. Click on ‘Manage main menu in the
shortcuts menu bar.
2. Drag the menu item you want to
move. Drop it in the place in the menu
you’d like it moved to.
3. Save
Figure 3.1 The ‘Main menu’ admin page that you
get to from the ‘Manage main menu’ link. To drag
menu items up and down, click and drag on the little
cross shaped icon to the left of the menu item names.
Remember that once you have rearranged them you
must press ‘Save’ at the bottom of the form.
 Tips
 You can also access this admin page
from the contextual link when you
hover over the menu block. Choose
‘list links’ not ‘edit menu’.
 Different levels of the menu are show
by indentation. If you drag ‘About’
(which has many sub items) you drag
all the sub-items with it. Play around
with dragging menu items, but
remember not to press ‘save’ (you can
get back to where you started just by
reloading the page).
 You can also drag menu items left and
right to change the level at which the
item appears in the menu. Again, this
is best discovered by playing with it.
Make sure not to save your changes!
26
Figure 3.2 When you hover over the sidebar menu
a little gear icon appears – this is the ‘contextual
link’ icon. Click on the gear and the contextual links
appear in a drop down (as in this image). Choose
‘List links’ to rearrange the menu items. The item
‘Edit menu’ will allow you to change the menu’s
name – which is not what you want to do.
Managing the Main Menu
Figure 3.3 You can see that ‘Bek’s Group’ and
‘Water’s group’ are indented from ‘Networks’ and
‘Children’s Church to indicate that these third level
menu items. They will not be displayed by default,
unless ‘Networks’ is in the active menu trail (i.e.
either ‘Networks’ or one of its sub pages is the
current page).
Figure 3.4 You can see that when ‘Children’s
Church’ is the active item, the sub-items of
‘Networks’ are hidden. The little arrow to the left of
‘Networks’ now shows horizontally, indicating that
there are sub menu items, but that they are not
displayed.
 ‘Second level’ menu items are the ones
that appear in the ‘About’ Menu block.
‘Third level’ links appear as sub-links
(‘children’) to these items, and are not
displayed by default unless their
parent item is selected. As long as the
user is in this parent’s part of the menu
(i.e. the parent is in the ‘active-trail’)
these sub links will show. You can
change this behaviour to show them
always expanded (see the following
page).
 ‘Fourth level’ items are not displayed
at all. They will however place a page
within this section of the site and so
ensure that the menu is shown on the
left hand side, and their ‘parents’ in the
active trail will be expanded.
 If you want a page to be in the ‘About’
section but not to show in the menu,
you should still put it in the menu, but
disable it (see how on the following page).
If you don’t, ‘About’ won’t be in the
active trail and the menu block on the
left hand side will not be displayed. [If
it’s naturally a 4th level link, there is no
need to disable it – the user won’t see it in
any case.]
 Second level links are only set up to be
displayed within the ‘About’ section.
To change this behaviour, you would
need to add the ‘menu-block’ block to
the sections in which you want to
display this block. This is a reasonably
advanced topic, and is covered briefly
in chapter 12.
27
Chapter Three
Editing menu items
From the same menu admin page, you can
also edit the individual menu links by
clicking on the edit link. This is mostly the
same as editing the menu item from the
content editing page, with the exception
that you can also choose whether to ‘show
as expanded’. If you check this, the third
level ‘children’ items will always be shown
expanded.
To edit a menu item:
1. Choose ‘Manage main menu’ from the
shortcut admin bar.
2. Choose edit for the item you want to
edit.
3. Change the title and description to
suit.
4. Save
 Tips
 The title should be short but
descriptive.
 The ‘description’ is text that will be
shown when the user hovers their
mouse over the menu item. Keep these
short, but use them to provide a little
more information about where the link
will take the user.
 You don’t need to enable and disable
menu items from this screen – you can
do it from the main menu admin
screen. Similarly, it’s much quicker to
change ‘parent item’ and ‘weight’ by
the drag and drop method of the
previous page.
28
Figure 3.5 The ‘Edit menu link’ page. The options
are the same as with the Menu link tab in the content
editing page, except that you can choose ‘Show as
expanded’ to force sub items to be shown even when
their parent is not in the active menu trail.
Managing the Main Menu
When you disable a menu item, the menu
item will disappear. The page is still there,
though, and accessible to the user from the
address bar (by typing in the URL).
If you look on the main menu admin page,
the ‘Home’ link is disabled. [The home page
is obviously still there though – and accessible
through clicking on the logo.] Try enabling
this to see the effect on the main admin
menu.
Figure 3.6 The easiest place to enable and disable
menu items is from the checkboxes on the main menu
page. Remember that once you have checked or
unchecked your options, these are not effective until
you press ‘Save’ at the bottom of the page.
To enable / disable menu items:
1. Choose ‘manage main menu’
2. Check or uncheck to item you want to
enable or disable.
3. Save
 Tips
 You can also delete menu items from
this page. This will not delete the
content – just the menu link that
points to it. You will usually want to
disable a link rather than delete it.
 Links can be added from this screen
(the ‘+ Add link’ at the top). You
would use this to add external links to
the menu. It is very strongly advised
not to do this, as users will expect
links within your menu system to take
them to pages within your site.
Instead, if you want to add links to
other websites, create a ‘links’ page,
and list them there.
29
Articles (Blog posts)
In This Chapter
Create an Article
Tags
Image
Summary
Text Formats
Comments
Authoring Information
Publishing Options
32
34
36
38
40
41
42
43
4
A blog (from ‘web log’) provides a stream
of posts listed in reverse date order of
publication. Your ‘wall’ on Facebook is just
this. In fact it is very easy to set up a
service to automatically ‘cross-post’ every
article posted on the church website to a
church facebook page (see Appendix 9 –
‘Feeding Facebook’).
If you’re going to have a ‘Blog’ section on
the website you must contribute ‘articles’
to it regularly. [Otherwise – switch it off,
which is most easily accomplished by simply
disabling the ‘Blog’ menu link.] Think about
whether this is something you want to
commit to.
Don’t be distracted by the name ‘Article’
for this content type. You could post:
 Just a link to something you read
online or a YouTube video you saw.
 Upload a file and provide a link to it i.e. minutes of a meeting.
 News from mission partners.
 A set of photos from an event.
 A leading article from the parish
newsletter.
 A good thought you had today.
 Absolutely anything else you’d like to
that keeps people up to date.
31
Chapter Four
Create an Article
You create an article just the same way as a
regular page.
To create an article:
1. Choose ‘Add content’ and then ‘Article’
2. Fill out the Create Article form
3. Save
Articles are very like basic pages, but have
a couple of new fields – ‘Tags’ and ‘Image’
and are displayed in lists on the site rather
than requiring a menu to find the article.
Tags allow users to search for other
articles where the content is related. The
‘image’ field allows a large image to be
shown at the top of an article, while a
smaller version of the same image is shown
on the list of articles (‘blog’) page.
Figure 4.1 Articles are shown in a list on the
‘Blog’ page of the website. You get to the main
article page by clicking on the title. If the article is
too long to be shown in full in the list, there is also a
‘Read More’ link which takes you to the full article.
Articles are displayed in a list on the ‘Blog’
page, but the most recent articles are also
displayed on the home page. You can
control whether articles will show up on
the front page or not.
Articles are also displayed with
information about their author and when
they were published. The author name is
the website username for that author –
which is why people should use their full
names when they create user accounts.
The rest of this chapter talks you through
these options.
32
Figure 4.2 Clicking on a ‘tag’ – either beneath an
article, or in the list of popular tags in the side bar
produces a page with a list of articles which share
that tag.
Articles (Blog posts)
Editing Articles
You edit (or delete) articles the same way
as pages; you can also get to their edit page
from the contextual links within a list of
articles.
Figure 4.3 In list view, you can go straight to the
article editing page, by using the contextual link
(hover over the article and then click on the gear that
appears and choose ‘Edit’).
The rest of the chapter will assume that
you are within the ‘create article’ or ‘edit
article’ form.
To edit articles (like pages):
1. Find the article in the list on the ‘blog’
page.
2. Click on the title of the article you
Figure 4.4 From the full article page, you choose
the ‘Edit’ tab just as you would do for basic pages.
want to go to the main article page.
3. Click on the ‘edit’ tab
To edit articles (quicker):
1. Hover over the article and click on the
contextual links gear widget.
2. Choose ‘Edit’
33
Chapter Four
Tags
Tags are displayed under articles and if
you click on them they bring up a list of all
articles with that tag. The most popular
tags are also displayed in a block on the
right hand side of the blog pages. By
tagging articles sensibly, you allow visitors
to quickly find related content.
You can have as many tags as you like
attached to one article and tags can be one
word (‘children’) or more (‘children’s
work’). You should aim to keep them short.
To use the tag field:
1. Write the first two or three letters of
the tag you want to use in the tag field.
2. The autocomplete widget will look for
all tags containing those letters. Select
the tag you want from this list.
3. If the tag you want to use doesn’t exist
yet, autocomplete will not find it. Just
type the tag in. It will be available to
autocomplete the next time you want
it.
 Tips
Keep tags general – the purpose is to
categorise lots of posts together, not to
describe the unique properties of one post.
[‘2011 AGM minutes’ is very bad. ‘Minutes of
Meetings’ much better.]
34
Figure 4.5 In the ‘Tags’ field once I have typed the
‘we’ of ‘website’, the dropdown provides me with a
list of all tags including ‘we’. Selecting from this
drop down ensures that you are choosing exactly the
right spelling.You can see that this is separate from
the ‘children’s work’ tag because of the comma after
‘children’s work’. You can have as many tags as you
like for one article.
Articles (Blog posts)
 Let the autocomplete widget do its
work – don’t type the tag unless you
have to. The tags: ‘Children’s Work’,
‘children’s work’, ‘Childrens Work’
and ‘Chidren’s Work’ are all different –
you need them to be the same and the
autocomplete widget guarantees that
for you.
 If you want to have several tags you
separate them with a comma (which
means that a comma can’t be part of a
tag). Once you’ve typed the comma,
the autocomplete widget works again
on whatever you type after the comma.
35
Chapter Four
Image
The image field allows you to upload an
image to the article. This will be displayed
as a large image in the middle of the page
underneath the title and before the main
body of the article. On the list pages, it will
be displayed on the left and in a much
smaller size.
You can insert images into the main body
of the article (we’ll learn about that in
chapter nine), but they won’t be resized
automatically by Drupal when it is
displaying a list view rather than the main
article. So it’s much better to use this
image field (at least for the main image that
accompanies the article).
Drupal is very adept at handling images.
You can upload an image of whatever size
you like and Drupal will resize it for you.
(There is more information about preparing
images in Appendix 6.)
The large image (for the main article) will
be scaled down to a maximum of the full
width of the article column and a maximum
of the same height.
It will usually look better to choose a wide
(landscape) picture rather than a tall
(portrait) one.
36
Figure 4.6 In the main article page, the image
field of the post fills the full width of the content
column.
Figure 4.7 In the list view of articles, the same
image is shown, but much smaller, and floated to the
left hand side of the page, with text wrapping
around it.
Articles (Blog posts)
To use the image field:
1. (First find a decent image for your article,
and get it onto your computer.)
Figure 4.8 To use the image field first of all choose
a file. Once you have chosen the file from your file
system you must then press ‘Upload’.
2. In the ‘Image’ field, press ‘Choose
File’. This will bring up your own
computer’s dialog for opening a file.
3. Find the image you want within your
computer’s file system and press
‘Open’ or double click, or do whatever
your computer requires for you to say
‘this one, please’.
Figure 4.9 Once the image is uploaded you will see
a thumbnail of it and have the opportunity to fill in
the ‘Alternative text’ which will be used by screen
readers. Remember that even at this stage the image
is not yet attached to your article – you must still
press ‘save’ at the bottom of the edit page to save your
changes.
4. Back in the Article form, press
‘Upload’, and wait. When it is
uploaded you will see a thumbnail
version of the image appear in the
form.
5. A new text field – ‘Alternate text’ has
appeared. Enter a short description of
the image here.
6. Save.
 Tips
 You must save the form. It’s easy to
think that once photo has successfully
uploaded you are done. You have
uploaded the photo, but you’ve not
attached it to this particular article
until you press ‘Save’ at the bottom of
the form.
 The image file must be either a .jpg, a
.png or a .gif. If you’re uploading a
photo it will almost certainly be a .jpg
(or .jpeg). There are other formats,
though, and if your file is in a different
format you will need to convert it.
37
Chapter Four
Summary
If you look at the list of articles on the
‘Blog’ page you will see some of the article
(a ‘teaser’) but not the full text (unless the
article is very short). You get to read the
whole article by clicking on the article title,
or on the ‘Read More’ link at the bottom of
the teaser.
The text for this ‘teaser’ for the article is
automatically created from the first few
sentences of your article. You can override
the default break point, though, and set the
‘teaser break’ at the exact point you choose.
Do let the system create the teaser for you,
but if it gives you something you’re not
happy with then set this break point
manually.
The other thing that you can do is to
override the teaser altogether and write
your own ‘summary’ of the article. When
people look at the list of articles, they only
see the ‘teaser’ and if the first few sentences
don’t work well as a ‘teaser’ for the whole
article, it may be worth creating a separate
‘summary’ to describe it.
The block on the home page is created
from the first 360 characters of your article
(trimmed to the nearest whole word).
There is nothing you can do to change this
behaviour on a per article basis.
38
Figure 4.10 The ‘Read more’ link indicates that
in the list view you have only been shown a ‘teaser’
for the full article. By default this teaser is the first
part of the article, but you can set a different
summary altogether.
Articles (Blog posts)
To set the teaser break point:
1. In the main body of the article, place
the cursor at the point where you want
the break.
Figure 4.11 In the toolbar of the text editor there
is a little icon showing a dotted red line. This will
insert a ‘teaser break’ in the article – shown by the
double red lines in the body of the article. These
double red lines don’t show when you are viewing the
post.
2. Press the teaser break button in the
text editor toolbar (the icon with black
lines interrupted by a red dotted line).
To write your own article
summary:
1. In the body field, after the title, click
on ‘Edit Summary’. A whole new text
box appears.
2. Type the summary in this box.
Figure 4.12 Next to the ‘Body’ field title is a link
to ‘Edit summary’. Use this if you want the teaser
text to be entirely different from the body text of the
article.
 Tips
 Most of the time the system will create
a perfectly acceptable ‘teaser view’ of
the article for you.
 Don’t worry about the rest of the text
editor options yet – we’ll cover these
in chapters 8 & 9.
Figure 4.13 Once you have clicked on ‘Edit
summary’ you will see a new text editor window
above the body window – this is the text that will
form your ‘teaser’ and be shown in the article list
view. If it is empty, the system reverts to using a
trimmed version of the body text (either automatic or
using the teaser break you have set).
 From this point on, I’ve stopped
telling you that you must ‘Save’ the
form as the final instruction. You do
still need to press ‘Save’ for anything
to be saved.
39
Chapter Four
Text Formats
For the sake of completeness, we’re going
to cover all the options on the content
editing form.
After the ‘body’ field is the options to
switch to ‘plain text editor’ – you could do
this if you only want to type plain text and
don’t want to see the rich text editor
options.
Beneath that is a ‘text format’ drop down –
set by default to ‘Full HTML’.
Drupal runs filters on the content before
displaying it on a webpage. This is
especially important to prevent attacks on
the website. So it checks (for instance) that
there isn’t any executable code in the
content before it sends it to the web
browser. This is generally a good idea.
Editors and Administrators can use ‘Full
HTML’, but people who are just logged in
as ‘Authenticated’ can only use ‘Filtered
HTML’ (they won’t be able to post
YouTube videos for instance).
Text formats and their permissions are
fully customisable (‘Configuration’ – then
‘Text Formats’ in the Content Authoring box)
but you should really forget all about them
now they are set and be glad of a certain
level of protection that is provided for you.
As part of this filtering it is useful to note
that any email addresses you publish on the
site are protected from being spammed (see
the description of the ‘SpamSpan’ module in
Appendix 1).
40
Figure 4.14 Underneath the body field is an option
to choose ‘text format’. Leave the format set to ‘Full
HTML’. Text formats filter the text as it’s displayed
to the website visitor.
Articles (Blog posts)
Comments
Figure 4.15 Comments are open by default on
articles. Once you mark them ‘closed’ people will be
able to see the existing comments, but not add any
more. If you were to choose ‘hidden’ then none of the
comments for the post would be visible.
Logged in users can add comments to
articles. These display in a list after the
article. Every content type can allow
comments – only the ‘Article’ content type
is set to do so.
Also by default, every comment is
immediately published (you can set the system
to require administrator approval of every
comment, but that seems a bit over-controlling).
You can choose to ‘close’ comments for a
particular article – either when you publish
it (so there will be no comments), or after
the comment thread has been open for a
couple of weeks or so and you don’t want
any further comments.
Figure 4.16 In list view, the number of comments
for a post is displayed underneath the post. If you
click on ‘2 comments’ it takes you straight to the
comments for the post.
To close comments on an article:
1. Choose ‘Comment settings’ from the
tabs at the bottom of the form.
2. Select the ‘Closed’ button.
 Tips
 If someone posts an inappropriate
comment, then you should remove it.
There’s a delete link immediately
under each comment.
Figure 4.17 Underneath the individual comments
are links to delete, edit or reply to the comment. This
is where you would come to delete comments that
were inappropriate if that should prove necessary.
41
Chapter Four
Authoring Information
Underneath the article title is the author
and date of publication.
Usually this information will be right, but
if you have published an article on someone
else’s behalf you might want to change the
authorship to their name.
Similarly, the date of publication will
usually be right, but if you created the
article on the website and worked on it for
a week or so (while leaving it ‘unpublished’ –
so it wasn’t visible) you might want to
update the publication date to the date
when you published it, rather than when
you first ‘created’ it.
To change author and publication
date:
1. Choose the ‘Authoring information’
tab
2. For the author, you must choose a user
who is registered on the site. Let the
autocomplete widget do its job – type
in a couple of letters of the name and
let the widget find your author.
3. For the date and time field, you must
enter the date in exactly the format
described.
 Tips
 You only need to enter the date part of
the date and time (but be careful with the
format).
42
Figure 4.18 The last of the horizontal tabs on the
content editing pages that we will look at. The
author must already be a registered user on the
website so the autocomplete widget will find the
author you are looking for. If you want to post an
article by someone who is not yet a user on the
website create the user first (‘+ Add user’ at the top
of the ‘People’ page).
Articles (Blog posts)
Publishing Options
Just like you learned in chapter two when
we created a basic page, you can publish
and unpublish an article using the
‘Publishing options’ tab. Articles are
published by default, but you might want
to uncheck ‘Published’ when you create an
article if you want to work on a draft
before letting it go ‘live’ on the site.
There are two other options that we didn’t
cover in chapter two:
Promoted to front page
Figure 4.19 The ‘From the Blog’ block on the
front page shows the most recent two articles which
have ‘Promoted to front page’ checked under the
publishing options tab in their content editing page.
Articles are ‘promoted to front page’ by default so
you will want to deliberately uncheck this option for
less important articles.
This is checked by default for articles. It
affects the behaviour of the front page. The
front page will trailer the most recent two
articles which have ‘Promoted to front page’
checked. If you post an article that you don’t
want advertised on the front page, uncheck
this option.
Sticky at top of lists
This is another flag that all content types
have. It is meant for forums where you can
keep certain posts ‘stuck’ to the top of a
list. It has no effect on any content type
within the church website.
43
5
Events
What is coming up that you want people to
know about?
In This Chapter
Create an Event
Date
Image & Description
Options
46
47
48
49
 A trip to a conference like New Wine?
 The beginning of a series of sermons?
 A special service (Harvest or
Remembrance, Christmas or Easter?)
 A concert or other special event?
 An open meeting – or some parish
wide gathering?
Anything that has a date attached to it, and
is coming up in the future can be entered as
an ‘event’.
Just as with articles, make sure that if you
use this section of the website, you keep it
well stocked with events.
On the other hand, don’t list too many
events. Save them for significant items that
people will want to be reminded of or have
bought to their attention. Listing every
Thursday evening housegroup, or every
Sunday service will be too much.
45
Chapter Five
Create an Event
Events are displayed on the ‘Events’ page
in reverse date order (i.e. the next event
coming up is shown first). The three next
events are also shown on the front page.
To create an event:
1. Choose ‘Add content’ from the
shortcut bar.
2. Choose ‘Event’.
The event form should be very familiar by
now. It must have a title, and there is a
body field and some options in tabs at the
bottom of the form. Like ‘Articles’ you can
add an image, which will be displayed both
in the list view and on the full page for the
Event. Like the Article ‘Image’ field Drupal
will take care of resizing images to an
appropriate size. Once you’ve uploaded an
image make sure that it looks right both in
the list and the page view.
Figure 5.1 Events are displayed in a list by reverse
chronological order of the start date on the ‘Events’
page.
There are two new options:
 Event Location – to describe where
the event will be.
 EVENT DATE – to describe when
the event is happening.
Location is a simple text field. You do not
have to enter a location – in fact ask
yourself whether you really need to.
The ‘EVENT DATE’ fieldset is described
on the facing page.
46
Figure 5.2 The next three events are also shown in
a block on the front page.
Events
Date
Events will be displayed up until the ‘Start
date’ of the event. Once the event has
begun it will not be displayed in the list of
events coming up.
You have two basic choices in the ‘EVENT
DATE’ fieldset:
Figure 5.3 The ‘EVENT DATE’ fieldset allows
you to have a start date, an optional end date and
optionally remove the time field by marking an event
‘All Day’. For a multi day event, mark the event ‘all
day’ but choose different start and end days.
Figure 5.4 While the event dates are entered in
quite a non user friendly format in the event date
fields (see fig. 5.3), Drupal takes care of displaying
them in a much more user friendly fashion in the
event listing.
 The ‘All Day’ check box. Is the event
‘All Day’ or does it have a particular
start time? If you check ‘All Day’ it
will remove the time field(s) and a
single all day event will be displayed
with ‘(all day)’ written after the date.
All day is often better for multi-day
events (like a holiday club – where you
list it as 10th – 14th July) with the times
for each day added to the description
of the event.
 The ‘Show End Date’ check box. If you
check this, new fields appear to show
the end date and time. You will often
want to display a date like ‘7pm – 9pm,
August 3rd, 2011’. This requires you to
have an end date – in this case the
same date as the start date, but a later
time.
To enter a date:
1. Choose ‘All Day’ and ‘Show End Date’
as appropriate.
2. Click in the Date field. A date picker
will pop up – use this to select the
date.
3. Add the time in 24-hour clock form
with two digits for the hour (‘09’ not
‘9’) and a colon separating the hour
and minutes.
47
Chapter Five
Image & Description
The image and description (body) fields are
familiar from the Article content type.
Image
Images are good. Do add one to events.
You can find loads of images on Google or
Flickr. Think creatively.
The image field resizes images on the
event list page and on the event page itself
to a ‘medium’ image – the same as the
articles list page. Landscape images will
tend to look better.
You can upload images bigger than
280x220 pixels (so take the rubric with a
pinch of salt) but that is the largest size
that will be stored on the server – it
automatically shrinks it if you upload a
bigger one.
Event Description
The principle description should be the
event title. Feel free to leave the ‘Event
Description’ field empty.
The summary and teaser break option
work just the same as they did for Articles.
If there is a lot of information to explain
about an event (parent registration forms,
external website links, programme details) then
think seriously about a separate ‘summary’
for this list page which will tell the visitor
what will be included in the full listing.
48
Figure 5.5 The image for events is displayed in the
same ‘medium’ image format in the full image post
as in the list view (unlike the handling of the article
image).
Events
Options
The options in the tabs at the bottom of
the page are all ones that we have already
covered in considering pages and articles.
 Tips
Figure 5.6 On the ‘Content’ page you can filter by
‘type’ to show only ‘Events’. From time to time you
should come here so that you can delete the events
which are no longer being displayed on the site
because we have passed their start dates. From
‘Update Options’ it is possible to choose ‘delete’ and
so delete every event you have checked in one go.
 Think carefully about the ‘Promoted
to front page’ option within
‘Publishing options’. If the event is not
especially important, or is something
you are advertising for an outside
agency you might not want it to
appear in the list of the next three
upcoming events. Unchecking this will
stop it appearing on the front page.
 The ‘URL’ setting will automatically
pick up the title and provide a URL in
the form ‘/events/{title}’. If you are
advertising the details in a newsletter
you might want to customise the URL.
 The event is not deleted once it has
begun – it’s just not shown on a list on
the website. It is still available from its
URL. For this reason and for the sake
of tidiness, you should periodically
delete events that have already
occurred. You can find then by
filtering on the ‘Event’ type from the
‘Find Content’ link in the shortcut bar.
49
6
Sermons
In This Chapter
Create a Sermon
Event Description
Uploading Audio
Files to Download
Speaker and Series
Bible Reference
Sermon Description
52
53
54
56
57
58
59
When I first started uploading recordings
of sermons to the Marks Tey church
website I was amazed that people actually
listened to sermons on the web. But they
did. People appreciated being able to listen
again to a sermon that had made them
think, or to catch up on part of a series that
they had missed. People also listened to a
sermon or two before deciding whether to
visit the church.
It’s important to have a system in place to
upload sermons quickly after they have
been preached. The sermon details (title,
date, type of service) can be created a long
way ahead of time, though. In fact it is a
good idea to do this – not only to save time
for the person uploading the audio on a
Sunday, but also because the website will
then be able to display information about
the ‘Next Service’ on the front page of the
website, and ‘Services coming up’ details in
the Sermons section.
Who will be responsible for publishing the
details of all the sermons coming up?
51
Chapter Six
Create a Sermon
Sermons that are from today or before are
listed on the ‘Sermons’ page in reverse date
order (most recent first). The next three
sermons that are coming up are listed in
the right hand sidebar as ‘Service Coming
Up’.
The most recent sermon that has audio
uploaded, and the next sermon listed as
coming up are also displayed on the front
page.
If you click on a series or on a speaker you
get a list of all sermons in that series or by
that speaker.
Figure 6.1 Sermons are displayed in a list on the
‘Sermons’ page. Clicking on a ‘Speaker’ or on a
‘Sermon Series’ will bring up a list of the the talks by
that speaker or in that series.
You can create a sermon as soon as you
have a title and a date.
To create a sermon:
1. Choose ‘Add content’ from the
shortcut bar.
2. Choose ‘Sermon’.
3. Fill out at least the title and the date
fields.
Again, the form is familiar but there are
one or two new options. There are tag
fields for ‘event description’, the ‘speaker’
and the ‘series’; there are upload fields for
the sermon audio and any accompanying
files (these work very much like the upload an
image field); and there is a ‘bible reference’
field.
52
Figure 6.2 The next service coming up and the
most recent sermon are also shown in two blocks on
the front page. These are both views of the same
content type, which gives you an idea of the
effectiveness of a separation of content and
presentation.
Sermons
Event Description
Figure 6.3 The ‘Event Description’ field is
shown here as ‘Holy Communion’. Especially
for the views of services coming up, this is a
good way to show people what to expect.
After the title and date fields (which work
just like these fields in ‘Event’ – but there is no
‘To Date’ option) is the ‘Event Description’.
This should typically be something like
‘Holy Communion’, ‘Morning Worship’ or
‘All Age Service’. It’s useful information for
people looking to see what kind of service
is coming up on Sunday.
Because these will usually be the same
names repeated, the field is a tag field.
(They behave like the Article tags, but are in a
different ‘Vocabulary’ – you won’t see Article
tags offered by the autocomplete widget as
possible options.)
The tags aren’t displayed in a list
anywhere, so just use the convenience of
the autocomplete to save you having to
type much.
To enter an Event Description:
1. Type the first two or three letters of
the description.
2. Allow auto-complete a chance to find
it. Select it from the autocomplete
drop-down.
3. If it’s not in the drop down then type
the event description in.
53
Chapter Six
Uploading Audio
Audio uploads are much the same as an
image uploads. Audio files are bigger than
images though, so you have to wait longer.
Once you’ve uploaded the audio do
remember to press ‘Save’ at the bottom of
the form.
To upload audio:
1. Find the sermon, and go to the sermon
editing page (click the ‘edit’ tab once you
are logged in.)
2. Under ‘Sermon Audio’ press Choose
File.
3. Select the mp3 file you are uploading
from within your computer’s file
system and double click or press
‘Open’ to select it.
4. Choose ‘Upload’ in the sermon editing
form to upload the file.
5. Wait. Possibly a very long time if you
have a large file or a slow connection.
Drupal will not tell you how much is
uploaded, but your web browser might
(in Chrome for instance, there is a progress
indicator at the bottom).
6. When the audio has been uploaded you
will see an mp3 icon and the file name
replacing the upload dialog.
Do remember that although you have
uploaded the audio, it’s not attached to this
particular sermon until you press ‘Save’ at
the bottom of the form.
54
Figure 6.4 The sermon audio field works just like
the image uploading fields you have already seen.
Choose the file you want from your local file system
and press ‘Upload’.
Sermons
 Tips
Figure 6.5 In the page view for a particular
sermon you will see the audio file you have uploaded
displayed in and audio player, and with a
‘Download mp3 file of this talk’ link beneath it. You
upload the audio; Drupal takes care of displaying it
for you with an audio player and download link.
 There is a maximum file size of 10MB.
If you try and upload a file bigger than
this it will not be saved by the server
(so you will have waited a long time for
nothing.) 10MB is big enough for an
hour of spoken audio at fairly good
quality, so should be more than
enough.
 The audio must be saved as an mp3
file.
 If your file is bigger than 10MB, you
probably have not saved it in an
appropriate format for the web. [A
stereo recording from a professional field
recorder at its highest fidelity setting
would hit 10MB after about 20 seconds
and a highest quality stereo mp3 file for
playing on a decent hi-fi system might hit
10MB after about 4 minutes.] You can
learn more about preparing audio for
the web in appendix 7.
 If the sermons have already been
‘created’ then these are all the
instructions required to upload the
audio once it has been saved and
formatted correctly for the web. Make
sure that your Sunday sound people
know how to:
i. Save Audio on the church laptop.
ii. Edit it, and save it as an
appropriately compressed mp3.
iii. Log into the website, and upload
it to the appropriate sermon.
55
Chapter Six
Files to Download
As well as the audio file for the sermon
(which has its own download link provided),
you can attach as many other files to the
sermon as you like.
This is useful if there are sermon notes, or
discussion notes for groups that week
related to the sermon, or power point
slides for a sermon.
To upload files:
1. In the ‘FILES TO DOWNLOAD’
fieldset underneath the label ‘Add a
new file’ press the ‘Choose File’
button.
Figure 6.6 The ‘FILES TO DOWNLOAD’
fieldset. Files already uploaded are shown in the
‘FILE INFORMATION’ table. The link to the file
will be the file name, unless you fill out the
‘description’ field in which case this value will be
used instead. New files are added in the ‘Add a new
file’ section which works just the same as image
uploading or audio uploading have done in previous
examples. The drag handles to the left of the existing
file names allow you to rearrange the order in which
these files are displayed (just as you did with menu
items).
2. Select the file to upload from your file
system.
3. Press Upload. Once it’s uploaded the
file appears, along with the name of
the file, and a new text field titled
‘Description’.
4. Type in a ‘Description’. This will be
the text of the link to the file.
 Tips
 If you’ve uploaded more than one file
you can use the drag handles (same as
for dragging menu items) to re-order
the files.
 To change the allowed file extensions
go to ‘Structure’ in the main admin
bar, then ‘Content types’, then under
Sermons ‘manage fields’, then ‘edit’ the
‘Files to Download’ field.
56
Figure 6.7 Files to download are displayed
immediately after the sermon audio player in both
list and individual page views.
Sermons
Speaker and Series
The ‘Speaker’ and ‘Sermon Series’ fields are
like ‘Tags’ for articles. Each sermon lists
the speaker and the series it is part of and
these become clickable links which take
you to a list of all sermons by that speaker
or in that series.
Figure 6.8 The speaker and sermon series are
displayed in the list and full views of the sermons.
The speaker is also listed in coming up services and
the blocks on the front page. All of these act as links
to a list of sermons that contain that particular term
(just like tags work with articles).
As with other tags, the important thing is
to let the autocomplete widget do it’s work.
To add a speaker or series:
1. Type two or three letters of the
speaker or series.
2. Wait for the auto-complete widget to
do its work and choose the option you
want from the drop down list.
3. If the option you want doesn’t appear
then type it in.
57
Chapter Six
Bible Reference
If there is a particular bible reference for a
passage then add it in the ‘Bible Reference’
field.
Keep quite strictly to the format described
on the form. This will allow the display
formatter to create a link to Bible Gateway
for the passage listed.
Figure 6.9 Bible Gateway provides a freely
accessible online bible.
58
Sermons
Sermon Description
You can use the sermon description field
for a description of the sermon or for a
transcript of the sermon if someone has
typed their sermon out and you have a
copy of it.
The summary and teaser break functions
for this field work just the same as they do
for Articles and Events.
Options
Figure 6.10 If you have a transcript of the sermon,
consider copying and pasting it to the sermon
description field as well as uploading the transcript
as a file to download. People would generally like to
be able to view something in situ before considering
whether to download it.
You will not want to change any of the
options in the tabs at the bottom of the
form. The ‘promoted to front page’
checkbox is not taken into consideration
when deciding which sermons to display
on the front page.
59
Rotating Images
In This Chapter
Create a Rotating Image
The Image
Linking to Content
Text Overlay
Managing Rotating Images
62
63
64
65
66
7
Many websites have a banner on the front
page that rotates around a number of
images. It’s a good place to promote
aspects of the church’s life, or new content
or a particular event or course that is
coming up.
61
Chapter Seven
Create a Rotating Image
Rotating Images display in the banner on
the front page. They can have text laid
over the top of them, and they can link to
other content on the website.
To create a Rotating Image:
1. Choose ‘Add content’ from the
shortcuts menu.
Figure 7.1 The rotating banner on the front page
is a great place to set the tone for the website; to
communicate who you are as a church and to
promote any special events or particular things that
people should take note of.
2. Choose ‘Rotating Image’.
3. Add a title (which is just used
administratively – you won’t see it).
4. Upload an image.
5. Optionally add a link and text overlay.
You are very familiar with this form by
now. The new element on this page is the
‘Link’ field. It will also help to keep to quite
a strict rule about how to enter text for the
‘Text Overlay’ – the main body field for
this content type.
You will also learn how to change the
order in which the Images are displayed in
the slideshow.
62
Figure 7.2 The Rotating Image form is just the
same as every other content editing form; but you
should take especial care over the image that you
upload, and any text that you include in the text
overlay field to make sure that they meet the size and
style conventions that are expected.
Rotating Images
The Image
The image field is the same as the other
image upload fields that we have come
across.
Figure 7.3 When you hover over the image, the
title text will be displayed. Only set the title text for
images which link to content.
To upload the image:
1. Under ‘Image’ select ‘Choose File’.
2. Choose the image you want from your
file system.
3. Press ‘Upload’.
4. It will invite you to add a title to the
image. This text will appear as a
tooltip when the visitor hovers over
the picture.
 Tips
Figure 7.4 In whatever image editing software
you have, make sure that the image size is set to
600x300 pixels – so that you make sure that you get
exactly the image you want displayed on the site.
Otherwise the site will scale and crop the image you
upload for you – which is easy, but doesn’t give you
the level of control that you ought to be exercising for
really important images.
 Do not add a title to the image unless
you are going to set a link. If you’re
setting a link, then use the title to
describe where the link will take you
(i.e. ‘Find out more about…’).
 If the image you upload is bigger than
960x400 pixels it will upload, but the
system will resize it down to 960x400
before it is saved by the system.
 The final image will be displayed at
600x300 pixels. It is worth creating an
image at exactly 600x300 pixels, or at
least with a 2:1 aspect ratio before
uploading it. See appendix 6 for more
information on preparing images for
the web.
63
Chapter Seven
Linking to Content
The image can be a link to other content
on the website (or indeed a link to anywhere
on an external website – but internal links are
better). Especially if the image describes a
part of the church’s ministry or a particular
event, the image should link to that content.
If you’re also setting a text overlay, you
might choose to use that to explain to the
visitor that they can click for more
information. Since the text overlay is inside
the image, you can use the text ‘click here
for more information’ (or something like it)
entirely safely – it won’t in fact matter
where they click.
To set the link:
1. Type the link in the link field
 Tips
 Assuming it’s an internal link, you
only need the address after the main
website address – i.e. you can link to
‘about’ – you don’t have to type in the
full
‘http://www.marksteychurch.org/abo
ut’. Don’t including a ‘/’ at the
beginning or end.
 I add links by opening the page I want
to link to in a separate tab of my
browser and copying and pasting the
contents of the address bar into the
link field I’m updating.
64
Figure 7.5 The link field can contain either a full
address (http://www… etc…) or just the internal
link to another page within the website. You often
want to use the short form of an internal link. Note
that there is no ‘/’ at the beginning of the link
address.
Rotating Images
Text Overlay
If the text overlay field is blank you will
just see your image. If there is text in the
field, though, it will be placed over the top
of the image with an opaque background.
Figure 7.6 If you are going to use a text overlay,
you should style the first line of the overlay as a
‘Heading 2’. Highlight the text and pull down
‘Heading 2’ from the style dropdown.
If you use the text overlays it’s a good idea
to have a clear style standard for how the
text should be presented.
If you add a text overlay, you should have a
second level heading (‘heading 2’) for the
text title, and then some descriptive text in
the normal paragraph font. We’ll learn
more about styling text in the next
chapter, but, for now, here are the blow by
blow instructions.
Figure 7.7 The text is overlaid on top of the image
with an opaque background. If there is no text in the
‘text overlay’ field, then no text and no overlay will
be displayed – you will get just the image.
To add a text overlay:
 In the Text Overlay box type a title
and then press the ‘Enter’ key (the key
for a standard paragraph return).
 In the second paragraph type a short
description.
 Highlight the title with your mouse.
 Go to the styles drop-down in the text
editor editing bar (which will be
reading ‘paragraph’) and choose
‘Heading 2’
 Tips
 When you’re expert at preparing
images, you can incorporate text
within the image and then stop using
overlays altogether.
65
Chapter Seven
Managing Rotating
Images
You can re-order the rotating images from
within the ‘Manage Rotating Images’ link
that comes up on the shortcut menu bar.
This will allow you to quickly see which
images are currently published, what their
text overlay is and where they link to.
From this admin page you can re-order the
images and go to their main pages to edit
the individual images and overlays.
To re-order images:
1. Go to ‘Manage Rotating Images’.
2. Drag the images into the order you
want.
3. Remember the order is not changed
until you press ‘Save’ at the bottom of
the form.
To edit images:
1. Go to ‘Manage Rotating Images’
2. Click on the title of the image to select
its main page.
3. Click on the ‘edit’ tab to edit the
image.
66
Figure 7.8 The ‘Manage Rotating Images’ link in
the shortcut menu takes you to the ‘Rotating Images’
page as an overlay. This is a view of all your
rotating images, published or not. The drag handles
reorder the images, which will be displayed in the
order they appear on this page.
Rotating Images
 Tips
 When you re-order images remember
to take into account any images that
are scheduled to be published, and also
put these in the appropriate place in
the order.
Figure 7.9 Clicking on a title in the managing
images page gets you to the page view for the image
(which the website visitor will never see). From here
you choose the ‘Edit’ tab to edit the link or overlay
for the image.
Figure 7.10 Take full advantage of the
‘scheduling options’ to control when different
rotating images appear.
 It’s worth having a set of at least three
‘standard’ images – say something
about worship, children and networks.
If there’s nothing else of note going
on, then have these three published. If
there are several other events and new
content that you are promoting, then
unpublish these. They will still be
visible in the ‘Manage Rotating
Images’ page and you can quickly see
which are published. When you want
to retire the special images, just set the
standard ones back to ‘Published’. (In
the ‘Publishing options’ tab of the content
editing page.)
 Take full advantage of scheduling
images. You can prepare an image to
advertise Christmas in July – but
schedule it not to appear until the
beginning of November, and then to
unpublish itself on December the 26th.
If you use this option it might be
worth scheduling something else to
appear on the 26th to take the place of
the image that you are removing.
67
The Text Editor
In This Chapter
Styles
Other Formatting
Links
Media, Tables & Special Characters
Pasting Content
Teaser Breaks
Other options
70
71
72
76
77
78
79
8
We’ve now covered all the content types,
but you will have noticed that we skipped
over the text editor options for the main
body field of each content type (except that
we briefly covered teaser breaks and second level
headings). This is fine as long as all you
want is plain text in that body field. What
if you’d like to make something bold, or
italic? Or maybe you’d like to make a
heading bigger, or put things in a list – or
a table? maybe you’d like to create a link,
or insert an image or a video?
This chapter will cover most of the text
editor options, and chapter nine will fill in
more detail about inserting media (i.e.
images or video).
69
Chapter Eight
Styles
If you use a word processor like
Microsoft’s ‘Word’ you will be aware that
you can choose fonts and text sizes at will.
It’s a better discipline in Word to set up a
certain number of ‘Styles’ for your
document and use those consistently
throughout the document.
In the text editor for the web site the font
and font size options have been disabled,
which means that you are forced to use
‘Styles’ to make larger bolder text for
headings. The styles drop down in the text
editor toolbar (the only drop down menu)
allows 4 different levels of headings as well
as selecting regular paragraph text.
To Style text:
Figure 8.1 The Style drop down allows you to
apply styles (here – normal paragraph or various
heading levels) to whatever text that you have
highlighted.
1. Select the text.
2. Choose the style from the drop down.
 Tips
 Don’t use the ‘Heading 1’ style. The
heading of your article or page will
already be styled as a ‘Heading 1’, so
further heading on the page should be
sub-headings beneath that.
 When an image is selected, there are
styles for the image – left, right or
centred. More information in the next
chapter on inserting images.
70
Figure 8.2 If you have selected an image rather
than regular text, you are also presented with some
appropriate styles for objects.
The Text Editor
Other Formatting
Figure 8.3 Bold and italic formatting is available
from the ‘B’ and ‘I’ icons. The rubber icon will clear
existing formatting from the selected text.
The other common formatting options that
are available are to make text bold or italic.
You can choose these from the editor
toolbar.
Sometimes there is formatting in the text
you want to get rid of (you pasted it from
another application without cleaning it first, or
you have applied formatting and you can’t
remember what you did). You can use the
‘rubber’ icon to clean formatting from the
text.
To apply formatting:
1. Highlight the text you want to format.
2. Press the ‘B’ button for bold, the ‘I’ for
italic, or the rubber to clear the
formatting.
 Tips
 You can use the shortcut keys that you
are used to from other applications on
your computer. Ctrl-B for bold, Ctrl-I
for italic. You can also use Ctrl-U for
underline, even though it doesn’t
appear in the toolbar.
 The ‘enter’ key gives you a new
paragraph. Sometimes you just want a
new line. Use Shift-Enter for this.
(Also works in Word etc…)
71
Chapter Eight
Links
You will often want to link to other
content – either content on other pages of
the website or pages on external websites.
Figure 8.4 The link, unlink and anchor icons.
To create a link:
1. Highlight the text that you want to
become the link.
2. Click on the ‘link’ icon.
3. Type the address in the URL field.
4. Click ‘OK’
 Tips
 If you click on the link icon without
selecting some text first it will insert
the address of the link as the linkable
text.
Figure 8.5 When you highlight some text and click
on the link icon, a dialog box appears for you to fill
in the link details. The default link type will be a
URL of a webpage.
 Internal links don’t need the full
address (see the section on links for
rotating images). However, to use just
an internal link (i.e. ‘about’) you need to
choose ‘Other’ as the ‘protocol’ rather
than ‘http://’.
 I find highlighting the address bar of
the page I am trying to link to and
copying (Ctrl-C) and pasting (Ctrl-V)
the address into the link field the
easiest way to create links. If you paste
the whole link in (including http:) the
editor dialog will take care of the
‘protocol’ for you – i.e. adapting to
http: or https: or ftp: as required.
72
Figure 8.6 An internal link – here to the ‘About’
page, doesn’t need to start with ‘http://’ – to remove
this, use the protocol ‘<other>’.
The Text Editor
Email Links
You use the same link icon to create a link
to an email address.
To create a link to an email:
Figure 8.7 If you choose ‘E-mail’ as the link type,
you will get options for Email address, Message
Subject and Message Body. You must fill out the
email address for the link; you may fill out the
message subject; you should avoid pre-filling the
message body.
1. Highlight the text you’d like to
become a link (i.e. ‘email me’), or just
click where you’d like the link inserted
(which will insert the full email address as
this link).
2. Press the ‘Link’ icon.
3. Under ‘Link Type’ choose ‘Email’.
4. Fill out the email address.
5. If you’d like to pre-fill the subject line
of the email do so. Do not fill out the
message body (it will break the display
of the email that is created by the antispam filter module).
6. Click ‘OK’ to create the link.
 Tips
 The module ‘SpamSpan’ protects
emails on the website by converting
them to a form that can’t be read by
spam harvesters and then using
javascript to reassemble the email
inside the browser. You get to see the
unreassembled version inside the text
editor when you edit a post (this is not
ideal). The only fix is to switch off the
SpanSpam module (go to ‘Modules’ in
the main admin bar, uncheck ‘SpanSpam’
and save at the bottom of the page). It still
looks right when you view the post.
73
Chapter Eight
Links to Anchors
As well as linking to other pages you can
also link to ‘anchors’ within the current
page. This can be useful, for instance, for a
page of FAQs where the questions are
listed first, and each question links to the
answer further down the page.
Figure 8.8 The anchor dialog box. All you need is
some text to become the anchor, and a name.
To link to an anchor, you first have to
create some anchors.
To create an anchor:
1. Highlight the text you’d like to be the
anchor .
Figure 8.9 Once you have created an anchor the
text editor shows an anchor icon to the left of the
anchor text. This does not appear in the actual view
of the page.
2. Click on the Anchor icon (the flag next
to the link and unlink icons.)
3. Type in a name for the anchor.
4. Press ‘OK’
To link to an anchor:
1. Highlight text to link as before and
press the link icon.
2. Under ‘Link Type’ choose ‘Link to
anchor in the text’.
3. Select the anchor by Anchor Name
4. Press ‘OK’
 Tips
 You must have text for the anchor –
don’t try and create an anchor that
doesn’t incorporate some text).
74
Figure 8.10 When you choose ‘Link to anchor in
the text’ as your link type you get to select anchors by
name or Element Id. Always choose to select them by
name – a list of all the anchors you have created in
the page appears in the drop down.
The Text Editor
To edit a link:
1. Right click the link you want to edit.
2. Choose ‘Edit Link’
To delete a link:
Figure 8.11 If you right click an existing link, you
can alter the link properties by choosing ‘Edit Link’.
1. Click anywhere in the link, or
highlight any part of the link text
2. Click the ‘Unlink’ icon
To have a link open in a new
window:
1. Create a link (or edit a current one)
2. Choose the ‘Target’ tab
3. Choose ‘New Window’
4. Press ‘OK’
Figure 8.12 The ‘Target’ tab of the Link dialog
allows you to choose where the link will appear. By
default (<not set>) browsers will open a link in the
existing window. You will usually want to change
the Target if you are linking to external websites
which you would like to open in a new tab (‘New
Window (_blank)’).
 Tips
 Links to new windows are sometimes
useful when you’re linking to an
external website. Internal links should
never open a new window.
 You can essentially ignore the other
‘Targets’ – ‘not set’ is the default.
Sometimes a ‘pop-up’ window, which
allows you to set the size and
properties of the new browser window,
can be useful.
 You can ignore the ‘Advanced’ tab of
the link dialog entirely.
75
Chapter Eight
Media, Tables and Special
Characters
You can use the text editor toolbar to
insert special content into your page. The
three options are media, tables and special
characters. We’ll cover media in the next
chapter, but the basic process for inserting
any of these things is the same.
Figure 8.13 The media, table and special
character icons.
To insert special content:
1. Click on the media, table, or special
character icon.
2. Fill out the dialog.
3. Press ‘OK’
Tables
There are some things that you might like
to present in tables. They are quite difficult
to handle, and not fully explained here, so
trial and error might be required.
 Tables are in rows and columns – so
choose these in the dialog. Once you’ve
created the table you can right click it
to add rows or columns (or edit the
properties), so don’t worry too much
to begin with.
Figure 8.14 The ‘table’ dialog. Consider setting
the width to 620px. Tables properties can also be
altered by right clicking the table to bring up the
options.
 The main column of the website is 620
pixels wide, so it might help to set this
as the width.
Special Characters
Just pick the character you want from the
list in the dialog.
76
Figure 8.15 Simply click on the character you
want and it is inserted into the text.
The Text Editor
Pasting Content
Figure 8.16 The ‘Paste from Word’ icon.
Figure 8.17 Paste your content inside the dialog
window and hit ‘OK’.
Often you will want to paste content from
something else you’ve written (or perhaps
an email someone has sent you for publishing on
the web etc…). It would also be sensible if
you were working on a long article to
create it in a word processing programme
and then cut and paste it to the article form
on the website. There is no ‘autosave’ on
the website.
It’s important when we paste content from
elsewhere that we only paste the content,
and not the font choices – otherwise we
lose the consistency of style across the
website. For this reason the paste button
on the website asks you to paste your
content inside a dialog box, and then press
‘OK’ – so that it can clean out the
formatting before adding it to the page.
To paste content:
1. Press the ‘Paste from Word’ icon
2. Paste your content inside the dialog
box (Ctrl-V)
3. Press OK
 Tips
 Ctrl-V is set up to perform the same
procedure inside the editor. So skip the
above steps altogether and use Ctrl-V
directly instead.
77
Chapter Eight
Teaser Breaks
We covered the teaser break option in
chapter 4 on Articles. For completeness
they’re described here too.
Content items are often presented in a page
view – with just that item, or in a list view
(a ‘teaser’ view) with lots of items in a list
that link to their full page view. In the
teaser view, only the first few sentences of
the body field are displayed. Drupal
chooses this break point for you. You can
control it with the ‘Teaser Break’ icon.
To insert a teaser break:
1. Place the cursor at the point where
you want the break.
2. Press the ‘Teaser Break’icon.
 Tips
 If the Teaser Break is not at the
beginning of a new paragraph, Drupal
will create a new paragraph for you.
78
Figure 8.18 The teaser break icon.
Figure 8.19 The teaser break is displayed in the
editor as a double dotted red line. This doesn’t
appear in the post on the site – it’s just shown to you
as a guide. If you insert a teaser break mid
paragraph it will end the existing paragraph and
start a new one.
The Text Editor
Other Options
We’ve covered most of the options in the
text editor toolbar. From left to right, the
remaining ones are:
Source
Figure 8.20 The source view can be essential for
adding in objects like YouTube videos, and is helpful
if you know a bit of html code. Don’t let it put you off
– you generally will not want to use it.
This gives you the HTML code view. You
don’t usually want to see that so don’t
press it.
Spelling
Auto spell check is on by default. You can
disable it using the ‘ABC’ icon. If the spell
check doesn’t recognise a word it will
underline it with a red squiggly line. Right
click the misspelled word to bring up
suggestions as to what you might have
meant.
Undo / Redo
Figure 8.21 You can switch the spell checker off or
change its language option.
Figure 8.22 The undo and redo icons.
Undo / Redo. you can also use the
standard Ctrl-Z and Ctrl-Y options for
this.
Lists
Highlight a number of paragraphs and
press either numbered or bulleted list to
get the paragraphs presented as a list.
Figure 8.23 You can choose numbered or bulleted
lists.
Full Screen
The far right icon will allow you to edit in
full screen mode. I don’t recommend this.
Figure 8.24 The full screen icon.
79
9
Media
In This Chapter
Inserting Media
Images
Video
Files
Audio
82
83
88
89
90
Web pages would be pretty boring if they
were just plain text (even with a few tables,
lists and special characters thrown in!). An
article or news story may get away with
just the main article image to enliven the
page, but the basic pages on the site will
need some images to brighten them up and
help you to communicate effectively.
The insert media button inserts images for
you. It will even help you with the image
size, so that you can simply upload an
image from your digital camera, choose an
appropriate size to display it, and the
Media module will take care of the rest.
Getting video or audio or text files onto
the website is a little more complicated.
Hopefully by now you are sufficiently
fluent in the regular workings of Drupal to
take these slightly more advanced topics in
your stride.
81
Chapter Nine
Inserting Media
When you want to insert an image in your
post you choose the ‘insert Media’ icon
from the toolbar.
The Media dialog that appears lets you
upload a file to the website. If this is an
image file, it can then be immediately
displayed in your post.
If you change to the ‘Library’ tab you see a
list of all the files that you have uploaded
to the website. You can choose one of these
rather than uploading a new file.
You can also upload audio files or text files.
Media will not display these in your post,
but this chapter will talk you through the
somewhat painful way in which you can
achieve that, as well as explaining how to
embed video files.
 Tips
 The Media module is new this year. It
promises to be quite the best way of
inserting media into Drupal sites. At
the moment it is quite a long way off
being as useful as it promises. It is
worth watching for new versions of
the module that will improve usability
(the hope would be access to as many
‘image styles’ as you chose, automatic
YouTube embedding and nicely formatted
file links, and audio files having the audio
player displayed with them).
82
Figure 9.1 The insert media dialog. You can
upload a new file here, or switch to the ‘Library’ tab
and pick a file from the library.
Media
Images
The most basic procedure is to insert an
image in your post.
To insert an image:
1. Place the cursor where you would like
Figure 9.2 Once you have uploaded an image, the
options for embedding it appear. Choose the
appropriate size and then press ‘Submit’.
the image to be inserted.
2. Click the ‘Add Media’ icon.
3. Press ‘Choose File’ and select the
image that you want to upload from
your computer.
4. Press ‘Submit’ to upload the file. Once
the file is uploaded a new dialog box
will appear.
5. Choose the ‘format’ you want to
display the picture in – if you want
your original image to be displayed
just as you uploaded it, choose
‘Original’.
6. ‘Description’ – ignore this; it doesn’t in
fact do anything.
7. Press ‘Submit’ and the image will be
displayed in your post.
 Tips
 Rather than uploading an image, you
can switch to the ‘Library’ tab and
choose an image that you have already
uploaded.
83
Chapter Nine
Image Sizes
One of the current ‘clunky’ aspects of the
Media module, is that the format options
don’t directly correspond to the image
styles that have been set up on the site.
However, the various options that have
been set up to work like this:
 Large
Large (the default option) maps to the
‘Large’ image style – this scales the
image to the full width of the main
column (620 pixels) if it’s a landscape
image, or that height if it’s a portrait
image.
 Original
Insert the picture just as you uploaded
it. It’s definitely worth working out
how to resize your images to the size
you really want in the post before you
upload them (see Appendix 6 for more
help).
 Preview
Preview maps to the ‘medium’ image
style. This scales to 220 pixels on the
largest dimension. This will be the
most useful setting if you have not
resized your image before uploading it.
 Link
Link maps to the ‘thumbnail’ image
style and produces a small image (max.
dimension is 100 pixels) that is
appropriate for using as a link.
 Tokens
Please ignore
84
Figure 9.3 The format options for the image you
are inserting. The default is ‘Large’, but if you have
prepared your image right before uploading it, you
will want to choose ‘Original’.
Media
Image Layout
Figure 9.4 When the image is first inserted it will
appear inline with the text on the page. Usually you
will now want to choose for the image to go left or
right with text flowing round it, or centred with the
text above and beneath.
By default, the image is inserted into the
post ‘inline’. This means that it behaves
just like a character of text and will take its
place among other text characters. This is
very rarely how you want it to behave
(occasionally for very small images this is just
what you want). More often you will want
the text to flow around it, or you’ll want
the image displayed in it’s own space with
text above and beneath it.
To change the layout of the
image:
1. Click on image in your post to select it.
2. From the styles dropdown in the text
Figure 9.5 With the image highlighted select an
image style from the style drop down.
editor pick ‘image on left’, ‘image on
right’ or ‘image centred’.
 Tips
 ‘Image on left’ and ‘image on right’
flow text around the image. ‘Image
centred’ centres the image, and puts
text above and below it.
Figure 9.6 Choosing ‘image on left’ has kept the
image on the left, but now the text flows to the right
of it.
 When you click on an image you see
drag handles on the sides and corners.
You can drag these to make the image
larger or smaller (not in Chrome – works
fine in Firefox). If you’re going to drag,
then pick a corner so that you preserve
the aspect ratio of the image. It is
better to upload the right size of image
in the first place, or use one of the predefined image sizes described on the
facing page. (For why, see Appendix 6).
85
Chapter Nine
Image Properties
If you right click on an image in the editor
window, you can choose the ‘Image
Properties’ dialog.
In the main tab (‘Image Info’), you have the
following options:
Figure 9.7 Right clicking the image allows you to
choose the ‘Image Properties’ dialog.
 URL
This is the address of the image. Don’t
touch this.
 Alternative Text
This is the ‘Description’ that you
should have been able to add when you
originally inserted the image. It is used
for screen readers, and so it is
recommended as good practice to
include this.
 Width and Height
If you press the ‘refresh’ icon to the
right of these fields the current width
and height will be filled in. You can
change the width and height that the
image is displayed here. The aspect
ratio is locked (so if you change the
width, the height will be changed to an
appropriate height) and you can unlock
this by pressing the padlock icon. This
gives you more control over the image
size than just dragging the image
handles, but should also be avoided for
the reasons described in Appendix 6.
 Border
For a thin black border around your
image enter ‘1’ in this field. ‘2’ will
give you a strong border (the number
you enter is simply the thickness of the
border in pixels).
86
Figure 9.8 The image properties dialog allows you
to set the alt text, and alter the width and height.
You should not use the options here for setting
alignment – do that by styling the image as described
on the previous page.
Media
 HSpace and VSpace
This adds an equal amount of space to
the left and right, or top and bottom of
the image. This is not usually a good a
way of controlling the image layout.
 Alignment
This is an inferior way of aligning an
image to left or right and flowing text
around it. Use the style dropdown
options in the main text editor instead.
Figure 9.9 The ‘Link’ tab allows you to use the
image as a link.
The next tab (‘Link’) is much more likely
to be useful to you. It’s here that you set a
link for the image. This works in much the
same way as the regular link dialog box for
text links.
 URL
The address that you link to. It’s not
as sophisticated as the options in the
‘Link’ dialog, but the same tip applies –
copy the address from the page you
want to link to, and paste it in here.
 Target
The default – ‘<not set>’ will open the
link in the current window. To open
the link in a new window, choose ‘New
Window’.
You should ignore the final tab
(‘Advanced’).
87
Chapter Nine
Video
Video files are huge, and all but the very
largest organisations use a service like
YouTube (or other services like blip.tv and
vimeo) to host their videos, and then
‘embed’ them into their website.
To embed a YouTube video:
1. Find the YouTube video you want to
embed. (On YouTube)
2. Press: ‘Share’ underneath the video
and then ‘Embed’ to see the code you
need to embed in your page.
Figure 9.10 Underneath any video on YouTube,
you can click ‘Share’ and then ‘Embed’ to pull up
this embed code. You need to copy it and paste it into
your post at the point where you want the video to
appear.
3. Copy the embed code (Ctrl-C)
4. In the text editor for the page where
you want the video, press ‘Source’ to
get the code view of the page.
5. Paste the embed code where you want
the video to appear.
 Tips
 If you set the Custom width to 620px,
the video will be the full width of your
text column.
 Don’t be afraid of the code view. It’s
just the text on your page, plus a pile
of formatting tags – (like <p> </p>).
Try putting the video code after a
closing </p> tag.
 Other video providers (blip.tv, vimeo)
also provide embed code, and you
follow the same principle as described
for YouTube on this page.
88
Figure 9.11 You must embed the ‘embed code’
in the ‘Source’ view of the text editor. Don’t
worry too much about the various items that
you see here. Start a new line at what seems an
appropriate place and paste the YouTube code.
You will be able to see in the normal view if
you’ve got it right.
Media
Files
Sometimes you will want to post files to
the website - a copy of some minutes or
notes, or a sign up form for example. The
best format for text files on the website is a
pdf, because the reader is free in all
operating systems and the file will look the
same. If it’s a file you want people to be
able to edit, either Microsoft Word’s ‘.doc’
format, or the ‘Rich Text format’ – ‘.rtf’ are
useful. Be aware that not everyone will
have Word though.
Figure 9.12 Once you’ve uploaded a file don’t try
to embed it – instead go to the library tab and right
click the file name and use the options to ‘Copy Link
Address’.
You can use the ‘Add Media’ dialog to
upload your file to the website, but you
won’t be able to use it to insert the file. So
we’ve got a two step process – upload the
file, and copy the address which will link to
it, then add a link to that file.
To upload a file:
1. Press ’Add Media’.
Figure 9.13 If you do choose ‘Submit’ and then
choose the ‘preview’ format, Media will insert an
image of a file icon for you (but you still need to
insert the link manually). Here I’ve added the file
name after the icon.
2. Upload your text file in the same way
that you would an image.
3. (Don’t click ‘Submit’. It will just insert the
file icon.)
4. Click on the file name to go to the
Figure 9.14 Highlight the icon and the text, click
on the link icon, and paste the link into the URL
field.
webpage for that file, and copy the
address from the address bar. OR –
(much easier) right click the file name
and choose ‘Copy link address’.
5. Click ‘Cancel’ to return to the text
editor.
6. Create a link (see chapter 8) and use
Figure 9.15 You now have a nicely formatted file
link, where clicking either the icon or the text will
link you to the file.
the address you copied in step 4 as the
URL.
89
Chapter Nine
Audio
Audio on the site is well presented when
you upload a sermon with a media player
that will play the sermon on line as well as
offering a download link.
You can’t do this automatically inside the
text editor, but you can do it manually.
Figure 9.16 You might be happy to just link to the
audio file – but with a little work it is also possible
to include an audio player in your post.
To insert an audio player:
1. Press the ‘Add media’ button, and
upload an audio file (.mp3) from your
computer.
2. (Don’t press ‘Submit’ to insert the file –
Media will just insert the file icon.)
3. Click on the name of the file to take
you to the web page of the audio file,
and then copy the address of the file
from the address bar. OR – right click
the file name and choose ‘copy link
location’.
4. Now press ‘cancel’ to get you back to
the text editor.
5. Switch to ‘Source’ view.
6. At the point where you want the audio
player, type the following:
‘<audio id=”audioplayer”
src=”your_file.mp3”></audio>’
replacing ‘your_file.mp3’ with the
address you copied in step 3. The text
is all on one line, without the first and
last apostrophe, and with a single
space between ‘“audioplayer”’ and
‘src=’.
90
Figure 9.17 You need to create your own ‘embed
code’ to put into the source view of the website (just
like you did with the YouTube video – but you write
the code). It’s as simple as copying the code on this
page, and inserting the audio link address that we
copied on the previous page inside the src attribute.
Media
To insert the download link:
1. Write the text for the link (i.e.
‘download mp3 file’ or something like
that) in the editor.
2. Highlight that text and click the link
button.
3. For the URL enter the address that
you used inside the <audio> tags for
the player.
 Tips
 If you are adding a link, and don’t have
the URL in your clipboard, you can
easily find it from the ‘Library’ tab of
the ‘Add Media’ dialog.
 If you use the ‘Add Media’ dialog to
select the file (choose ‘Submit’) and
then choose ‘Preview’ for the file
format, then press ‘Submit’ it will
insert a file icon. This is also useful for
other links to files, and is one instance
when you do want the default inline
display for images.
 The process for inserting video, file
links and audio is quite complicated,
but if you follow the step by step
instructions you will find it easier than
it looks. Embedding an audio player is
exactly the same as embedding a video
player, except that you have to write
the embed code by hand rather than
cutting and pasting it from YouTube.
91
Managing Content
In This Chapter
Editing Content
Finding Content
Filtering by Status and Type
Bulk Operations
Searching for Content
94
95
96
97
98
10
You have by now learned pretty much
everything that you will do on a day to day
basis to add content to your church
website. You have already created and
edited pages, articles, events, sermons and
rotating images as well as learning about
how to manage the menu in the ‘About’
section and all the formatting options
provided by the text editor.
This chapter broadens your knowledge of
how you go about editing and looking after
content that already exists.
93
Chapter Ten
Editing Content
You already know how to edit content that
is currently displayed on the website:
 From the main page for the content
choose the ‘edit’ tab.
 From the list view, click on the
contextual options gear and choose
‘edit’.
 For rotating images choose ‘Manage
Rotating Images’ and click on the title
to bring up the full page for each item
of Rotating Image content.
What about events that are no longer
displayed because they have passed? Or
articles or pages that are not displayed
because they are not published (either
because they are scheduled not to be published
yet, or you have manually set them to
unpublished)?
How about finding an article that was
published some months ago? Do you have
to trawl through pages of articles to find
the one you are looking for?
What if I want to permanently delete 17
expired events? Do I have to do them one
at a time?
Easy ways to handle all these questions
that relate to managing the content on the
site are covered in this chapter.
94
Managing Content
Finding Content
All of the content on the site is listed in the
main ‘Content’ admin page (in the shortcut
menu it’s listed as ‘Find Content’). It’s
listed by reverse order in which it was last
created or edited, so the items that you
most want to look at are listed first.
Figure 10.1 The ‘Find Content’ link takes you to
the main Content page, which displays a list of all the
content on the site. The tabs at the top allow you to
view comments or Media on the site in the same way.
The ‘Scheduled’ tab lists items that have publishing
dates scheduled for them.
You especially want to go here to look for
content if it is not published (with the
exception of rotating images, you won’t find it
anywhere else).
To find content:
1. Click on ‘Find Content’ from the
shortcut bar.
2. Click on the title to go to the main
page for that piece of content; click on
‘edit’ to edit the content; or click on
‘delete’ if you want to go straight to
deleting it.
 Tips
 The tabs at the top of the page give
you quick access to a list of all
comments on the site, to media items
uploaded to the site and to the list of
items scheduled for publishing. These
work in a very similar way to the main
list of content items.
95
Chapter Ten
Filtering by Status and
Type
If the item that you are looking for is not
one of the most recently created or edited
items, you might need to thin the list down
a bit before you trawl through it.
You can filter either by Status (most useful
for looking only at unpublished content) and by
Type (i.e. to see just pages, or just articles
etc…).
To filter the list of Content:
1. Choose status or type (or both) from
the drop downs.
2. Press ‘Filter’
 Tips
 Once you have applied a filter, Drupal
will remember it (even next time you
visit this page). Once a filter is set, you
must press ‘Undo’ to clear it.
96
Figure 10.2 To filter by status or type, you choose
the option you want from one of the two drop downs
and then press ‘Filter’.
Managing Content
Bulk Operations
While you can edit every item in the ‘Find
Content’ list individually, sometimes you
will want to do the same thing to several at
the same time.
Figure 10.3 Checking items on the content page
allows you to perform a bulk operation on all the
items you have checked. The most useful of these will
be to allow you to delete several items of content at
one time.
The most common thing that you will
want to do is to delete a group of items, but
there are also options to bulk publish or
unpublish, set ‘promote to front page’
preferences or to update the URL alias
(useful if you have changed rules by which
these are created).
To perform a bulk operation:
1. Check every item you want to perform
the action on.
2. Choose the action you want to perform
from the ‘Update Options’ dropdown.
3. Press ‘Update’.
 Tips
Figure 10.4 The media ‘Operations’ options don’t
appear until you have selected at least one item.
 In the list of Media the bulk operation
options do not appear until you have
checked at least one item in the list.
 You can view media in either list view
of thumbnail view (using the icons at the
top right of the media page). The
thumbnail view will probably be the
most useful.
97
Chapter Ten
Searching for Content
You will not often need to search for
content. Because you can find most of the
content readily on the site, and easily see a
list of unpublished content from the ‘Find
Content’ link, you will usually have no
problem getting straight to the content
you want to view or edit.
Sometimes there may be a piece of content
that you cannot readily find, but you can
remember a word or two from. There is no
site-wide search form, but once you are
logged in as an administrator or editor,
there is one available to you in the
dashboard.
To search for content:
1. Choose ‘Dashboard’ from the top
admin menu.
2. Type in your search term (one or more
words) into the ‘Search Form’ box.
3. Press the ‘Search’ button.
4. A list of results comes up – click on the
title to take you to the page for the
relevant piece of content.
5. If you didn’t get the result you wanted
you can search again from this page.
 Tips
 You can go straight to search from the
URL ‘/search’ – this redirects to
‘search/node’ (node is the term for a piece
of content in Drupal).
98
Figure 10.5 There is a search form at the top right
of the ‘Dashboard’ page.
Figure 10.6 A more advanced search option is
shown at the URL ‘/search’. This is the page that
the results from the dashboard search box are shown
in, - so you will get here eventually in any case.
Managing Content
 On the main search page, there is also
an ‘advanced search’ option that allows
you to only search in certain content
types, and choose the rules by which
you search for content. You need to
click on ‘Advanced Search’ to make
these options visible.
Figure 10.7 If you press on the ‘Advanced Search’
link it will bring down some options for restricting
the search to particular content, or using different
combinations of words.
 There’s a tab at the top of the search
page for ‘Users’. Once there are a lot of
users on the site this is a good place to
go to search for a particular user. You
can go straight to it at the address
‘/search/user’.
 The dashboard also contains a list of
your most recent content, and, for
administrators, a management menu.
Please use these options if they are
helpful to you.
99
Term Descriptions
In This Chapter
Where you see Term Descriptions
Editing the Descriptions
Description URLs
102
103
104
11
We have already come across the ability to
tag articles with whatever ‘terms’ we like.
When you click on the tag (or ‘term’ to give
it a generic word that will cover speakers and
sermon series too) it will bring up a list of
Articles with the heading: ‘Articles tagged:
{your term name}’. The same works for
sermon series and for speakers. If you click
on the name of a sermon series, you get a
list of all the sermons in that series with
the title: ‘Sermons in the Series: {your series
name}’.
What you haven’t discovered yet is that for
any of those terms – tags, series or
speakers, you can also add a description.
This gives you the opportunity, for
instance, to provide a brief bio for a
speaker, or to give a short introduction to a
sermon series.
101
Chapter Eleven
Where you see Term
Descriptions
You find term descriptions on the list page
for the term, immediately under the page
title, and before the list of content.
If you are an administrator you can also go
straight to a list of term for a particular
vocabulary, and edit the terms and their
descriptions directly from there.
To list terms in a vocabulary:
Figure 11.1 The ‘term page’ for the speaker ‘Ian
Scott-Thomson’. Between the title (‘Sermons by: Ian
Scott-Thompson’) and the list of sermons is a term
description – here simply: ‘Ian is the Rector’. This
term description can be as long as you like.
1. Go to ‘Structure’ in the main admin
bar.
2. Choose ‘Taxonomy’.
3. Choose ‘list terms’ for the vocabulary
that you want to see the terms for.
4. If you choose ‘edit’ for the term you
want you will see the term description
in it’s editing form.
 Tips
 On the first taxonomy page (which
lists vocabularies) if you choose ‘edit
vocabulary’ you will see the
vocabulary title and a description. It’s
the description that is used in the title
of the list page (or ‘taxonomy term
page’). Don’t change the titles of the
vocabularies; but if you want to change
the titles of the list pages, do feel free
to edit the ‘description’ field.
Figure 11.2 The ‘Structure’ options that are
presented when you click on ‘Structure’ in the admin
bar.
Figure 11.3 Choosing ‘Taxonomy’ brings up this
list of ‘Vocabularies’.
102
Term Descriptions
Editing the Descriptions
You edit a term description just like you
edit any piece of content on the site. The
easiest way is to simply click on the ‘edit’
tab above the title of the list page.
Figure 11.4 Here I have chosen to ‘list terms’ for
the ‘Speaker’ vocabulary. You see a list of every
speaker that has been added as a term in the ‘speaker’
field of sermons. From here you can edit the term
directly.
To edit a description:
1. Go to the term page which lists items
that belong to that term. (I.e. by clicking
on that term wherever a post is tagged
with it.)
2. Click on the edit tab at the top of the
page.
3. Fill out the description (just as you
would for a page or article).
4. Press ‘Save’ at the bottom of the form,
as per usual.
 Tips
Figure 11.5 Choosing to ‘edit’ Ian ScottThompson, I have brought up the term editing page,
which looks remarkably similar to a regular content
editing page. I can of course get here directly by
choosing the ‘edit’ tab on the term page (see fig.
11.1).
 You can of course edit term
descriptions straight from the list of
terms page described opposite.
 You might want to take advantage of
the ‘add terms’ option on the
vocabulary page. Although you can
add these in as you go, it might be
worth adding in a list of speakers or a
sermon series from this link, and then
creating the descriptions there and
then.
103
Chapter Eleven
Description URLs
Each of these list pages has a URL (so you
can bookmark the page which lists the sermons
of your favourite speaker…). These URLs are
automatically generated and are generally
things like ‘blog/{term-name}’.
If you want to change them, you simply
edit the URL in the same way that you did
for basic pages.
To edit the URL:
1. Go to the term description edit page.
2. Under ‘URL PATH SETTINGS’
uncheck ‘Automatic alias’.
3. Type in a new ‘URL alias’.
 Tips
 While you can change these, you are
strongly advised not to.
104
Figure 11.6 The rest of the taxonomy term editing
page does not have all the options that content
editing pages have. It has a ‘Relations’ option (which
we won’t use) and the ability to change the URL
alias for the page (which works the same as with the
URL alias for content items).
Term Descriptions
You have now reached the end of the topics
which an editor of the website needs to be
able to understand and have a good grasp
of. Well done. Hopefully you are now
sufficiently familiar with the editing tasks
you will need to achieve in Drupal that you
will only need to refer back to this manual
occasionally as a reference.
The remaining topics are for
administrators only.
105
12
Blocks
In This Chapter
What is a block?
How blocks are displayed
Understanding the Context
Editing blocks
Adding a new block
108
109
112
114
115
So far we have spend the whole manual
looking at managing the content which
appears in the ‘main content area’. There
are other elements on the page, though.
The ‘List of Recent Articles’, or the
‘Sermons Coming Up’ list on the sermons
page; the lists on the front page of recent
articles, events coming up and sermons
coming up.
All of these things are ‘blocks’ of content,
and this chapter explains what they are,
how they are displayed and how you can
control and edit them.
107
Chapter Twelve
What is a block?
A block is a reusable piece of content that
can be displayed on a number of different
pages on the site. For instance the footer
text giving the address of the church is a
‘block’ of text which is reused on every
page.
Most blocks are just used on a few pages
(or one page). The menu block is used on
every page in the ‘About’ section. The front
page blocks for the rotating images, recent
articles, events coming up, next service and
most recent sermon are only used on that
page.
Blocks can simply be static text (i.e. the two
footer blocks) or they can be dynamic
content (i.e. the menu block – which
dynamically presents new items in the menu as
you add them, and also responds to context by
expanding only items in the ‘active trail’).
Many blocks on the site provide a ‘View’ of
different content items on the website (i.e.
all the front page blocks). You’ll learn more
about ‘views’ and how to edit them in the
next chapter.
While dynamic blocks (views and the menu
block) need to be provided by modules,
blocks of simple text can be written by you
very easily, and using the principles in this
chapter displayed on exactly the pages of
the website that you choose.
108
Figure 12.1 In this sidebar region there are three
‘blocks’ one on top of the other. The first two are
produced by the ‘Views’ module; the last one is a
block of static content – with an image inserted into
the text editor field which links to Facebook.
Blocks
How blocks are displayed
Figure 12.2 The contextual link for this block
allows you to go straight to editing the view, or to
configure the block.
Every page on the website is built from a
template which pulls into the page the
various pieces of content that the page is
made up of. Each of the areas of the page
where you can insert content is called a
‘region’ and any region can be assigned as
many different ‘blocks’ as you like
(including the main content for the page) in
whatever order you choose.
You clearly want to leave the ‘main
content’ for the page in the ‘main content’
region – but you can add a ‘block’ before or
after the main content, and add as many
blocks to as many different regions on the
page as you like.
Figure 12.3 Choosing the ‘Configure Block’
option, we can see that the ‘Popular Tags’ block is
not set to display in any region of our theme. Why
can we see it on the website? It is being displayed by
the ‘Context’ module, not by the ‘Blocks’ module. If
you create a block that you want to be controlled by
the Context module make sure that it is not also
being set to be displayed by the Blocks module.
The decision to display a block on a
particular page (or not) is made by two
completely separate modules – the core
‘Block’ module, and a contributed module
called ‘Context’. If either module wants to
display a block it will get displayed, but
‘Context’ has more powerful options for
choosing groups of pages, so most blocks
on the site are not assigned a region by the
‘Blocks’ module, but by the ‘Context’
module.
If you choose ‘Configure Block’ as a
contextual link, and see that the block is
assigned to Region – ‘None’, then you
know that it is being displayed by the
Context module and not by the ‘Block
Module’ – you will need to understand and
edit the context to change the way that the
block is displayed.
109
Chapter Twelve
Regions
The page regions that you should use on
the website that appear on every page are
the following:
 Content
The main content region (main
column) on each page. This is switched
from the left hand to the right hand
side of the page by the ‘About’
Context, but is the same region.
 Sidebar first
This is the sidebar on the page and is
probably the region that you will
assign any new blocks you create to.
 Footer
The left hand region in the footer
(which contains the church address).
 Footer Second Region
The right hand region in the footer
(which contains contact details).
The following regions are only in use on
the front page. [They can be used on any page,
but it is very strongly recommended not to do
this.]
 Image Rotator
This region is exactly the right size to
hold the image rotator block and is
positioned at the top right of the main
area of the page.
 Panel First Region, Panel Second
Region, Panel Third Region
These three regions are three columns
that are displayed side by side
underneath the main content region.
110
Figure 12.4 Choosing ‘Demonstrate block regions’
from the top of the Blocks page shows you where all
the active regions are on the page.
Blocks
The final regions are standard Drupal
regions, and have been left in the church
website theme for the sake of compatibility
with modules that might assume they
exist. None of these are used to display
blocks on the site.
 Header
This is output straight after the
website logo.
Figure 12.5 The Blocks displayed by the blocks
module can be seen by choosing ‘Structure’ and then
‘Blocks’ to pull up the main Blocks page.
 Sidebar second
This is placed immediately after
sidebar first – so will simply extend
the sidebar downwards.
 Highlighted and Help
These two regions are output in the
main column immediately before the
main content tabs and title.
Figure 12.6 Also in the ‘Structure’ options is
‘Context’. Context will determine when and where
most of the blocks on the site are displayed.
[Apart from these regions, the page template
also outputs the logo on every page in the
header, along with the main navigation menu
and a secondary menu (which is at the top right
of the header when you are logged in) and a
‘messages’ variable, which displays full width
just underneath the header (to tell you that you
have successfully saved changes for instance).
The tabs for editing the main content and the
page title are also directly output by the
template. The image at the right of the header,
and the coloured background of header and
footer are part of the template itself.]
111
Chapter Twelve
Understanding the
Context
Almost all the blocks are controlled by the
‘Context’ module. [The exception is the two
blocks which are displayed in the footer region.]
A ‘Context’ defines a particular set of pages
within the site – i.e. each ‘Section’ of the
site has been set up as a different ‘Context’.
The ‘Context’ module allows us to define
the conditions that create a certain context,
and a set of reactions that will take place in
that Context. The Context module is more
powerful than just displaying blocks (it is
responsible for switching the position of the
main content and sidebar within the ‘About’
section), but controlling blocks is its most
useful function, and the one we are
concerned with here.
Figure 12.7 The ‘Context’ page shows you a list of
available ‘Contexts’ within the website. These are set
up as a Context for every section of the website – i.e.
each link from the main navigation bar.
To add a block to a context:
1. Choose ‘Structure’ from the main
admin bar.
2. Choose ‘Context’.
3. Choose ‘Edit’ for the context where
you want to add the block.
4. Under ‘Reactions’ click on ‘Blocks’ – a
list of regions and the blocks they
contain appears on the right.
5. In the far right column there is a list of
available blocks – check the one that
you want to add.
6. In the Column of Regions press ‘+Add’
on the right of the Region you want to
assign the block to.
112
Figure 12.8 Clicking on ‘Blocks’ under ‘Reactions’
at the bottom of the context page brings up a list of
the regions with the block assigned to them by
‘Context’. These blocks will display whenever the
context is active – i.e. when the conditions in the
‘Conditions’ section have been met.
Blocks
7. If there’s more than one block in that
region, use the drag handles to reorder the blocks as you want.
8. Remember to ‘Save’ the form at the
bottom of the page.
Figure 12.9 To add a block to a particular region
first tick the block you want to add, then choose
‘+Add’ in the region you want to add it to. You can
drag to reorder the blocks, and use ‘x’ to remove
them.
 Tips
 To remove a block from a region you
simply press the ‘x’ to the right of the
block name in the region.
 To re-order blocks, you simply reorder the blocks and press ‘Save’ – no
need to add or remove blocks if you
don’t need to.
 If you wanted to display blocks that
only logged in users could see, you
could try cloning the Context, naming
the clone something like – ‘About –
logged in’, and then adding a ‘User’
condition that required users to be
logged in. Then add blocks to that
context that only logged in users
should see.
 Context displays the regions of all the
available themes – don’t let that
confuse you – just make sure you only
put blocks in the regions we’ve already
described.
113
Chapter Twelve
Editing Blocks
Blocks provide a contextual link to
‘Configure Block’. For text blocks this
provides an editing page where you can
edit the content of the block. For the menu
block it provides options about how the
menu will be displayed. For blocks
provided by ‘Views’ you should edit the
view by choosing ‘edit view’ from the
contextual menu.
The ‘configure block’ option also always
gives you options as when and where to
display the block. If you are using ‘Context’
to set where the block displays you should
make sure that the display in the
‘Configure Block’ form is set to ‘- None -’.
To edit a block:
1. Hover over the block you want to edit.
2. Click on the contextual menu gear
icon.
3. Choose ‘Configure Block’ to edit text
blocks or menu blocks; or choose ‘Edit
View’ to edit views blocks.
 Tips
 Some blocks will not provide any
configuration options. All the available
options will be found within the
module configuration pages for that
module.
114
Figure 12.10 Choosing ‘Configure Block’ for the
‘Find us on Facebook’ image brings up this editing
page. The content of the block is simply the content of
the text editor. If you go to this editing page and
scroll down it, you can see that this block is not
displayed anywhere in the ‘REGION SETTINGS’
fieldset. It is displayed instead by the Context module.
Blocks
Adding a new block
Sometimes you may want to add a new text
block. The ‘Facebook’ link on the blog
pages is an example of just such a block.
To add a new text block:
1. Choose ‘Structure’ from the admin
Figure 12.11 The ‘+Add block’ link is at the top
of the Blocks page. You can also choose to add a
menu block here too. Blocks provided by other
modules (like Views) are not controlled here, but
within the relevant module administration pages.
toolbar, and then ‘Blocks’.
2. Choose ‘+Add block’ from the top of
the page.
3. Fill out the new block form.
 Tips
 If you want the block controlled by
‘Context’ make sure that you leave the
‘REGION SETTINGS’ with the
region set to ‘none’. Once you have
saved your block, go and add it to the
context you want in the way described
previously.
115
13
Views
In This Chapter
What is a view?
View Titles
Number of View Items
118
120
121
A ‘View’ is a customised list of content.
The Views module provides a very
powerful set of tools which allows lists of
content to be provided according to almost
whatever rules you conceive, and gives you
complete control over how that view is
displayed.
For ‘powerful’ read complicated. This
chapter will not teach you how views
works nor is it safe to experiment – you
run the danger of breaking something that
you will not be able to mend. If you want
to experiment with Views, then set up a
clean website (with a different address to
the church website) and experiment there.
We will look at how you can edit just a
couple of the views settings for a particular
view.
117
Chapter Thirteen
What is a view?
We described a view as a customised list of
content. In fact one view can provide
several different lists of content (or
‘displays’). The options provided by views
create complex database queries on your
content, and rules for formatting the
database fields that it retrieves.
Let’s look at an example – so on the front
page, hover over the ‘From the Blog’ block
and choose ‘edit view’.
Under ‘Displays’ are the various Displays
that have been set up for this view – Page
(the page view that you get when you go to
‘Blog’); ‘Front Page Block’ (on the front
page), ‘Recent Articles Block’ (in the sidebar
on every page in the Blog section); and ‘Feed’
(which provides an RSS feed at ‘/blog/feed’ –
see appendix 9 on ‘Feeding Facebook’). You
can see that it is the ‘Page’ display that we
are on, not the ‘Front Page Block’ – even
though that is where we came from. Click
on ‘Front Page Block’ to get to the settings
for the Front Page block that we came
from.
Figure 13.1 The front page has 5 different views
displays on it, provided by 4 different views. The
rotating image, ‘From the Blog’ and ‘Coming Up’
blocks are provided by their various ‘views’ settings.
The ‘Next Service’ and ‘Most Recent Sermon’ are
two displays provided by one ‘view’.
Figure 13.2 The easiest way to see that view
options is to choose ‘Edit view’ from the contextual
links.
The first column describes the elements
that go into putting this display together:
 Title
The block title.
 Format
The ‘format’ option describes how the
view will be displayed. [This block is
just a list – the rotating images block is a
slideshow.] The ‘show’ option allows us
individual fields, or the whole node
content.
118
Figure 13.3 The ‘Articles’ view settings that you
see when you click ‘Edit view’ from the ‘From the
Blog’ block on the front page. Notice that there are
four different ‘displays’ – you are not taken to the
display that you clicked the ‘Edit view’ link from.
The display for the front page is called ‘Front Page
Block’. If you create new displays do give them names
that help you identify them easily.
Views
 Fields
We can choose all the fields that we
want to be part of this view display,
and how they will be formatted.
 Filter Criteria
By default the view will list every piece
on content on the site. We filter that
here by asking for only content that is
published and of type ‘Article’.
Figure 13.4 We’ve switched to the ‘Front Page
Block’ display. Each ‘display’ starts off with the
default options that you set up when you created the
view – but each one can be overridden. On our
church website, we have set up one ‘view’ for each
content type that we are wanting to display lists of,
and then as many ‘displays’ as we want different
ways of displaying that content type.
Figure 13.5 The ‘BLOCK SETTINGS’ section
will tell you the block name that this block is given
when you look for it in the Blocks or Context pages.
 Sort Criteria
What order do we want the list of
items displayed in. Here, we have
asked for reverse order of the posting
date.
The next column describes the basic layout
of the whole view display and the number
of items that will be displayed.
 Block Settings
The ‘Block Name’ is the name that you
will see in the Block or Context lists
for adding blocks to regions. The
‘Access’ settings allow you to restrict
who will be able to view this.
 Header and Footer
Will add text before and/or after the
view
 Pager
The pager is displayed at the bottom
of the page to break a long list of
results up into various pages. It is also
used to restrict the number of results
that are shown. Here it is used to
restrict the number of items to just
two. If you have restricted the number
of items returned you can set a ‘More
Link’ – to link to a list of all the
results.
The third column is hidden until you press
‘Advanced’. Leave it hidden.
119
Chapter Thirteen
View Titles
The view title will be the title that is
displayed either as the page title for a page
view, or as the block title for block views.
To change the view title:
1. Make sure that you have selected the
display that you want to change the
title of.
2. Under ‘TITLE’ click on the current
title name.
Figure 13.6 Clicking on any items in the views
display will bring up the available options. Here we
have clicked on the ‘Title’. You either set the property
for this particular display (override), or you set it for
every display in the view (all displays) – which will
set the default option that is used by every block
which has not chosen ‘override’ for that option.
3. Every display in the view will use the
same settings unless you override
them for a particular display. You will
generally want titles to be specific to a
particular display, so in the ‘For’
dropdown choose ‘This Block
(override)’.
4. Write the new title in the title field.
5. Click ‘Apply (this display)’ (or ‘Apply
(all displays)’ if you have chosen to edit the
default title).
6. At the top right of the view form, you
must now click ‘Save’ to save the
changes you have made.
 Tips
 It is easy to think that once you have
clicked ‘Apply’ you have saved your
change. The changes you make to a
view are not saved until you have then
pressed ‘Save’.
120
Figure 13.7 Even after you have clicked ‘Apply’
for your particular option it is not applied to the
view until you press ‘Save’ at the top right of the
View page.
Views
Number of View Items
Figure 13.8 In the ‘PAGER’ section you can see
whether the view is set to display over a number of
pages with a ‘pager’ at the bottom (i.e. - see the
bottom of the main sermons page) or whether it is set
to display a fixed number of items. Clicking ‘2 items’
allows you to change that number.
The ‘More link’ provides the ‘All Articles’ link at the
bottom of the ‘From the Blog…’ block and you can
change that text here.
A particular view display may have been
set up to show a specific number of items
(two articles and three upcoming events on the
home page for instance). You may want to
change how many items are displayed.
To change the number of items:
1. Make sure you are in the right display.
2. Under ‘Pager’ there will be a link
which simply reads ‘2 items’ (or
however many items it is). Click this link.
3. Change the number of ‘Items to
display’.
4. Click ‘Apply’.
5. Click ‘Save’ in the main view form.
121
14
Backing Up
Backing things up always sounds very
boring until you lose something, and then
you kick yourself for not doing it.
In This Chapter
Why Back Up?
How to back up
How to restore from a backup
Why and how to test a backup
124
125
126
127
Your hosting provider should provide
backups to roll back to if something goes
wrong, but you should do it yourself too.
123
Chapter Fourteen
Why Back Up?
Probably nothing will go wrong, but:
 Something horrible could happen to
your hosting provider (not very likely,
but possible).
 You could do something stupid (which
I’m sure you won’t, but…).
 Some virus or malicious code could
corrupt your web files or your
database (also not likely, but possible).
Especially it’s worth noting that there is no
‘undo’ when it comes to website editing. If
you click the ‘select all’ box on the list of
content, and then choose ‘Delete’ in the
update actions drop down all the content is
deleted. You cannot get it back – not any
way, not ever. Not, that is, unless you
backed it up earlier.
124
Backing Up
How to back up
We are going to back up the database – but
this will not back up all the files (audio,
images etc…) saved in the files directory of
the website, so we will also back up all the
files in the ‘public’ files directory.
Figure 14.1 Backup and Migrate is in the
‘SYSTEM’ section of the ‘Configuration’ page.
To back up:
1. Click on ‘Configuration’ in the admin
toolbar.
2. Click on ‘Backup and Migrate’ in the
‘System’ section.
Figure 14.2 Clicking ‘Backup now’ from this
screen will provide a straightforward backup of the
database to a backup directory on the website. You
want to change the second drop down so that it reads
‘download’ and then repeat, changing the first
dropdown to ‘Public files directory’ so that you
download files too.
3. Click ‘Backup now’ to download a
backup of the database.
4. Change the first drop down to ‘Public
Files Directory’.
5. Click ‘Backup now’ to download a
backup of the public files directory.
 Tips
 The files backup in particular will be
huge – don’t keep them all forever.
Have a schedule – you might keep
fortnightly backups for two months
and then delete them.
 The database (but not the files) is
backed up on the webserver daily, and
kept for a week. This should allow you
to restore to any point in the last week
if something goes wrong and the
database becomes corrupted for any
reason. You can change this routine on
the ‘Schedules’ tab.
125
Chapter Fourteen
How to restore from a
backup
If something has recently gone wrong, you
should first try to restore from a recent
database backup on the server. Be aware
that this will eradicate any good changes
that anyone has made since that backup.
Figure 14.3 The ‘Restore’ tab will let you upload
a backup file from your computer and restore from
that. You need to restore both database and the
public files.
To restore from a backup on the
server:
1. Go to ‘Configuration’, then ‘Backup
and Migrate’.
2. Choose the ‘Destinations’ tab.
3. Choose ‘list files’ for the Scheduled
Backups Directory.
4. Choose ‘restore’ for the date you want
to restore back to.
To restore from a backup on your
computer:
1. Choose the ‘Restore’tab
2. In the first drop down select whether
this is a database or public files restore
3. Choose a file to upload and upload it.
126
Figure 14.4 From the ‘Destinations’ tab you can
list the contents of the ‘scheduled backups directory
files’ – from this page you can roll the database back
to previous states – each restore file is listed by date.
Particularly if someone has really made a hash of
some configuration options on the website this is the
way to roll the website back to the day before it
happened. Be aware that you will also lose any
desirable changes since that point.
Backing Up
Why and how to test a
backup
Nothing worse than thinking that you have
perfectly good backups and then
discovering that they are corrupted and
unusable. You should test your backups
from time to time by installing them on a
copy of the website set up just for this
purpose.
To test a backup:
1. Set up a clean installation of the
website (see appendix 4).
2. Restore the database and public files of
the backup that you are testing.
 Tips
 Once you have learned to set up a
clean installation of the website, you
will also have somewhere to play with
Views, and new modules that you
would like to test out.
 If you are upgrading modules on the
website, back up before you upgrade
(just the database would be fine).
 If you are upgrading the Drupal core,
then especially backup (and the files
too).
127
15
Emails
In This Chapter
Site email when people register
Setting up email addresses
A new email address
A new email forward
130
131
132
133
The website will send out email when
people register or reset their email – to
them and also if approval is needed to a site
administrator.
You should choose an email address (in the
church website’s domain) that will receive
this email which will go to someone who
will do something about it. Using a
forwarder, you could forward this email
(say ‘website@...’) to several people if there
is not a single individual who will reliably
be around to deal with requests to
authorise accounts etc…
Although setting up emails for individuals
(rector@ , wardens@ etc…) is not a
function of the website, but of your hosting
account, this is covered here because it is
something that you will need to be able to
do.
129
Chapter Fifteen
Site email when people
register
When people register, they receive an
email from the website’s email address, and
that address will get an email if the new
user needs authorising.
To set the site email:
1. Go to ‘Configuration’ and then ‘Site
Information’ in the ‘System’ section.
2. Change the email address in the ‘SITE
DETAILS’ section.
Figure 15.1 The ‘Site Information’ page allows
you to change the site email address – this is the
email that notifications – like the fact that there is a
user who has registered and is waiting to be
authorised will be sent to.
 Tips
 You should set this email address to an
address that belongs to the website’s
domain.
 Set up the address as a forward to the
email account(s) you’d like the email to
eventually get to.
 You can customise the email that the
site sends out by going to:
‘Configuration’, then ‘Account
settings’ in the ‘People’ section. The
email settings are most of the way
down this page.
130
Figure 15.2 ‘Account Settings’ in the ‘PEOPLE’
section of the ‘Configuration’ page will allow you to
customise every email that is sent out from the site
when people register etc…
Emails
Setting up email addresses
Figure 15.3 The ‘cPanel’ allows you to configure
all the hosting options you have available. The email
options are all in the ‘Mail’ section.
You can access your hosting account
options (their ‘cpanel’) very easily from the
URL ‘/cpanel’ without having to leave the
website. You will need log in credentials,
which you will need to work out where to
keep securely. From the cpanel you can
control lots of options within your account
– you should leave most of them alone.
To log into the cpanel:
1. From the website, type ‘/cpanel’ after
the website name in the address bar,
and hit enter.
2. Enter your credentials and log in.
In the cPanel the mail options are all
displayed in the section with the title
‘Mail’. There are two basic forms of email
you will set up – one is a straight forward
email address, which you access from the
‘Email Accounts’ link; the other is a
‘Forwarder’ – which you access from the
‘Forwarders’ link.
An email set up on the site will store mail
in your webspace, and allow access to it via
webmail or an email client using POP3 or
IMAP.
A forwarder will simply forward email to
your own email account. I recommend that
you set up all forwarders if possible, and no
actual email accounts.
131
Chapter Fifteen
A new email address
You set up a new email address using the
‘Email Accounts’ link. This email address
will then need to be set up in the user’s
email client (Outlook Express etc…) by the
user.
To set up a new address:
1. Click ‘Email Accounts’ in the cPanel.
2. Enter an email and password.
3. Set the Mailbox Quota
4. Click ‘Create Account’
To get the account set up details:
1. To the right of the account you’re
setting up click on the ‘More’ drop
down and choose ‘Configure Email
Client’.
2. If you are on the users computer
choose an auto-configure option if
there is an appropriate one.
3. Otherwise copy the Manual Settings
and mail them to the user to set up
their own email client.
132
Figure 15.4 The email accounts page allows you to
easily set up a new email account. The details that
you need to configure an email client can easily be
found by choosing ‘Configure Email Client’ from the
‘More’ drop down to the right of the account you
want to configure.
Emails
A new email forward
Use forwarders where possible. Everyone
already has an email account – forward
their mail to that.
To set up an email forward:
Figure 15.5 The Forwarder page has a link
underneath the list of existing forwards: ‘Add
Forwarder’. Choose this link to create a new
forward. Forwards are really useful, and won’t take
up any of your available webspace in storing people’s
emails.
1. Click ‘Forwarders’ in the cPanel.
2. Click ‘Add Forwarder’ after the list of
Email Account forwards.
3. Type the address to forward (you are
essentially creating the new email
address here).
4. Type the destination to forward to (i.e.
the user’s existing email).
5. Click ‘Add Forwarder’
 Tips
 You can set one email address to
forward to several different accounts –
you just need to set up a separate
forwarder for each account that you
want to receive the mail.
133
Appendices
A1 – Modules
Modules – Core and Contributed
The Drupal system is extended by modules. Some of these modules come with the ‘core’
distribution – and handle such fundamental functions as saving content. These most
fundamental modules are required by Drupal and cannot be switched off, but it gives you an
idea of how deep the modular architecture goes.
As well as core modules that are required there are plenty of optional core modules – many of
which are required by the church website. ‘Comments’ is an example of one of these - switch it
off, and there are no comments on the site. All the core modules are in the ‘modules’ folder
inside the root folder of the website.
The extensibility of Drupal really comes into its own with the possibility of adding contributed
modules. ‘Views’ is a contributed module which the website couldn’t exist without for instance.
At drupal.org/download are links to lists of modules. There are currently more than 9,000
modules freely available for download – so you might like to start with the ‘Most Popular’ list.
Contributed modules are not stored in the ‘/modules’ folder, but in ‘sites/all/modules’. The
/sites folder contains all the files that are specific to your site (apart from some customisation of the
.htaccess file in the root folder), so it makes it easy to update Drupal core – you simply update
every single file and folder in the root folder with the new version of Drupal, but leave the
.htaccess file and the /sites folder alone.
Modules can be installed fairly automatically. On the Drupal module page, you need to copy the
address of the link to the module download. From the top of the ‘Module’ page you choose ‘+
Install new module’ and then paste the address and click install. You will then need to go to the
module page again and place a check before the module name to install it. Contributed modules
can also be automatically updated from the update page (unless you are using development
versions).
Some modules require 3rd party ‘libraries’ to function – the text editor is an example of this.
These libraries must be downloaded and then manually uploaded to the ‘/sites/all/libraries’
folder.
137
Appendix One
Core Modules in Use
These are the core modules which should be switched on for the site to function properly. They
are all in the top ‘Core’ section of the Modules list:
Block, Comment, Contextual links, Dashboard, Database logging, Field, Field SQL
storage, Field UI, File, Filter, Help, Image, Menu, Node, Number, Overlay, Path, Search,
Shortcut, System, Taxonomy, Text, Toolbar, Update manager, User
All of these are part of the Drupal core distribution, which is currently at Drupal 7.9.
There are a few other Core modules enabled (they’re enabled by default when you install
Drupal) which are not in use – don’t worry about them – if you’re really into optimising
performance you might switch them off.
Contributed Modules in Use
There are various areas of functionality that require contributed modules. Often one module
will require another one, or have a couple of modules that extend its functionality. All of the
modules are available for downloading at drupal.org/project/{project-name}.
Modules that handle URLs
The following modules are responsible for creating good looking URLs automatically:
Pathauto (/project/pathauto – 7.x-1.0-rc2)
This is the module that provides automatic path aliases (so that new article has the address
‘/blog/{article-name}’ rather than something incomprehensible like ‘node/1348’. The
configuration options for Pathauto can be found in ‘Configuration’ in ‘URL aliases’ in the
‘Search and Metadata’ section. (along with sub path options).
Token (/project/token – 7.x-1.0-beta6)
Required by pathauto.
Sub-pathauto (Sub-path URL Aliases) (/project/subpathauto – 7.x-1.1)
Extends the path aliases to the subpaths (i.e. /about can be edited at /about/edit).
Global Redirect (/project/globalredirect - 7.x-1.3)
When a path is aliased, the old path remains. This module provides a redirect from old to new
which is better for search engine performance. You should not need to change the default
configuration options at ‘Configuration’ then ‘Global Redirect’ in the ‘System’ section.
138
Modules
Modules that provide views of content on the website
The views module is quite powerful on its own, but there are many other modules which extend
it; we use a couple of these to extend views on the church website.
Views (/project/views - 7.x-3.0-rc1)
Views can be created or edited at ‘Structure’ then ‘Views’. We have only considered views of
content, but views can also provide views of files or users among other things. This also
provides the Views UI module, which must be enabled for views to be edited.
Chaos Tools Suite (ctools) (/project/ctools - 7.x-1.0-rc1)
Required by views. This provides a suite of modules – you only need to have the ‘Chaos tools’
module itself enabled; you can ignore the rest.
Views Slideshow (/project/views_slideshow - 7.x-3.0)
Provides the slideshow view on the front page of the website. Both ‘Views Slideshow’ and
‘Views Slideshow Cycle’ must be enabled in the modules list. The slideshow requires a
javascript library – which requires the next module (libraries) and the library itself being added
to /sites/all/libraries/ (see more about this in the libraries section of this appendix). The module
provides and extra ‘Format’ option for views, and the settings of views slideshow are accessed
from the view display page under ‘FORMAT’ in the ‘settings’ link that appears next to ‘Format:
Slideshow’.
Libraries API (/project/libraries - 7.x-1.0)
Allows Views Slideshow (and other modules) to look for its required javascript library inside
/sites/all/libraries.
DraggableViews (/project/draggableviews - 7.x-1.x-dev)
Provides drag handles for reordering views lists. Used on the website for reordering rotating
images. Also provides a test module (DraggableViews Tests) which does not need to be
enabled. Provides a ‘Draggable Table’ format to views, and its settings are reached from the
setting link for the format in the views display (like with views slideshow).
Modules that provide rich text editing
There is no rich text editing out of the box with Drupal. If you want rich text (i.e. a ‘Word like’,
‘WYSIWYG - what you see is what you get’ editor, you must choose one.
CKEditor – WYSIWYG HTML editor (/project/ckeditor - 7.x-1.3)
CKEditor is module which allows Drupal to use the CKEditor javascript library. The library
itself must be downloaded from ckeditor.com/download and added to /sites/all/libraries.
CkEditor can be configured to provide a whole pile of different options at ‘Configuration’ then
‘CKEditor’ within the ‘Content Authoring’ section. The files ckeditor.config.js and
ckeditor.styles.js have been copied into the theme folder for the website and then customised
there. Some options (setting the width of the editor content to 620 pixels – set in the config file, and the
139
Appendix One
styles dropdown choices – set in the styles file) can only be set by hardcoding these files. More
documentation at the ckeditor project page, and from ckeditor.com.
Media (/project/media - 7.x-1.0-rc2)
Provides media uploading from the ‘Media’ tab in the main ‘Content’ page; and a method for
uploading and inserting images within CKEditor. It is worth looking out for a stable 7.x-2.0
version of the module to be released. At that point it would also be worth trying Media Internet
Sources and the YouTube module. Media options are configured from various options in the
‘Media’ section of the ‘Configuration’ page.
File entity (fieldable files) (/project/file_entity - 7.x-1.0-rc2)
Required by Media.
Modules that extend the basic content handling
Drupal core provides a number of different field types, display formats and ‘input filters’ for
controlling how content types can be put together and displayed. Contributed modules can
extend the core options for content types - adding field types, display formatters, publishing
options and filters.
Date (/project/date - 7.x-2.0-alpha4)
Provides a date field for content types. Date provides a whole bundle of modules – ‘Date API
and ‘Date’ get the basic functionality for content types. ‘Date Popup’ gives you the popup date
picker and ‘Date Views’ allows Views to use date fields in its sorting etc… Most of the date
setting are to do with setting up new content types – at ‘Structure’ then ‘Content Types’; the
pop up options are given at ‘Configuration’ then ‘Date Popup’ within the ‘Content Authoring’
section.
SpamSpan filter (/project/spamspan - 7.x-1.1-beta1)
This filter ‘obfuscates’ email addresses that you publish in your content. This means that they
cannot be harvested by spam robots. It may cause issues, especially with creating email links
from the rich text editor. Turn it off if it’s a pain. You can configure it’s options at the bottom of
the text format form on a per text format basis (go to ‘Configure’ then ‘Text Formats’ within the
‘Content Authoring’ section; then click ‘configure' for a particular text format).
Scheduler (/project/scheduler - 7.x-1.0)
Allows scheduled publishing of content on a per content type basis. Global options at
‘Configuration’ then ‘Scheduler module settings’ within the ‘Content Authoring’ section.
Content type options for switching scheduler on or off are on a per content type basis – and can
be found on the content type editing pages – ‘Structure’, then ‘Content types’, then choose ‘edit’
for the particular content type.
MediaElement.js (/project/mediaelement - 7.x-1.1)
MediaElement is a module that provides an interface for using the MediaElement.js html5
player as a display formatter for mp3 files. It needs the javascript library from
mediaelementjs.com to be placed in /sites/all/libraries/. It seems generally reliable, but
140
Modules
currently has trouble in Chrome on Mac – this is an issue with the library, not the module – so
check for newer versions of the library from time to time. Configuration is at: ‘Configuration’
then ‘MediaElement.js’ within the ‘Media’ section. Choosing ‘Enable MediaElement.js site wide’
will make it available whenever there is an <audio> or <video> html5 tag – so this should be
set if you want to use this tag to place your own audio players inside text areas where the
player is not already set as a display formatter within that content type.
Other Modules
Context (/project/context - 7.x-3.0-beta2)
We have covered the Context options in chapter 12 (Blocks) in the section ‘Understanding the
Context’. As well as the ‘Context’ module you should also enable the included ‘Context UI’ if
you want to be able to edit contexts. ‘Context layouts’ need not be enabled.
Menu block (/project/menu_block - 7.x-2.2)
Provides a configurable menu block. We covered lots of the options for this in Chapter 2. New
Menu Blocks can be created from ‘Structure’ then ‘Blocks’ then choose ‘+ Add menu block’ at
the top of the page. Global configuration is at ‘Configuration’ then ‘Menu block’ in the ‘User
Interface’ section. Menu block also includes the ‘Menu Block Export’ module which does not
need to be enabled.
Features (/project/features - 7.x-1.0-beta4)
Features allows you to save a whole pile of site configuration options – views settings, menu
settings, ckeditor settings etc…. It is used in the setting up of a clean site from scratch to
quickly configure all these site options. It can safely be left switched off, but if it is switched on
will provide a way to revert views settings etc… to their ‘out of the box’ set up for a church
website as described in this manual. The included ‘Date Migration Example’ module should be
switched off.
Backup and Migrate (/project/backup_migrate - 7.x-2.2)
Module for backing up the database. Options covered in chapter 14 – Backing Up.
Backup and Migrate Files (/project/backup_migrate_files - 7.x-1.x-dev)
A plug-in module for Backup and Migrate to include the ability to back up files from the site.
Needs the server to be set up right for compressing files – detail on the Project page.
Libraries
Some of the modules rely on external javascript libraries. These are not uploaded automatically
when you install the module through the Drupal install module form, but must be uploaded
manually, using an ftp client. You need an ftp client (fireftp is a free plugin for the firefox browser
and works well for this) and the ftp credentials for the website. More information at the end of
appendix 3.
141
Appendix One
mediaelement (current version: 2.2.5)
You should download and unzip the latest from mediaelementjs.com, then rename it
‘mediaelement’ and upload the folder to /sites/all/libraries.
ckeditor (current version: 3.6.2)
As above – download the lastest, from ckeditor.com, make sure the folder is called ‘ckeditor’ and
upload the latest to /sites/all/libraries.
jquery.cycle (current version: 2.9997)
You get the jQuery file from: jquery.malsup.com/cycle – follow the download link and choose
the full cycle plugin. It is single file called jquery.cycle.all.js – you need to rename this to
jquery.cycle.all.min.js (there used to be a file called this to download – a compressed version of the
original, and that is what views slideshow will look for). Put it in a folder that you name
‘jquery.cycle’ and upload to /sites/all/libraries.
Upgrading Modules
If you go to ‘Reports’ and the ‘Available updates’, you will see a list of the Drupal Core version
you are running, and all the modues that you are running including their version number and
the most recent version available. Newer versions of modules will provide fixes for some bugs
and possible minor improvements. Unless the update is a ‘security update’ there is no need to
update if everything is running fine. Modules have version names like 7.x-2.2. The 7.x means
that the module is for Drupal 7 (so you always need that at the beginning of a module name).
The first ‘2’ tells you that it is the second major version of that module, and the ‘2’ after the dot
tells you that it is the third release of that version of the module (the first was 7.x-2.0). Don’t
upgrade modules to a different major version number unless you’re confident in what you’re
doing, and prepared to put things back the way you found them if it doesn’t work out. You can
safely upgrade the minor versions. The other naming conventions are added to the end of the
version number with an ‘x’ as the point release. These are –dev on the end (i.e. 7.x-2.x-dev)
which means that it is a development version (these contain the latest bug fixes but haven’t
necessarily been widely tested); alpha and beta numbers (alpha means not really ready and beta means
nearly ready – some people’s modules never get out of beta); and a release candidate number on the
end (like 7.x-2.x-rc3 – for release candidate 3). A proper version number feels safer, but isn’t
always so.
If there are available updates, there will be a notice at the top of the main module page telling
you so and offering you a link to the updates page.
To update a module:
1. Go to the modules page.
2. Click on the ‘Update’ tab.
3. Check the modules you’d like to update
142
Modules
4. Click ‘Download these updates.
 Tips
 Don’t engage in upgrading modules unless you have time to test everything thoroughly.
 If the newer version of the module is causing problems, you will need to go back to the
previous version. Go to the module project page on drupal.org. The file that you want to
download has been superceded, and it is the newer version listed on the project page that is
causing problems and is showing in the ‘downloads section’. You can always get a copy of
the older release by clicking on ‘View all releases’ at the bottom of the project page. To
downgrade a module (if you have problems) disable it by unchecking the module on the
module list. Go to the uninstall tab of the modules page and uninstall it (if that’s an option).
Then you must physically remove the module folder from your website (via ftp) – it will be
a folder in sites/all/modules/. Then install the older version of the module in the normal
way.
Upgrading Drupal Core
Drupal core must be upgraded ‘manually’. This means that you have to download the files from
drupal.org and then replace the existing files on your webserver with the new ones.
This is clearly not for the faint hearted, and you might well want to test this out on a clean
version of the website (see appendix 4, before doing it ‘for real’. You cannot upgrade from 7.x
distributions to an 8.x one, but you should be prepared to upgrade through the minor version
numbers, especially if there is a ‘security update’.
There are full instructions for upgrading Drupal core at drupal.org/node/1223018. If you are
going to upgrade the core, please review this page fully as well as the notes here.
To upgrade Drupal Core:
1. Perform a full backup including files.
2. Test the backup in a different space on your webserver (i.e. somewhere like
backuptest.{websitename}).
3. Do not proceed unless you now have a fully working version of the website in a different
webspace.
4. Download the new version of Drupal core, and uncompress it on your local computer. Use
this to replace sites/default/default.settings.php with the newer version of the file.
5. Now delete the sites folder from the local copy of Drupal.
143
Appendix One
6. Either update the .htaccess file in root folder of your local copy of Drupal to reflect
customisations in the old .htaccess file or simply delete it.
7. Delete everything in your webserver’s root folder for the website, except the .htaccess file
(if you’re not updating it) and the /sites folder.
8. Upload the new files to this space.
9. Go to you website and type /update.php after the website name in the address bar to go to
the update.php page, which you need to visit in order to update the database.
144
A2 – Theme
The appearance of your website is controlled by the theme. Just by switching theme you can
make your website look completely different but with all the same content. The theme controls
how a page is laid out, and colour and typography choices.
Along with modules and libraries, themes are the final way in which a drupal installation is
customised for a particular user. Unlike modules, the theme has been created specifically for
you, will not be updated and therefore will never appear as an ‘available update’ on the updates
page. Broadly speaking, you should not change it, and should therefore not require any of the
information in this appendix.
If there are some aspects of the layout of the site that you really do want to change, then keep
reading. You can change the website logo, or the ‘favicon’ (the little icon that appears next to
the website name in the browser tab or in favourites); you can change the layout of the page –
so that different regions are in different places; and you can change colours, font-sizes and other
typography choices. These things are reasonably easy to tweak. Do keep a record of your
changes, though, so you can put things back if needed.
Theme settings
The theme is set by going to ‘Appearance’. The default Drupal theme is ‘Bartik’ and the default
administration theme is ‘Seven’. If you want to see ‘themes’ at work, then enable Bartik and
then set it as the default – the website will look completely different.
The settings for a particular theme can be accessed by clicking ‘settings’ next to the theme
name. The options are self-explanatory.
Logo and favicon
The logo and favicon can be changed simply by uploading new ones from the theme settings
form. The logo should be a .png with a transparent background to display properly over the
coloured header background, and the favicon must be a .ico file – there are various webpages
which can make these for you – run a Google search.
145
Appendix Two
How a theme is structured
The theme itself is a folder inside /sites/all/themes. The ‘core’ themes are in /themes inside the
root folder, but just as with contributed modules, contributed themes should go in the sites
folder, so that you all the non core files are in one place for when you come to upgrade.
The theme folder must contain a .info file – which tells Drupal about the theme. It also contains
a screenshot.png file, which provides a visual preview of the theme in the ‘Appearance’ page.
The logo.png and favicon.ico files for the theme are also here (but can be overridden in the
theme settings). An .info file would be enough – the Drupal system contains templates for all
the html on the page, and css to style various elements. The rest of the files in the theme folder
are responsible for overriding the Drupal defaults.
css and images
css files must be listed in the .info file, and are then called as the last css files that Drupal loads
(which means that they will override the defaults). Any images that the css files use for
backgrounds should also be included in the theme folder.
templates
Drupal builds pages from various template files (there are many – but the basic ones are the
html.tpl.php file, which is filled with the page.tpl.php file, which is filled with content that is
based on the node.tpl.php template, and blocks which are based on the block.tpl.php template.
All these can be overridden, or you can just use css to style the defaults. By having a
page.tpl.php file in our template we ensure that drupal uses this, rather than the default file
(which lives in /modules/system/page.tpl.php).
template.php
The template.php file contains custom code, which can override default Drupal theme functions.
In the church website theme, this file overrides the way in which the author and date credits for
a post are presented and the way in which the titles of taxonomy term pages are written.
Other files
Customised versions of the ckeditor styles and configuration files can be kept in the theme, as
can javascript files which you want to run on every page in your site (these need to be listed in the
.info file).
146
Theme
Page Template
The page.tpl.php file is responsible for most of the things that appear between the <body> tags
of the completed html page. It is pure html, mixed with content that is provided to the page
template as variables, and which is either directly printed by php code, or printed using drupal’s
‘render’ function. As long as you make sure that all the required elements are printed, you may
structure the html however you like.
Styling (css files and images)
The style.css file contains all the css that the theme uses, and the images that it uses as
backgrounds are in an ‘images’ folder. Using Firefox’s firebug plugin, or the ‘Inspect Element’
functions of other browsers you can see what css rules are currently in play for any item on the
page, and preview changes in situ. The appearance of the website can be entirely altered simply
by applying changes to the this css file.
Custom Code (template.php)
Templates are provided variables to display. These variables are provided by the various
modules on the site, and finally run through preprocess and process functions. The ‘preprocess’
and ‘process’ functions in template.php are fed the array of variables ($variables) by reference
(by adding an ampersand before the array name: &$variables) so are able to make any changes
to the variables array without having to explicitly return the whole array at the end of the
function. Any variable mentioned in the page or node templates could in principle be altered by
the two functions in our theme’s template.php file.
Building new themes requires much more information than is available in this appendix, but
reasonably straightforward tweaks to the existing content should not prove difficult. For more
information - a book on theming, or a trawl of the drupal.org website would be helpful (see
appendix 5).
147
A3 – Hosting
You are responsible for maintaining your web hosting account. You need to pay regularly for
the web space you use, and also pay for the domain name that you use. Keep all the account
details and log in names and passwords safe and accessible. The details you need are all on a
separate piece of paper to this manual for security, and because you can change them, which
would render a static piece of information misleading.
Hosting and Domain Name Hosting
You need two things – physical space on a webserver and a name that will point to it. Many
web hosts bundle these two things together, but it is not necessary to do so.
I like to keep the domain name with one company and point it to space somewhere else. This
makes changing hosts easy – you just set the website up elsewhere and change the
‘nameservers’ to point to that new host.
I currently favour lcn.com for purchasing and renewing domains. Make sure that they have
current card details and email accounts, so that you can be informed and billed for the domain
name renewal.
Hosting demands for Drupal are quite tough – apart from the fact that you need a reasonably
current version of PHP (the language that Drupal is coded in) and MySQL (the most common
database type that Drupal is able to use), you also need very generous memory allowances and a
fair amount of hard disk space for all those images and audio files that you are going to upload.
You can find some details at drupal.org/requirements. I would add that the 32MB minimum
PHP memory_limit for Drupal 7 is nowhere near adequate, you must be able to set the PHP
memory limit to at least the 64MB that the article recommends. From time to time Drupal
wants a lot of memory (not often) and I’d happily set the memory limit to 192MB (where I’ve
never had any problems).
My host of choice (at the time of writing – always worth shopping around) is tsohost.co.uk. The
standard package allows you a reasonable amount of webspace; to override the php options (to
set the memory limit high); and to run ‘cron jobs’ – and is reasonably priced at £35 a year. You
must make sure that you have a current email registered with your tsohost account, and that
they have your card details to bill you regularly for your webspace. Account log in is at the top
right of their home page.
149
Appendix Three
cPanel
You can access the settings for your hosting in the ‘cPanel’. Once a website is registered with
the cPanel, you can reach it at {website-name}/cpanel. You need log in credentials.
From the cPanel, you can set up emails (see chapter 15) and email forwards, but also control all
the other aspects of your hosting – domains, databases etc…
Cron Jobs
One of the things that you can set up is commands that the host will run periodically on your
behalf – these are ‘Cron Jobs’ – accessed from the ‘Advanced’ panel at the bottom of the cPanel
page.
Drupal has a ‘cron’ system of it’s own – that will run when anyone logs into the website, and it
has not been run for a specified period of time, but it is better to set up one that will call
Drupal’s cron.php file at regular intervals regardless of whether anyone is visiting the site. This
takes care of publishing articles to schedules, as well as various tidying up routines that the
Drupal system runs.
Instructions about setting cron up can be found at drupal.org/node/23714.
Subdomains
You can set up as many subdomains as you like. These are in the form
{subdomainname}.{websiteaddress} – i.e. www.demo.standrewsmarkstey.org.uk. It makes sense to
use subdomains to create trial websites, or spaces to create tests for backups etc…
The subdomains can be set up in the cPanel under ‘domains’ by choosing ‘Subdomains’.
Addon Domains
As well as subdomains you can also ‘addon’ more domains (the standard tsohost package allows
you a total of 4 domains). These can be controlled from ‘Addon Domains’ in the cPanel. The
other feature of domains worth mentioning is ‘Redirects’ – this allows you to own separate
domains (say .org and .org.uk) and have one simply point to the other.
FTP
You can view the files on your webspace from the ‘File Manager’ within the ‘Files’ section of
the cPanel. You can upload and download files to your webspace from this page, but it’s much
easier to set up an FTP client (FTP = ‘file transfer protocol’). A good free ftp client is the
150
Hosting
FireFTP plug in for Mozilla’s Firefox browser. It’s worth installing Firefox as a browser in any
case (it’s very standards compliant and Drupal works very nicely with it).
You can set up FTP accounts in the cPanel under files at ‘FTP Accounts’. The configuration
details are available next to each account (like for emails). You can set up ftp accounts to only
have access to directories under a certain home directory. (So, you might give someone access to the
webspace for an addon domain without letting them have access to the main website space.)
151
A4 – A clean installation
Why install a clean website?
You will hopefully never have to install the church website as a clean installation, but if the
worst happened and tsohost exploded, you might just have to set up a clean website and then
restore the backups that you have carefully kept to it.
More likely, you will want to install clean versions of the website in order to test backups that
you have already created, or to test new modules or just to play on a trial version of the website.
If you want one of these clean websites, try setting up a subdomain, and installing it there.
How?
To set up a clean website:
1. Set up a subdomain to use within your existing hosting.
2. Install Drupal – either follow the instructions on the Drupal website, or run ‘Fantastico’ – a
one click installer that will give an immediate copy of Drupal set up and ready to go – you
can find it at the bottom of the cPanel.
3. Install all the modules mentioned in the modules appendix. Either go through the list, or if
you want to do this a few times, download all the modules locally, and ftp the lot to
sites/all/modules.
4. Install the required libraries by copying the required folders to sites/all/libraries.
5. Install and enable the theme. You should keep a copy, but you can find it at:
churchwebsite.org.uk. You can do this from the ‘Appearance’ link in the admin bar.
6. Install the churchwebsite feature from churchwebsite.org.uk. You install this just like an
ordinary module, and it uses the Features module to set up a pile of default settings and
views for the website. Enable the feature on the main modules page.
153
A5 – Drupal Resources
There are countless Drupal resources, so these are just a few recommendations for ones that I
have found helpful. These are where you should look if you want to take your Drupal
knowledge beyond the scope of this user manual – say to start developing Drupal features or
websites for yourself.
Online Resources
Your best friend for help with Drupal is the internet. If you Google any problem, you are quite
likely to find the answer there. There are also a number of websites that provide great Drupal
help and instructions. From a vast list, easily the two most helpful websites are (in this order):
drupal.org
Everything that you want to know about Drupal is described on drupal.org. Somewhere. It can
be hard to find your way to the piece of information you want, but a good starting place is
drupal.org/documentation.
The other place to look is at the individual module project pages – they often have links to
documentation or tutorials.
If you’re going to be developing themes or trying to find out which functions and variable you
need to override, then you should install the devel module from drupal.org/project/devel.
Drupal functions are documented at api.drupal.org, and module apis at drupalcontrib.org.
mustardseedmedia.com
Bob at MustardSeedMedia is dedicated to providing decent and affordable Drupal websites for
churches and ministries. If you needed paid support or development for the church website, this
would be my first stop.
He has also provided a whole raft of video podcasts covering a wide range of topics. He is
immensely skilled at communicating a topic simply and effectively.
155
Appendix Five
Books
If you want to develop a drupal website, then having a good book to talk you through the basic
steps involved is essential. If you want to be able to develop websites in Drupal (rather than just
to tweak the one you have) you will need to understand the various technologies that Drupal is
built on top of. These recommendations are for a small web development library, with Drupal
as the final goal.
HTML5 & CSS: Visual Quickstart Guide
Elizabeth Castro and Bruce Hyslop; Peachpit Press, 2011
The code that is sent to the web browser is called ‘HTML’ (hypertext markup language) and it
is styled with ‘CSS’ (cascading style sheets). These are both very easy to understand (although
css can be hard to get to work consistently across the various browsers). Visual Quickstart guides are
easy to understand, have pictures and are the format that this manual is modelled on. You
cannot do anything unless you have some understanding of what you are trying to send to the
browser. If you already know your way around html and css a bit don’t bother with this book. If
you don’t, then this is a great introduction.
CSS Pocket Reference
Eric Mayer; O’Reilly Media, 2011
If you’re going to work on css, this is an invaluable pocket guide; it’s a handy reference to css
properties and the values they take. There are many other good css guides which you might
also like to look at, but this one will be the one that sits on your desk when you’re actually
working on stylesheets.
PHP and MySQL Web Development for Dummies
Janet Valade, Tricia Ballad, Bill Ballad; John Wiley & Sons, 2008
It’s seriously questionable whether PHP and MySQL can really be ‘for Dummies’, but this is
the cheapest introduction available on Amazon.com. I haven’t read it, though. (I can personally
recommend the Wrox and Apress programming guides, but they’re expensive and I don’t recommend the
Visual Quickstart guide.) The ‘For Dummies’ book is cheap and well reviewed and I’m sure will
provide the basic knowledge required to start working in Drupal.
PHP is the language Drupal is written in, and if you want to change things at a template.php
level or in writing your own modules, you should have a basic grasp of PHP. The online
resources at php.net are an excellent reference for all the available php functions.
Pro Drupal 7 Development 3rd Edition
Todd Tomlinson and John K. VanDyk; Apress, 2010
156
Drupal Resources
This is the book for developing in Drupal. It’s well written and clear to understand. It relates to
the development of, not the use of Drupal and will rely on a fair understanding of html and
PHP. It doesn’t cover contributed modules – and is not a ‘how to guide’ for setting up a Drupal
site. It is a concise and effective guide that will allow you to develop whatever application you
like within Drupal as a framework.
There are other Drupal guides; many by Packt publishing. They are all helpful. There are none
of these that I’ve come across that are unmissable.
Learning jQuery third edition
Jonathan Chaffer and Karl Swedberg; PACKT publishing, 2011
Drupal ships with jQuery, which is a reliably cross-browser javascript library. jQuery in Drupal
is responsible for draggable content, visual effects – like sliding some hidden content down, and
AJAX tricks - like the ‘autocomplete’ taxonomy field. If you want to create modules that take
advantage of this library, then this book is a good guide to what jQuery can do.
157
A6 – Images for the Web
Your website needs images, and you need to provide them. While you can just upload a photo
straight from your digital camera, it’s worth developing a little skill in processing your images
before you use them.
Image size and compression settings
An image straight from a digital camera might be several megabytes. To serve an image from
the web, you want that image to be may be 40 kilobytes (or a 25 th of a MB). When you edit your
images from your digital camera there are two things that will radically reduce the size of the
image – one is the size of the image and the other the compression settings.
Image Size
Drupal will resize your image to a maximum setting when you upload it, but you don’t usually
want large images on your web pages. The main content column is only 620 pixels wide – so
make that a maximum for your images. The media module will take care of resizing that to a
smaller 220pixels on the maximum dimension if you use the preview setting, or 100 pixels for
the thumbnail setting. What if you want 340 pixels? Or 420? The way to get these sizes is to
set this size in your image editor, upload it like that and use the ‘original image’ size when you
insert it.
What about resizing in the text editor? You can of course insert a 620 pixel wide image and
then resize it down with the text editor. The problem is that the visitor’s web browser will still
download the large 620px wide image – it will just resize it to display it. This means a file size
several times larger than is needed and slow page loading times.
Work out what size you need your images to be and resize them to that before you upload
them.
Compression
When you save your image in your editor (usually as a jpeg for photos) you will have access to
a compression setting. The more compressed the file, the more ‘compression artifacts’ will be
visible. But it is worth experimenting to see how much compression you can get way with using
before the image looks bad. It’s a trade between perfect image quality and fast loading pages for
the visitor.
159
Appendix Six
Image Editors
You could do with a good image editor. The ‘GIMP’ is a free image editor that is powerful but
not necessarily so easy to use. Adobe’s ‘Photoshop Elements’ is a leader in the field; they also
have a free online editor at photoshop.com under ‘Online Tools’. Corel’s ‘Paintshop’ program is
excellent and sometimes an older version is available for free on magazine covers. For Mac,
iPhoto does a good basic job with photos. If you want a proper editing program, Pixelmator
does a good job.
At least get GIMP, if you don’t already have an image editor.
Using Layers
Once you have your image editor, learn to use layers. If you are creating images with several
elements (like some text laid over the top of a photo) you want to be able to keep these separate
elements separate. This will be very useful if you are creating images for the rotating banner on
the front page.
Using layers, the text you put on top of the base image will not be stuck there forever. As long
as it is in a layer you can move it, change it or remove it without affecting what it underneath.
Layers also mean that you can apply effects over the top of an image without altering the
original image underneath.
Good Sources of Images
Your digital camera might provide every image that you need, but there are lots of images on
the web that you can use. Be aware of copyright issues, but there are lots of images which are
copyright free, and can readily spice up that event description etc…
Some places to look:
Google Images
There are plenty of images on Google. Be aware of the copyright issues.
Flickr
Flickr has lots of images that are copyright free. In the ‘Advanced Search’ option you can ask to
only be shown images that are licensed under ‘Creative Commons’ – this will mean that the
right to reuse them has been explicitly granted. It also tend to filter better Flickr images,
because only more serious photographers bother to set this – Jo Blog’s holiday snaps will not
appear. There are different versions of the Creative Commons license – so check in the sidebar
next to the image what exactly you are allowed to do with the image you’re looking at.
160
Images for the Web
sxc.hu
sxc.hu is a free stock photography site. It will constantly try to direct you to ‘Premium results’
which you need to pay for, but within the free images is plenty of good and usable stuff.
161
A7 – Audio for the Web
Like images, you also need to take care of the file size of audio that you record. You must
upload audio in the mp3 format, and you must get the file size under 10MB to be able to upload
it.
Audio file size
Audio file size is determined first of all by how many samples per second are recorded at how
many bits per sample, and how many channels are used. The cd standard is 44100 samples at
16bits per sample in two channels (stereo).
CDs files have huge file sizes, and for distributing on the web, a compressed file format (mp3)
was developed. Like jpegs for photos you can choose how compressed the mp3 should be and
also like jpegs the more compressed you get, the more you suffer a loss of quality. An mp3
setting of 128kbps (kilobits per second) produces good quality stereo music without producing too
large file sizes.
Especially if you are using speech on the web, you should think about getting the audio file size
down before you compress it to mp3. Speech certainly doesn’t need stereo sound – so if it’s been
recorded in stereo lose one of those channels. It also doesn’t need 44.1 kHz – 11kHz will sound
just fine, and you will have just removed ¾ of all the samples and hence reduced the file size to a
¼ of what you started with.
Audacity
Audacity is a free and very capable audio recorder and editor. You can download it from
audacity.sourceforge.net. The latest stable version is currently 1.2.6 and this is what you should
use.
Audacity is easy to use, but there are good help files available at the audacity.sourceforge.net
website.
If you want to get audio into your computer, you will profit from a reasonable soundcard that
you connect your church mixer to. The built in audio (probably a mic input on a 3.5mm jack) will
do a perfectly fine job to be getting on with.
163
Appendix Seven
Settings for sermon audio
Connecting the church sound system to Audacity and hitting ‘record’ at the right point will
provide a perfectly good recording (you will need to make sure that the level into the computer is not
too high).
Before we export it as an mp3, though, we want to convert it to mono (which will improve the
sound quality when its compressed as an mp3), trim any ‘extra’ bits from the beginning and end of
the recording and run it through some processors to make it seem as clear as possible when the
talk is played through average quality speakers.
Convert the recording to mono
When you record the track you see a graphic representation of it in the Audacity Window. To
the top left of this is an X, followed by the name of the recording and a down arrow. Click the
arrow and a drop down list appears from which you choose the option ‘Split Stereo Track’. The
track divides into two. Delete one (doesn’t matter which) by clicking on the X at the top left.
On the other track click on the arrow and choose ‘Mono’ from the drop down list.
Trim the beginning and end of the recording
Zoom in on the track using the + magnifying glass. You can play it from wherever you click in
the track. Select any portion that you need to discard from the beginning of the track by
clicking and dragging on the track and then pressing delete. Check it sounds right and use the
undo button if not. Repeat for the end of the track. If you pressed record and stop at just the
right point when you recorded the audio, you can skip this step.
Process the Audio to make it seem clearer
Typical computer speakers are really rubbish and tinny and quite low powered. Commercial
pop music has its dynamic range (difference between the loudest and the softest parts) heavily
squashed, so that it all seems quite ‘loud’. We need to do the same thing to our speech recording
to help intelligibility though these poor quality speakers. What we’re effectively doing is
increasing the volume of the quietest parts of the audio that we have recorded. Without this,
the user will have to turn their speakers right up to hear the audio – the loudest bits will seem
painfully loud and they won’t be able to make out the very quietest parts. After this process the
user will be able to listen to the talk at the same kind of level that they listen to pop music (or
even lower) and will be able hear all of the talk clearly.
Normalise
The first step is to get the loudest bits of the recording to a standard level, so that the settings
we use next will make sense. Select all the audio (Ctrl + A) and choose ‘Normalize’ from the
Effect menu. Click OK and the track will be normalised to -3dB.
164
Audio for the Web
Hard Limit
Choose ‘Hard Limiter’ from the Effect menu. Type ‘-7’ into the first box (‘dB limit’) and leave
the others. Click OK and the loudest peaks of the sermon will be trimmed back just a little. (The
loudest peaks should now be at -7dB rather than -3dB.)
Compress
Choose ‘Compressor’ from the Effect menu. Drop the threshold to -15bB, increase the ratio to
4:1 and reduce the attack time to its minimum (0.1 sec). Leave ‘Normalise to 0 dB’ checked.
Click OK and the remaining 8dB of loudest peaks in the audio will be squashed fairly hard (but
more kindly and ‘musically’ than the hard limiter would have done). Once this has been done,
the whole track is ‘normalised’ to 0dB which will mean that the perceived volume from
someone’s speakers will be comparable to the rest of the stuff they listen to. The net effect of
the whole of this process will have been to have reduced the difference between the louder and
quieter parts of our audio.
Export to mp3
We now have a perfectly processed sound file, but we need the file size reduced (a lot) before
using it on the web. We’re going to export it to mp3, but first of all we’re going to click on the
‘Project Rate’ in the bottom left corner and set it to 11025Hz. This reduces the sample rate, but
for speech will not significantly affect the perceived quality. We have now reduced the file size
by half of a normal stereo recording by converting it to a single mono track and taken the
sample rate to a quarter of CD sample rate without affecting our audio quality – giving us a
near cd quality track at an 1/8 of the file size even before we compress it as an mp3. The audio
editor is set to encode mp3 at 16bits (its lowest quality setting – you could check under: edit –
preferences – file format tag) but will produce audio that seems quite close to ‘cd quality’ through
the end user’s computer or mp3 player. Click on the file menu and choose ‘Export as mp3’. Save
it with a sensible file name (ie ‘20090816AM’), in a sensible folder (i.e. ‘mp3 files from Audacity’
inside the ‘My Music’ folder). Once you have pressed ‘Save’ you are prompted for the ID3 tags
(these will appear as text in someone’s mp3 player). ‘Title’ should be the talk title, ‘Artist’ the
speaker and ‘Album’ whatever makes sense.
165
A8 – Writing for the Web
Writing for the web is like writing for anything else – you should be efficient with you words,
clear and think about what you are trying to communicate. It’s also a little different – web
visitors tend to scan text rather than sit and read in a leisurely fashion and don’t wish to read
very long texts online.
Page length
Think very carefully about your page length. You should aim to communicate everything
important quickly – and preferably without the visitor having to scroll down to get to the
information they require. By all means then expand on the original paragraph or two, but try
and keep the whole article as concise as possible. You can always link to further information or
resources from the page.
If you’re writing more than a couple of paragraphs, do also include appropriate images as you
go along.
Writing Style
Communicate fast. Write like a paper – say everything in the first paragraph; expand it in the
next three paragraphs, and if you need to expand further in the paragraphs that follow. Cut out
any extraneous words and if you have included any adjectives try removing them and seeing if
the writing isn’t crisper without.
167
A9 – Feeding Facebook
Where visitors to your website have to come and visit to be able to see the content that you are
providing (so you should direct people to it), Facebook pushes information to where people are
(at least where Facebook users are). If people ‘like’ the church facebook page, every post on the
church facebook will appear in their newsstream. It makes sense, then, that every time you add
an article to the church website, you also post it to Facebook.
Drupal has a number of RSS (Really Simple Syndication) feeds set up – and one of these is a feed
from the Article ‘view’ – it’s a special type of views display available at the path ‘/blog/feed’. By
subscribing ‘TwitterFeed’ to this feed on your website, you can have every article automatically
posted to Facebook (and Twitter if you want it) without having to remember to post in both
places.
Setting up TwitterFeed
Twitter feed is a free service at twitterfeed.com.
You simply sign up, give it the feed address at /blog/feed and your Facebook credentials and it
will work away in the background feeding articles to Facebook forever.
169
A10 – Training Users
When you have new people who are going to be editors on the website, you must train them.
Give them a copy of this manual as a reference by all means, but it will also help if you sit with
them and talk them through the basic functions of the website.
In order to absorb and ‘get’ the processes of producing and looking after content, people need to
do as well as be shown. Make sure that there is a ‘demo’ version of the website that can be
messed around with by your trainee editors before they are let loose on the actual site.
Exercise Sheets
There are copies of training exercise sheets available at revrichardmorgan.org. You should copy
these and keep copies of them somewhere. They will be helpful in setting tasks that cover the
range of common activities that people need to achieve on the site.
171