BUILDING A SIMPLE DRUPAL WEBSITE

Total Pages: 10

Revision 1: <date>

Revision 2: 16 May 2012

1. Why did we use drupal?

To answer this let me first start by saying that you shouldn’t use Drupal if you aren’t willing to put in some

time to learn it. Once you know how it works, you’ll understand why I regard Drupal as the better CMS for

creating websites.

All CMS systems, like Wordpress or Joomla, have their pros and cons, but here is why I decided to use Drupal

and regard it the better CMS:

Over the past year and a half, I have implemented 4 different systems, namely Wordpress, Joomla, Sharepoint

and finally Drupal.

1. The first 3 systems were very easy to configure and use, while the Drupal took quite some time to get

around and figure out. However, once I figured it out there was no way that I was going back to the

first 3 systems.

2. Drupal was the only system that allowed me the features I wanted for our municipality and I will

discuss this in the next section.

3. I found Drupal to be the more robust, yet flexible.

4. Being a novice Php/MySql programmer, I found a Drupal had a very clean core code.

5. Great site building tools.

6. Advanced Administration.

7. You can organize content easily and sensibly. It uses visible blocks.

8. There are some very good developers in the community forums and in general.

9. Fewer clowns (you can either code Drupal or you can’t, it’s harder to fake it), so if you find a feature or

module for Drupal, chance are it is working without issues.

10. Can be made very server efficient in the right hands (scalability).

11. Drupal can be set up to be almost “ANYTHING”-in-one. You can have a helpdesk, document

management system, blog, forum, etc. all in one system, yet operated separately.

Everything with Drupal is not all ‘sunshine and roses’. Some of the things I found that I regard as a

disadvantage:

1. You’re going to have put in a lot of time to learn the system. No coding necessary, but a lot of reading

websites, blogs, forums, etc.

2. The interface if more commanding if you are a first time user or web designer.

3. Fewer developers and if you want to outsource, developers are more expensive, but on the flipside,

we are using open-source for the reason to not outsource ☺

4. Compared to a CMS like Wordpress, Drupal is slower, but as in point 10 above, I was able to address

that with some tweaks.

This is just my rendition of why Drupal is better for building municipal website, however you need to do your

homework and put in the time. A lot of questions must be asked.

2. What were the main features I required for our website?

1. Our website is kept up to date by various “Editors”. So we have one person responsible for updating

tenders, another for vacancies, and another for news, etc. I had to find a way for these Editors to

update the website pages, but before it went public, we had to moderate it. Now with most of the

other CMS systems, moderation was limited to posting comments, like in a blogging fashion. I needed

an Editor to change an entire page on our website and his/her changes are then mailed to a

Webmaster for moderation by the click of a button.

2. In terms of the aforementioned, an Editor only needs access to the specific page/s and be completely

blocked for editing any other pages.

This was obviously the most important requirement and the only CMS I found to give me the feature

EXACTLY how I wanted it, was Drupal. The other CMS systems had similar features, but not exactly as per

my requirement.

3. Let’s dig in and try it.

The first mistake I made was to not keep track of what I did, so I will try my best to retrace my steps.

** I also assume that you are an IT professional and know certain things basic things **

We are going to do a test website, so don’t install this to a server. It’s light enough to use on a normal PC

or laptop, or even a virtual pc.

1. Download and setup the latest XAMPP server from http://www.apachefriends.org/en/xampp.html

I use the Windows version. Please use there instructions to configure the webserver/apache and the

MySQL. If you do this correct, you should be able to type http://localhost in your browser and get the

XAMPP configuration page. On the left of the page click Security and set your usernames and

passwords.

The XAMMP page looks like this:

2. Login to MySQL via the XAMPP Control Panel. This is normally sitting in your system tray. If you did the

setup correct, you can also log in via http://localhost/phpmyadmin.

You can also log in to MySQL by clicking the ADMIN button!

3. Create a database. It is advisable to pick a sensible name, especially if you are going to transfer the site

to a live environment like a domain later on. Any database name should work, like

COMPANY_DRUPAL, were ‘company’ is the name of your municipality. You don’t have to add the

_DRUPAL.

4. Download the latest RECOMMENDED version of Drupal from http://drupal.org/project/drupal. I

suggest and base this document on Drupal 7, as the latest version 8 has not fully been adapted in

terms of modules. So you might require modules, but they have not been developed or adapted to

work with version 8 yet.

5. Locate your XAMPP installation. I normally install XAMPP directly on the root drive, example

C:\XAMPP. In this folder, find the HTDOCS folder and inside create a folder called backup. Copy the

rest/loose files in HTDOCS to the backup folder you created. So you should be left with only the

BACKUP folder in your HTDOCS folder.

6. Extract the Drupal zip file and copy all the files to the HTDOCS folder. Don’t create a folder. Put the

DRUPAL files directly in HTDOCS It should look similar to

7. Once this is done, open your favourite web-browser (I prefer FireFox). Now if you did everything right

with the XAMPP setup/configure, you can browse to http://localhost and the DRUPAL setup will begin.

Go through the steps, and remember the database you created as well as username and password.

If you run into issues at this stage it will 90% of the time be related to your webserver

installation/configuration and not the Drupal setup Why? ‘Cause you haven’t setup Drupal yet ☺.

XAMPP WEBSERVER HELP: http://www.apachefriends.org/f/viewforum.php?f=34

8. If the setup of Drupal is complete you will get a message to go to your frontpage/website, as well as

you Administration page. Go have a look around to get acquainted with the system.

In my following post, we will look at the various Drupal functions from an administration perspective!

4. LET’S LOOK BRIEFLY AT DRUPAL

This is where you are going to have to put in some time. For starters, there is no way that I am going to repeat

