This tutorial is another special series written guest author Sean Hodge from aiburn.com and Connection Cube. He is an expert in Drupal, which I am totally not familiar with. He intrigued me when he told me that the majority of the bands on Sony’s record label are powered by Drupal. Drupal is basically an open source CMS, and I was interested in learning more about it. So that’s why he’s writing this tutorial for us. You can learn along with me!

Read the introduction – What’s Drupal and why?
Read Part 1 – Design it Illustrator
Read Part 2 – Slicing it Illustrator
Read Part 3 – XHTML
Read Part 4 – Theming Drupal
Read Part 6 -Wrap Up and Additional Resources

Introduction

In our last tutorial we created our Drupal Theme Files. Now we are going to get familiar with the Administration of Drupal and set up our GoBand website.

Review

For review Lullabot has a good video on Installing Drupal 5. The video has you setup your first user account and change the password. This is really important in Drupal. The first user account is the super administrator. So don’t loose that login as its real important. Also, we should have our theme files installed from our last tutorial. If you need to, then download a copy of the final Goband Theme files. Place them in the sites > all > themes directory in Drupal.

Garland Default

Below is the default Administration screen in Drupal. Notice the warning message in the red box. This is nothing to be alarmed about. Let’s take care of that. Click on the status report link within that box.

We covered this in a previous tutorial, but lets make sure you have the Files folder installed. Make sure your move the files folder we created into the root Drupal install directory.

Once you make a choice for Cron and have your Files folder installed in your root directory you’ll get a good green status report.

Turn on Our Unique GoBand Theme

In the default theme Garland you have a few ways to get around the Administration area. On the left is one option. You’ll also notice the breadcrumbs at the top of the main column. If you go to the administration page you’ll also see that you can view all your administration options by task or module.

Before we turn on our GoBand theme we need to make sure our navigation is set up correctly for the theme. There are no breadcrumbs set up in the GoBand theme and there is only a right sidebar and not a left. So, if we don’t turn set our navigation for the GoBand theme to the right sidebar we’ll be a little lost when we turn the theme on.

Go to Administer > Site Building > Blocks. Click on goband settings. You’ll get a preview of the Administration area of our GoBand Theme. Under the regions column set the Navigation to right sidebar and click Save blocks at the bottom. This makes it so that our theme will have a navigation when we turn it on.

Notice how the right side has the Winged Chick Icons. This is not needed for the administration area. So, lets add the code circled below to our theme. After adding this code to your style.css file your results will look like the sidebar in the image above.

In the navigation, that just got moved to the right, click on Themes. Now as long as you have your theme files for GoBand installed it will be pretty hard to miss the green chicks with wings image, and the bright green GoBand Text. The other themes come with Drupal 5 by default. In the image below we can see that we are still have Garland as our default theme.

Now lets turn on our GoBand theme. Select Enabled and Default radio buttons next to the GoBand Theme. Then at the bottom of the page hit Save configuration. Afterwards, your results should look like the image below.

Let’s change another settings in the Theme before we move on. Click Configure top left below the page title. Uncheck Logo in the Toggle Display column. This is because we don’t have a logo setup. The logo is part of the header image. Then at the bottom of the page hit Save configuration.

Let’s Turn On a Couple of Modules

Go to Administer > Site Building > Modules. Anything set to Enabled already go ahead and leave it that way. Do check Enabled for Path and Search and click Save configuration. We’ll be using both of these modules shortly.

Enable Our Search Form

Go to Administer > Site Building > Themes > Configure. This will configure the global settings for our themes. Check off Search in the Toggle display column and hit Save configuration. That’s it. We already have the search set up in our theme. So, all you had to do was enable the module and then turn it on in the theme.

Create Our Home Page

In our Administration Navigation on the right click Create Content. Then click Page, as that is what we are making. Start out by entering our Title and then place the content of our Body. You’ll recognize the content from our Main content section in our HTML from the third part of this series. I set my Input Format to PHP code as this means none of the HTML will get automatically converted. Though if you like the auto conversion certainly try a different setting.

