DrupalTips

This page is for user-contributed tips on using the UofC's Drupal Web Content management system. Support from the WCM team is available on their site.

Fixing the Page Titles for Your Site
By default, the HTML title of each page (the part that appears in the title bar of your browser window) is of the form "Title | University of Calgary", where "Title" is the page title you put in the "Title" field in the page's edit view. The title field is important, since it is primarily used for indexing the page in search engines, etc. The default results in the unfortunate assignment of, e.g., "Home | University of Calgary" to your site's home page, which suggests that you're looking at the UofC home page, not, e.g., your department's home page. It should be something like "Home | Department of Breakthrough Science | University of Calgary". To make this happen, follow these steps:


 * Login to your site on the WCM server.
 * Click on "Administer" in the navigation menu on the left.
 * Click on "Site Configuration".
 * Click on "Site Information".
 * Change the text in the "Name" field from "University of Calgary" to "Department of Breakthrough Science | University of Calgary".
 * Click on "Save Configuration" at the bottom.

Manually Adding Menu Items
Ordinarily you get a tab in the "primary links" menu of your site just by making a new page, and then selecting "Primary links" as the parent item in the "Menu Settings" section of the page. But sometimes you want to add something other than a page to the menu, e.g., a link to the Events Calendar.


 * Click on "Administer".
 * Click on "Menus" under "Site building".
 * Find the "Primary Links" menu, click on "Add item".
 * Put in the name of the menu tab in "Title", e.g., "Events"
 * Put in a longer version, e.g, "Calendar of Events in Breakthrough Science". This will be a tooltip that gets displayed when you mouse-over the menu tab.
 * Enter the relative URL in the "Path" field, e.g., "event" for the events calendar.
 * Select the "Weight" field to determine where in the menu the item will show up.
 * Click "Submit".

This also works for the following tasks:


 * Adding a menu item to the "Quick Links" menu, e.g., a link to your Faculty website. (For this, put the full URL in the "Path" field.
 * Adding an extra link to the top level of one of your site's sections. For instance, you might have a main page for your department's undergraduate program with a number of sub-pages. By default, only the sub-pages will have links in the menu that's generated in the left sidebar, whereas "Undergraduate Programs" or whatever is only a header, but doesn't link anywhere. You could add a menu item "General Information" to the "Undergrad" menu, with "Weight" -10 which will then show up at the top of that menu on every sub-page.

Making a Page for News Items
Say you have news items (e.g., as "story" content) and/or events announcements, and you would like them all listed on a separate page. Maybe you even want that page to be linked from the main menu, e.g., a "News & Events" tab. Here's one way to do this.

First, you have to tell Drupal which sories, pages, events etc. should go on that page. To this end, set up a category "News Item":


 * Click on "Administer" in the navigation menu on the left.
 * Click on "Categories" under "Content Management".
 * Click on the "Add vocabulary" tab.
 * Enter a name for the vocabulary, e.g., "News".
 * Select which entry types you would like this vocabulary to apply to; probably "story" and "event".
 * Click "Submit" at the bottom.
 * Go back to the Category "List" tab. There should now be a "News" vocabulary.
 * Click on "add terms".
 * Enter "News and Events" in the "Name" field (or just "News" if you don't want to list events at all, or if you want to list them separately).
 * Click "Submit" at the bottom of the page.

Next, you want to have an easily remembered address for the "News and Events" page. You should now be looking at the "List" tab for the "News" vocabulary, which lists "News and Events" (with an "edit") link beside it. If not, go to the "Categories" page, then click on "list items" in the line for the "News" vocabulary.


 * Click on the link "News and Events". This will take you to a page that lists all news and events. If you haven't tagged any stories or events as "News and Events", it'll just say "There are currently no posts in this category".
 * Make a note of the URL (in the location field of your browser). It should be something like ".../yoursite/taxonomy/term/1".
 * Click on "Administer" in the navigation menu.
 * Click on "URL aliases" under "Site building".
 * Click on the "Add" tab.
 * In the "Existing system path" field, put in, e.g., "taxonomy/term/1".
 * In the second text field, put in, e.g., "news".
 * Click "create new alias".

You now should have a functioning "News and Events" page at .../yoursite/news, you can link to it using the relative path "news" or the absolute path "/yoursite/news".

If you want this link to show up as one of the tabs in the primary menu on your site, you have to add it manually to the menu (see above).

Now that you have a category set up, you will see a drop-down menu labeled "News" below the title field in the edit view for every "story" or "event" content item. Choose "News Item" for every story or event that you want to show on your "News and Events" page.

Overriding or Extending the Style Sheets
The appearance of your sites pages is determined by 'style sheets' using the CSS formats. These style sheets tell your browser, e.g., that level 1 headers should appear in Arial, 1.5 times the ordinary size, and with a grey line below it. You can override or expand the standard Drupal styles by adding your own CSS declarations.


 * Click on "Administer".
 * Under "Site building", select "Themes".
 * Click on the "configure" link next to your site's active theme.
 * Click on "UofC Template Overrides" below the Color part.
 * Add your CSS in the box.
 * Click "Save Configuration".

For instance, here's how you add a line like the one used for level 1 heads also for level 2 heads:

h2 {border-bottom: 1px solid #dad9da;}