documents that have already been written. So before you even start playing around with Drupal, begin by

reading the following:

Understanding Drupal: Learn about Drupal concepts, technology stack, terminology, and resources.

http://drupal.org/documentation/understand

Installation Guide: The initial install was previously covered, but here is more detail, especially if you ran into

trouble and also here is more info about modules and themes.

http://drupal.org/documentation/install

Administration Guide: Manage users and content, perform backups and upgrades, secure your site, tweak

performance, etc. Audience: System and site administrators

http://drupal.org/documentation/administer

Structure Guide: Work with content types, blocks, menus, views, panels, taxonomy, user profiles, and

navigation. Audience: information architects

http://drupal.org/documentation/structure

Site Building Guide: Add functionality and features such as e-commerce, forums, media, search, geographic

data, dates, workflow, messaging, forms, social networking, etc. Audience: site builders, developers and

business architects

http://drupal.org/documentation/build

Please note throughout this entire process I configure Drupal in the same way I have set it up in our

environment and giving the requirements of our municipality. This might be different for your municipality.

After you have read and studied the documents… Wait, let me repeat…After you have read and studied the

documents and links I previously mentioned, continue to the next chapter.

One last thing…. Read and study the documents and links!

So, you have read and studied the documents and links and Drupal have been successfully installed, preferably

on your test system/local machine. Let look at the Drupal Administration side, because this is where

everything will be happening.

If all is installed correctly, you should be able to login to the admin side via http://localhost/?q=user

Two things to note:

1. As you can see I use Mozilla FireFox, just because I regard it as a better web browser if compared to

Internet Explorer.

2. You’ll see the address shows “MyBB”. This only means I installed DRUPAL in a folder in the HTDOCS

directory of my XAMPP installation, ex. C:\XAMPP\HTDOCS\MYBB.

If you have the correct Admin address, a page similar to the following should appear:

Login with the username and password you specified when you did the Drupal setup. Later we will show you

how to add CAPTCHA security to the login page to avoid spammers.

Once logged in, the following ADMINISTRATION PAGE should be displayed…

The menu at the TOP will be the main focus for the Administrator and will be hidden from the users. In our

environment, we have created a group, called EDITORS, because the IT division is not responsible for updating

the website. As an example, we have a user in the finance department who is responsible for updating tenders

and have given the user EDITING permission to ONLY that section. We’ll cover this later on.

So, you have read and studied the documents and links, REMEMBER!, so I am not going to go through each

menu. I will demonstrate the usage of the menus through implementation of various things. This will give you

an idea of how things work in DRUPAL.

Let’s start with the FUN stuff!!

If you are like me, your heart will be aching by now to load your website interface – the look and feel of your

site. This is also referred to as the website ‘theme’. For me to go into the CUSTOM design of a website theme,

will entail writing a book and publishing it. Drupal is built on PHP/MySQL and to design customized website

themes, you need knowledge of PHP programming. For the purpose of having fun, play around with THEME

TEMPLATES that is freely downloadable. When using templates, you can normally change most of the

template to suit your liking, things like colours, pictures, fonts, where things are located on the site, etc...

Visit http://drupal.org/project/themes and download a few themes that you like or think you can alter to work

as your website. Let me give an example:

I’m using the Marinelli theme to build a website for our municipality, but have slightly changed a few things.

Visit our test site at http://41.78.7.26 to see some of the changes I made and compare it to the screenshot

below:

Some changes you’ll notice:

• The Drupal logo was changed to our marketing logo – the bird

• The banner pictures were changed and the picture information removed, thus only the pictures

display

• The search button was moved towards the right-hand side

• The menu below the picture/banner was removed

• The login section was removed, because we only allow certain people to log in and edit the site

• Then a change that might not be so noticeable is the “body section” was changed to a three column

layout.

All of the above changes were made without any need for programming. It is all done via the

ADMINISTRATION PAGE of Drupal.

If I wanted to change things like the colour from blue to , this can be easily done by editing a CSS file in green

the theme, while some themes allow editing of the colour from the Administration Page. Some themes even

allow the viewers of the website to choose the own colours.

So the main thing when deciding on a theme is to keep an open mind and focus on the structure or layout that

you like. Most other things can be changed very easily.

So you have downloaded the theme that tickles your fancy. Now what?

First unzip the file. This will normally create a folder and within that folder will be another folder, which is the

theme. This depends on how you unzip/extract the files. It might look something like:

C:\Downloads\themeXYZ-7.x-2.5\themeXYZ

In this example the last folder “themeXYZ” is what you need to copy. There are two places to copy your

themes to. The first place is in the root of your drupal installation, there is a folder called THEMES. You can

copy your new themes folder here, BUT if you upgrade in the future, you might lose your theme. I still regard

this as the best place to copy your theme, seeming that you will always make a backup before you upgrade ☺

The second place is normally located at C:\my_drive\xampp\htdocs\drupal\sites\all\themes.

On a default/new Drupal installation, the aforementioned folder will only contain a README.TXT file. You can

copy your new theme folder to this location.

Once you have copied the theme folder, log back into your administration page and click on the APPEARANCE

link at the top. On the page you will see a screenshot of your theme, normally to the bottom under the

DISABLED THEMES section. Now click on the ENABLE AND SET DEFAULT link below your theme.

That’s it… your theme is loaded! Test it by logging out of the Administration Page.

Now log back in to Administration and click the APPEARANCE link again….

Your theme should now be at the top and there should be a “SETTINGS” link next to the screenshot. Click the

settings link. Now this section will change from theme to theme, but it will contain all the settings you can

change for your theme.

Play around a little and don’t worry you can’t break it. If something goes wrong, just delete the theme folder

and reload it. Voila!!