Next we insert our Menu Title as Home and set our Description. We want this to be a part of our Primary links. It will be the first one so give it to a Weight of 1. Set our URL path settings to home. Under Publishing Options check off Published. Then click Submit. Congrats, you’ve just made your first page in Drupal. Next we want this page to show up on our home page.

Go to Administer > Site Configuration > Site Information. Then set the Default front page to Home. While we are here drop in the HTML for our footer under Footer message and hit Save configuration.

Now check that the home page is correct and that the footer message is showing up. Your Home Page should look like the image below so far.

Now Let’s Create Our Other Pages

Go to Create Content > Page. For the Title use About GoBAND and drop some Lorem Ipsum in for the Body content. For the Menu Settings Title enter About. Give it a Description of About GoBAND. Set the Parent Item to Primary Links. Set the Weight to 2. And the URL path settings to about. Check off Published and hit Submit. Then go ahead and follow a similar process for the Blog, Booking, and Tour Schedule Pages.

Create Some Sample Sidebar Content

Go to Administer > Site Building > Blocks. Then click on Add Block in the top left hand corner of the main content area. Give it a Block description of Sidebar. Then drop in our sidebar content from our HTML file. Select an Input format and hit Save block.

Now we are back in our blocks area. Give the Sidebar a Region of Right Sidebar and a Weight of 1. Give our Navigation a Weight of 9 to push it down. The hit Save block.

Create Links Up Top

Go to Administer > Site Building > Menus. Then click Add menu in top left of the main content area. Give it a title of Top Nav and hit Submit. Under our newly constructed Top Nav menu click Add item. Fill in the Menu item to point to the front page and hit Submit. See image below.

Repeat this process for another sample Link for the Top Nav.

Next we need to go to Administer > Site Building > Blocks. In the Region column set Top nav to top nav and click Save blocks.

Now click on configure for Top nav. For the Block title put <none>. Then click Save blocks. This will get rid of the Top Nav title that we don’t want to show up top.

Set Access Control

Go to Administer > User Management > Access Control. This is an important and useful screen to review. If you were to log out you would notice that Search doesn’t show up. That’s because by default it won’t show up for Anonymous Users. Check off the boxes in the image below and then hit Save permissions. Spend some time reviewing the different options on this page. If you want to create new roles for different users its easy to do that and then set permissions for them here. Though that’s beyond the scope of this tutorial.

After allowing access to the Search we are almost done with this setup. Below is how the site now looks to an Anonymous User to the site.

Setting Up One Columns

Go to Administer > Site Building > Blocks. In the Sidebar row click configure. At the bottom of the page insert the user page instructions into the Pages window as shown below. Then hit Save block. This tells Drupal not to display the sidebar on those pages. So we end up with one column and not two for those pages.

We have already set up the our theme to recognize when there is only one column so it displays correctly automatically, see sample below.

Enable Clean URLs

Enabling Clean URLs will remove some unsightly characters from the URL: “?q=”. Go to Administer > Site Configuration > Clean URLs. First click on Run the clean URL test. If you were successful you’ll see the message below. Then select Enabled and click Save configuration. Now the ugly “?q=” characters have been cleaned from your pristine URLs.

Conclusion

We’ve set up the GoBand website, which is awesome. Bask in the spotlight of your first Drupal success. This site is a solid foundation that could be used to promote the band and build a community with. We’ll conclude this series in the final edition by giving you lots of excellent Drupal resources. So stay tuned as it will be out shortly. In it we’ll give you further advice on growing your Druapl based site that will keep it Rockin’.

Read the introduction – What’s Drupal and why?
Read Part 1 – Design it Illustrator
Read Part 2 – Slicing it Illustrator
Read Part 3 – XHTML
Read Part 4 – Theming Drupal
Read Part 6 -Wrap Up and Additional Resources