Building a Website with Drupal 6 – Part 5: Playing with Modules

Welcome to part 5 of our tutorial on building a website with Drupal 6.  Previously we covered:

Part 1: Introduction
Part 2: Installing Drupal 6
Part 3: Configuring your Site
Part 4: Playing with Blocks

As we go through this tutorials I am building a Drupal resource site called Learn Drupal.  In the last tutorial we played with blocks and planned and started implementing the layout of our website.  So our website so far looks like this:

(You can click on the images for larger views)

In this post we are going to continue working on our site, building it and adding functionality to it. We know what we want our site to look like, and now we want to decide what functionality we want to have, and how to achieve our goals with modules.

Let me digress for a moment:  You may be wondering when we’re going to get rid of that annoying text on our front page.  Well, we’re going to do that right now.  I will talk more about content and content types in the next post, but let’s change the text and start making our site our own before we continue.

On the left sidebar, click on “Create Content”.  You should see this screen:

Drupal comes by default with two content types, pages and stories.  Pages are good for static content, stuff that doesn’t change.  Examples include an “About Us” page, or a “Disclaimer” page, or even a “Contact Information” page.  A story, on the other hand, is ideal for information that informs, and that encourages interaction, such as recent news, latest updates, etc.  By default, Drupal sets the Story type to have comments and to automatically appear on the front page as soon as it’s published, and for the page type to not have comments and to not be published to the front page.  These are settings that you can change.  You can change them as you go, or you can set them so that each content type always behaves the same way each time.

What’s really cool is that Drupal allows you to create your own content types!! But let’s keep it simple for now, we’ll delve more into content types as we go.

For now, let’s change that darned front page shall we?

Let’s create a story to appear on our front page. Click on Story:

I’ve added some basic text that will be my first content on my site.  You can see that there are other things to fiddle with such as Menu Settings, Input Format, Revision Information, etc. I won’t worry about all these for now. I don’t want this story to appear in the menu for now, so I’m going to leave the Menu link title blank.

We will explore all the options when we go into creating content and menus, so bear with me for now.  I’m not going to change any of the other options so don’t worry about them for now, just go ahead and click Save.  Remember I said that by default Drupal always publishes stories to the front page? Well, if you now navigate to your front page, you should see not the default drupal page but our new story, or part of it anyway…

Drupal truncated the story and added a “Read More” link at the bottom.  If you click on that you’ll see the whole story.  If you were to add a second story, it would appear on top of the current one and the current one would be pushed to second place, and so on and so forth.

Are you getting the general idea now? Like I said, we will talk more about content, and how to change what appears on your front page and affect the behavior of your content and content types.  But for now let’s leave the content part of it and go back to functionality.

Back on track now…

Functionality

In talking about functionality, what we’re basically asking ourselves is what do we want users to our website to be able to find and do? What’s the purpose of our website?

Well, we’re building a Drupal resource site.  Therefore, at the very minimum, we want our users to find content that’s relevant to Drupal, perhaps tutorials, articles, Drupal news, etc. This is inherently the purpose of a content management system, and we will accomplish this by adding content to our site.

What else? Well, we want our users to know what’s going on in the world of Drupal, we want them to be able to discuss and share information, ask questions and have a place to exchange ideas.  One way to accomplish this is by using a forum.

We also want our users to be able to contribute knowledge in the form of tutorials and articles, perhaps by having a blog on our website. It would be awesome for users to each have a blog to talk about their Drupal project and get feedback from the community.  OK, so we want blogs for our users.

We also want visitors to our site to be able to contact us and tell us what they think of our website and ask us any questions, or tell us how much we rock.  So we need a contact form.

hmmm… okay, we could go on and on, and I’m sure we will, but before we get ahead of ourselves, we need to ask, do we make these things happen in Drupal? How do we add functionality to Drupal? We do this by adding and enabling Modules.

Modules:

A module is software (code) that extends Drupal features and/or functionality. Core modules are those included with the main download of Drupal. Contributed (or “contrib”) modules are available for separate download from the modules section of downloads. Note: Be sure that the version of the contributed module you wish to use matches your version of Drupal releases section lists modules by Drupal version (http://drupal.org/getting-started/before/terminology#m)

So that’s what a module is… fancy huh?

Well, let’s take a look at this module thing then, shall we?

Go into your site administration area, and under Site Building, you’ll see Modules. Click on that and you get a page that lists all the modules that come as part of the Drupal Core. Some, as you can see, are optional, and the rest are required.  You don’t want to mess with the required modules, because without them you’re Drupal install will be totally messed up, so we’re going to look at the optional ones. (There are many many contributed modules that can add even more functionality to your website, and we will go over some of them as well as how to install and enable them). For now let’s look at the core optional ones.

The checked modules are the ones that come enabled by default.  We’re going to go ahead and enable a few more.  We need the Forum module and the Blog and Blog API modules, so go ahead and enable those.  We also want to enable the Contact module for our contact form.  Hmm.. let’s see, what else?  Well, lookie here, we have something called Poll! That looks like fun, having polls on our website… either created by us or our users?? Yay, let’s enable that one too. And I see two others I like… Statistics and Search… enable those two also.  Gee, we better leave this page before I get carried away!! But don’t worry, we’ll be back to enable more modules later on. For now, these will do.

Scroll to the bottom and click on Save Configuration to save your changes. The first change you notice immediately is that your website now has a search box on the left sidebar right at the top.  Talk about added functionality!

Well, I don’t think I like that search box over there. I prefer to have it on the right sidebar.  This is easy to change by going into the theme configuration, but let’s not get ahead of ourselves, we’ll leave as it is for now.   Now this search form won’t yield much if we use it now for 2 reasons:

1. We don’t have any content to speak of and

2. Our site is not yet indexed

Number 1 will be solved when we start adding content, but what does 2 mean? Well, for the search function to work, the content on your site needs to be indexed, structured and organized in such a way that it’s easy to find.  We will talk about indexing in a future post, but I wanted to mention it now so that you don’t wonder why your search box yields zilch!

OK, so let’s look at the other modules we added.  We added blog, poll and forum. If you now click on Create Content in your navigation, you will see some additional stuff. Remember originally we had Page and Story as our only content types? Well, we have three new content types now!

We can now create a blog entry, a poll, or a forum topic.  Looking good!!

We also enabled the Statistics module. What this does is allow us to get an idea of who is accessing our site, what pages are getting the most hits, where our visitors are coming from, and more.  You can read more about the statistics module on the Drupal page for the module (http://drupal.org/node/297).

Let’s configure our Statistics module so we can keep an eye on our site and see what’s crackin’!  Before the Statistics module can start collecting information you actually have to tell it to do so.  Makes you feel like the boss huh? 🙂

So go into Administer->Reports-> Access Log Settings

Select to Enable Access Log.  I’ve increased my log storage time to 8 weeks because that’s my preference. Gives me more time to look at and analyse my logs.  I’ve also enabled counting of content views so I know which content is most viewed.  Save Configuration. Our statistics module is now ready to gather data. We will check on it at a later date to see what kind of interesting information it collects about our website visitors.

Creating a Contact Form in Drupal 6

We also enabled the Contact module.  Let’s go ahead and use it to create a Contact page so our site visitors can reach us.

Go into Administer -> Site Building -> Contact form

This option was not there last time we looked at the Site Building admin area, but it’s there now because we’ve enabled the Contact module.  Go ahead and open it.

Drupal allows you to create multiple contact forms according to your needs and to customize them.  Before we can create a contact form, we need to create a category that the contact form will belong to.  If you’re building a corporate website for example, you may want each department to have it’s own contact form, and so on.

I will start with just a simple website feedback contact form. So let’s create that. Click on “Add Category as highlighted in the screenshot above. The fields are pretty self explanatory, so go ahead and enter your info.

Save your Contact form and it will now appear on the list.  You can always come back and edit or delete this contact form, and add more as needed.

One more thing we may want to look at is the Settings of our contact form.  Next to the Add Category link that we clicked before is a Settings link. Click on that:

You can change the message that appears at the top of your contact form, like I just did, and you can also control how often a user can submit a form.  This is helpful for controlling spam to some extent, and reducing the load on your server.  I leave the “Enable personal contact form by default” checked.  Save configuration.

Beautiful! Dandy!

But where is the contact form???

I don’t see it!  Well, we have to make it visible. We have to create a link to it somewhere in our site navigation so our site visitors can click it and use it.  To do this, we need to go into Menus.

We will be talking about Menus as we go, and will talk more about them in detail, but for now, go into Administer -> Site Building -> Menus.

By default, Drupal comes with three Menus, Navigation, Primary Links, and Secondary Links.

Navigation is the meny on left hand sidebar that we’ve been using all along.  It’s the main menu and contains personalized links for your users.

Primary Links menu usually appears at the top of the page by default, and is a good place for placing links to the major sections of your site.

Secondary Links menu can be used for many purposes, like the other two, and we’ll explore it more. In general though, it plays a lesser role.

I want to place my contact form link in a relatively prominent easy to find place, because user feedback is important to me, and I like people to be able to reach me, so I’m going to place it in the Primary links menu.

If you click on Primary Links you’ll find that it’s empty, there’s nothing there because we haven’t added anything. It comes empty by default.

Go back to Menus, and click on Navigation.

You can see that some items, including Contact, are disabled.  You want to enable it, and edit it so you can set it to appear where you want it.  Click on the edit link next to Contact.

I’ve changed the Menu Link title to “Talk to Us!” because I want to be different.  You can leave it as is if you want.  If someone hovers over the link wondering what that’s all about, they’ll see a little hint next to their cursor that says “Contact Us” because I’ve added that in the Description box.  Make sure you check the Enabled box, so it appears in the menu, and finally, select the parent item, in other words, where you want the link to appear.  By default, all new menu items go into the Navigation menu, but we already decided we want it in the Primary Links menu. So click on the little arrow and scroll all the way to the very bottom and you’ll see Primary Links. Select that.

The weight option determines where in the order of items our link will appear. Heavier items appear later and lighter items appear first.  We only have one item in the Primary links menu so it really doesn’t matter right now, but as we add more items, it will.

For now we won’t worry about it but we will revisit it later. Let’s leave it as it is.

Save your form and something miraculous will happen, I promise!

Look at the very top right corner of your page and what do you see??? (you can click on the image to enlarge it).

Yes! Our menu item for the contact form. If you click on that link it will take you straight to our contact form our site visitors now send feedback information and any message their heart desires!… hopefully all nice!  Our email address is not exposed to the whole world to see and spam, but our visitors still have a way to get to us.

Any information sent through this form will go to the email address you specified when you created the form.

Awesome!  Feeling excited yet?

Our website is coming along really well. As we leave today, we’ve learned a little bit about content and adding content, and we no longer have that default Drupal message on the front page. We also learned how to add functionality by enabling modules, and we added a contact form to our site.  We also learned a little bit about menus and our Contact form is now accessible to our visitors via the primary links menu.  Navigating to the front page of our website, this is how things are looking!

We’ve made a lot of progress today, and hopefully you’ve learned a lot.

In the next post, we’re going to delve into themes and learn how to make our website look even more unique. We’ll play around with blocks some more, and our website will continue to shape up. So hang tight and stay tuned!

Feedback and comments, either here or at Learn Drupal, are always welcome :), so drop me a line in the comments!

I haven’t forgotten about homework, but it IS the weekend, so take it easy.  But do play around with your site, go over everything we’ve learned so far, and experiment experiment experiment.