Home > Articles > Web Development > Content Management Systems

  • Print
  • + Share This
From the Rough Cut Installing the Company Theme

Installing the Company Theme

The Danland and Zero Point themes we have explored so far do allow dropdown menu, but both require some configuration. We’re going to look at a theme called Company that will allow us to start using a dropdown menu almost immediately after installation. In the Company theme, you only need to configure your menu.

  1. Find the theme.
    1. Go to http://drupal.org/project/company.
    2. Copy the tar.gz link for the Drupal 7 version of this theme.
  2. Install the theme.
    1. Go to your site then click Appearance.
    2. Click Install new theme.
    3. Paste the link into the Install from URL field and then click Install.
    4. Click Enable newly added themes.
  3. Turn on the theme.
  4. Scroll down and locate the Company theme.
  5. Click Enable and set default.
  6. Set up the theme.
    1. Click on Settings for the Company theme
    2. Scroll down to find the Company Theme Settings and observe this theme has a slideshow.
    3. Uncheck the Show slideshow box
    4. Click Save configuration

Go to the homepage and you’ll see the new theme live on your site. The Company theme has not only changed the design of the site but also the layout. The left column has now moved to the right side of the screen.

Figure 9.18 Your site with Company as the default theme

Setting Up the Dropdown Menu

Now we’re going to set up the dropdown menu for our site. As we do this, we’re going to remind you of what we did in Chapter 8 and introduce you to a new feature of menus: moving links from one menu to another.

  1. Go to Structure, then Menus.
  2. Click list links in the Navigation row.
  3. Look for the parent and child links that we created in Chapter 8. We’re going to move the child links to the Main menu.
  4. Click edit next to the Drupal child link.
  5. Scroll down to the Parent link option. Choose Forums, which is at the top of the option area, just under <Main Menu>, as in Figure 9.19.
  6. Figure 9.19 Choosing a new Parent menu link

  7. Click Save.

You’ll now be looking at the Main main as in Figure 9.20. Your Drupal child link and the three links underneath will now have moved from the Navigation menu to this Main Menu.

Figure 9.20 Child menu links moved from the Navigation menu to the Main menu

Let’s repeat that process and move

  1. Go to Structure, then Menus
  2. Click list links in the Navigation row
  3. Click edit next to the General Discussion child link.
  4. Scroll down to the Parent link option. Choose Forums, which is at the top of the option area, just under <Main Menu>.
  5. Click Save.

We now come to the part of dropdown menus that is most often confusing to Drupal beginners: whether menus expand automatically or not. Let’s go our homepage see our dropdown menus in action. On the homepage, you’ll notice the dropdown menus don’t work at all, as shown in Figure 9.21.

Figure 9.21 The Main menu on your homepage

However, if you click on the Forums tab, the child menu links will become visible as in Figure 9.22.

Figure 9.22 The Main menu on your Forums page

Even now your child links under Drupal aren’t visible. It won’t be until you click on the Drupal link that all three child links will become visible, as in Figure 9.23.

Figure 9.23 The Main menu on your Drupal Forums page

Why is this happening? By default, Drupal’s menus are set up to match the needs of text menus. To use an example we’ve already seen, this behavior made perfect sense when were using it with the Navigation menu. However, the same behavior seems abnormal with dropdown menus where we expect all the links to be visible on all pages.

How do we change this behavior? We need to check one box in the settings for each menu.

  1. Go to Structure, then Menus.
  2. Click list links in the Main menu row.
  3. Click edit next to the Forums link.
  4. Check the Show as expanded box.
  5. Click Save.
  6. Check the Show as expanded box for the Drupal and General Discussion links.
  • + Share This
  • 🔖 Save To Your Account