Skip to main content
Appearance

Installing Drupal Themes and Configuring Blocks

Building a Website Part 9

In this finial installment of my blog series on creating a website, I will be covering installing Drupal themes and configuring blocks. My goal is to jsut give you a very basic understand of how the two work and how to use them. There is a great number of things that you can do with the combination to create a website that works for you but here's the basics.

 

Themes - Themes in Drupal control the display of the content and the layout of each page. It does this by breaking the layout into regions that you can then add blocks or content to.

 

Blocks - Blocks are piece of content or groupings of content and information created by the modules enabled on your site that can be placed into regions of the theme. Blocks can also be configured to only show up on certain pages, content types and by defined users.

 

The Drupal site has a number of different themes to choose from in fact currently for Drupal 7 there are over 1,700 posted at http://drupal.org/project/themes. Often the themes were designed for a site and then the developer submitted it to Drupal to share with others. Themes can be very basic to extremely complex depending on the creator and their needs. Some will require no additional steps other than the most basic installation and others will need additional scripts and modules to work correctly. There is also a number of professionally designed themes that you can buy a license to use or you can hire someone to create a theme for you. If you buy a theme make sure that it is a Drupal theme or you feel comfortable trying to adapt the theme for Drupal. 

 

Now how do you choose a theme that will work for you? The answer is what layout will work for you. Beyond setting style options like background colors, font style and color and other design settings, a Drupal theme also sets the layout of the theme. It does this by breaking down the layout into columns and rows and then adding regions that sit inside them. The basic layout will have the following:

 

  • Header - a row that runs the width of the page across the top
  • Content - a row that is below the header.
  • Footer - a row that runs along the bottom of the page

 

Each of these rows can then be broken into different columns and regions as need. For example, the content are maybe divided into 3 different regions to create two side bars and a content region. Then using Drupal's block module you can decide what kind of content will be displayed or not displayed in each block. Like I stated in an earlier blog, you need to figure out the structure of your site before hand. The best way is to outline the site in much the same way you would do a book or report. I've always found that perceiving the site as a book is the best approach to structure with each chapter as a category. Now along with the chapters title page being easy to get to from any page, you also should add links that your users will want to get to easily like contact, information about your site, updates, news, etc...

 

Let's say you are creating a site for business that sells "widgets" and "dodas". Then your structure would be something like this:

 

  1. Home - the main page of your site
  2. Widgets
    1. ​Widget 1
    2. Widget 2
    3. Widget 3
  3. Dudas
    1. Duda 1
    2. Duda 2
    3. Duda 3
  4. About the business
  5. News
  6. Contact

 

With is structure you are going to want to have a menu with the six main topics but you might also want to have a block that shows the latest news or featured products on each page. You really need to consider that you have limited space and if you are going to give up that space for something, it needs to be important otherwise your users may find your site frustrating because they can not find what they are looking for.

 

So when picking a theme it's best to decide how many pieces or blocks of information you are going to display and how you want that to display. To be honest, when I begin to develop either a new build of an existing site or a completely new site, I tend to install a number of themes before settling on the one that I feel works best. If you really can't find what you are looking for, there are a number of base themes which only give you the basic bare bones and then you need to create sub-themes within the frame work. 

 

For this example, I will be installing a theme that is complete though. I choose Modern Theme for a number of reasons. First off I like the clean layout, it is light weight and has a number of regions that can be used or not used, making it a great theme to adapt to your needs. Also, I haven't tried it out and want to play with it.

 

Here are the basic steps to installing the theme, I've included a gallery of the steps I took to install the theme and configured the block at the bottom of the page:

 

  1. Open the Admin Appearance page by clicking on the "Appearance" link on the admin toolbar
  2. Just like installing a module, either enter the url for the theme's file or download the file to your computer and then upload it to Drupal. Then click the "Install Button"
  3. A page will open with the message "Installation was completed successfully." highlighted in green at the top of the page. Click on the link "Enable newly added themes"
  4. This will open the admin Appearance page again. You are going to want to scroll down to find the newly added theme and click on the "Enable and set default"
  5. When the page reloads your new theme will be enabled. At this point, you may want to adjust the theme's settings by clicking on the "settings" link. Here you will find a great deal of useful settings including uploading your logo, favicon and other settings.

 

Now that you have your theme set there is one more thing you will want to do before begriming to add content. You want to set up your blocks and set their location.

 

  1. Click on the "Structure" on the admin toolbar and open the structure page. Here is where you will find a number of other useful pages including Menu, Content Types, Taxonomy and if you have them installed the panels and view config pages.
  2. Click on the "Block" Link and open the Blocks page. 
  3. Once the page is open take a look around. The page will be divided into sections of the layout site. Each of these is a region where you can add different blocks. For this blog we are going to add the "recent content" block to "footer first column". To do this first locate the block toward the bottom under "Disabled" and then select the location you wish.
  4. Click on the "Save blocks" button and the page will reload.

 

That's all there is to it. You can now adjust the order in which the blocks display in the region by dragging and dropping them. You can also configure the block further by clicking on the "Configure" link next to the Block. Depending on the block you can change a number of display settings including what pages the block appears on.

 

The best advice I can give you regardless of what you are try to do is don't be afraid of just jumping in and trying to figure it out for yourself. With a lot of things in life the main learning tool is mistakes. I hope that this series of blogs has not only inspired you to create your own website but has given you a small understand of some of the basics. This is a subject that I could devote a complete site to and I have just scratched the surface. If you enjoy this series, would like to share feedback or would like to see me write more blogs on the subject, please contact me at davo@axiompiercing.com

Add new comment

Plain text

  • No HTML tags allowed.
  • Lines and paragraphs break automatically.
  • Web page addresses and email addresses turn into links automatically.