Theme Set Up and Configuration

The large and active community of developers that has formed around Drupal guarantees a steady flow of themes for this popular CMS. The diversity of that community also assures that there will be a wide variety of themes produced. Add into the equation the existence of a growing number of commercial and open source web designs and you can be certain that somewhere out there is a design that is close to what you want. The issue becomes identifying the sources of themes and designs, and determining how much work you want to do yourself.

You can find both design ideas and complete themes on the Web. You need to decide whether you want to work with an existing theme, or convert a design into a theme, or whether you want to start from scratch, unburdened by any preliminary constraints or alien code. For purposes of this chapter, we will be dealing with finding, installing, and configuring an existing and current Drupal theme. In later chapters, we will look at converting designs and at building themes from scratch.

Near the end of this chapter, we take a default theme and run it through the entire customization process to see how far we can go with only the default resources at our disposal.

This chapter assumes you have a working Drupal installation, and that you have access to the files on your server.

Finding Additional Themes

There are several factors to consider when determining the suitability of an existing theme.

The first issue is compatibility. Due to changes made to Drupal in the 5.x series, older themes will not work properly with Drupal 5.x. Accordingly, your first step is to determine which version of Drupal you are running.

To find the version information for your installation, go to Administer | Logs | Status Report. The first line of the Status Report tabular data will show your version number.

Status report

Here you can find a short overview of your Dm pa i site's parameters as well as any problems detected witn your installation, It is useful to copy/paste this information when you need support.

Drupal

</ Configuration file Protected v/ Cran maintenance tasks Last run 2 weeks 6 days ago

You can run eron manually.

/ Database schema Lip to date y Fits system Writable (public download method)

,/ GD library bundled (2.0.28 compatible}

The Status Report screen showing Drupal version number. Note also this screen includes other useful information, like your MySQL and PHP version numbers

[ _ - If you do not see the Status Report option, then you are probably using a

\ Drupal version earlier than 5.x. We suggest you upgrade as this book is for Drupal 5.x.

If you know your Drupal version, you can confirm whether the theme you are considering is usable on your system. If the theme you are looking at doesn't provide versioning information, assume the worst and make sure you back up your site before you install the questionable theme.

Once you're past the compatibility hurdle, your next concern is system requirements; does the theme require any additional extensions to work properly?

Some themes are ready to run with no additional extensions required. Many themes require that your Drupal installation include a particular templating engine. The most commonly required templating engine is PHPTemplate. If you are running a recent instance of Drupal, you will find that the PHPTemplate engine is installed by default. You can also download a variety of other popular templating engines, including Smarty and PHPTal from http: //drupal .org/project/Theme+engines. Check carefully whether the theme you've chosen requires you to download and install other extensions. If so, track down the additional extensions and install them first, before you install your theme.

A good place to start looking for a complete Drupal theme is, perhaps not surprisingly, the official Drupal site. At Drupal.org, you can find a variety of downloads, including both themes and template engines. Go to http: / /drupal. org/proj ect/Themes to find a listing of the current collection of themes. All the themes state very clearly the version compatibility and whether there are any prerequisites to run the theme.

In addition to the resources on the official Drupal site, there is an assortment of fan sites providing themes. Some sites are open source, others commercial, and a fair number are running unusual licenses (most frequently asking that footers be left intact with links back to their sites). Some of the themes available are great; most are average. If your firm is brand sensitive, or your design idiosyncratic, you will probably find yourself working from scratch.

Regardless of your particular needs, the theme repositories are a good place to start gathering ideas. Even if you cannot find exactly what you need, you sometimes find something with which you can work. An existing set of properly formed theme files can jump start your efforts and save you a ton of time.

If you wish to use an existing theme, pay attention to the terms of usage. You can save yourself (or your clients) major headaches by catching any unusual licensing provisions early in the process. There's nothing worse than spending hours on a theme only to discover its use is somehow restricted.

One source for designs with livable usage policies is the Open Source Web Design site, http: / /www. oswd. org, which includes a repository of designs, all governed by open source licensing terms. The down side of this resource is that all you get is the design—not the code, not a ready-made theme. You will need to convert the design into a usable theme.

For this chapter, let's search out a completed theme and for the sake of simplicity, let's take one from the official Drupal site. I am going to download the Gagarin theme from Drupal.org. I'll refer to this theme as a working example of some of the steps below. You can either grab a copy of the same theme or you can use another—the principles are the same regardless.

I downloaded Gagarin from http: //drupal .org/project/Themes

Gagarin is an elegant little theme from Garamond of the Russian Drupal community. Gagarin is set up for a two-column site (though it can be run in three columns) and works particularly well for a blog site.

Installing an Additional Theme

Theme installation requires that you have the ability to move files from your local machine on to your server. Typically, this is done with an FTP client or through your hosting control panel file manager. The method you use is up to you, both have their advantages. It makes no difference to Drupal which method you choose to employ.

Odds are your theme was delivered to you as a single file containing a compressed archive of files. When I downloaded Gagarin, above, I wound up with the file gagarin-5 .x-i .x-dev.tar.gz. The .tar.gz format (a.k.a. "tarball") is one of several commonly used to create compressed archives.

The first step towards getting the theme installed is to locally uncompress the archive. Double click the tarball and one of two things will happen: Either the file will uncompress and leave you with a new folder name "gagarin" or your system will prompt you to look for an application to open this file type. In the latter case, you will need to track down and install a file compression program. There are lots of good ones out there. Most users, however, should have no problems as compression software is installed on many systems these days.

Once you have successfully extracted the files, take a look at what you have. If there is a README file, read it now.

The next step is to get the extracted files up to your server. Use whatever means you prefer (FTP, control panel, etc.) to gain access to the directories of your Drupal site on the server.

Once you have access to your sever, navigate to the directory sites/all; this is where you will place all new theme files.

A note for old Drupal hands: The use of the sites/all directory is a change that was implemented in the version 5.x family. Using the sites/all directory instead of the traditional themes directory, allows you to run multiple sites off a single Drupal installation. Placing all your extensions inside the sites/all directory means less complication with future upgrades.

Next, in the sites/all directory, create a new sub-directory and name it themes. This new themes directory is where you will place all additional theme files. Finally, copy the gagarin directory and its contents inside sites/all/themes. Each theme should be kept in a separate directory. In this case you should have wound up with a directory structure like this: sites/all/themes/gagarin.

&

install php

Jan in, 2007, 6:15 PM

24 KB

PHP. Hypertext Pr or (PHP) document

lN5TALL.txt

Jan 8, 2007. 7:59 PM

12 KB

Plain text document

_

LjCEN5E.txt

Jut 9, 2006, 7:33 PM

20 KB

Plain text document

MAINTAINERS.txt

Dec 12, 2006, 1:09 AM

4 KB

Plain text document

...

mise

jan 30, 2007, 8:20 AM

Folder

»

modules

Jan 30, 2007, 8:20 AM

Folder

3

profiles

Jan 30, 2007, 8:20 AM

Folder

J)

robots, txt

Jan 8. 2007, 8:02 PM

4 KB

Plain text document

.

scripts

Jan 30, 2007, 8:20 AM

Folder

¥

m

sites

Today, 10:24 PM

Folder

all

Today, 10:25 PM

Folder

README.txt

Dec 23, 2006, 11:35 PM

4 KB

Plain text document

Y . .. themes

Todav, 10:25 PM

Folder

■EXP gagarin

Today, 7:52 PM

Folder

: default

Jan 30, 2007, 8:20 AM

Folder

te

Ei

themes

Today, 10:25 PM

Folder

é

update, php

Dec 26, 2006, 5:22 AM

32 KB

PHP: Hypertext Pr or (PHP) document

_

UPGRADE, txt

Jan 9. 2007. 5:16 PM

4 KB

Plain text document

'S

xmlrpc.php

Dec 11. 2005, 3:26 AM

4 KB

PHP: Hypertext Pr...or (PHP) document

Create the sites/all/themes directory to store the Gagarin theme files. -[29] -

Create the sites/all/themes directory to store the Gagarin theme files. -[29] -

If all has gone according to plan, you are now ready to close your connection to your server and visit the admin interface of your Drupal site.

For the next steps, access the admin interface to your site via your browser. Navigate to Administer| Site building | Themes. You should see your new theme listed alphabetically in the list of themes, as per the illustration, below.

The Drupal theme manager after the installation of the Gagarin theme. Note the path to the theme files appears underneath each theme's name

The theme management screen presents you with a list of all the themes available on your site. Note the Enabled checkbox and the Default radio button; these controls are key to making a theme display on the site.

To set up Gagarin, first we must enable it, then assign it to appear where we want, then configure it.

To enable Gagarin, select the Enabled checkbox to the right of the theme name. In Drupal, you must enable each theme you wish to use on the site.

Once you've selected Enable, then click the Save Configuration button at the bottom of the screen. Note that the appearance of the site does not change — that is because the new theme is neither assigned to any pages (nodes) nor is it set as the default.

Next, let's assign the theme to appear where we want. In this case, I want Gagarin to appear throughout the site, so I am going to select the Default radio button. The Default control is important; it sets the primary theme—the default theme—for the site. The default theme will be used by the system in all situations in which another theme is not specified. If we click the Default radio button next to our new theme and click Save Configuration, the theme will be applied immediately, for both front end and back end of the site.

Note that you can enable more than one theme at a time. By enabling more than one theme, another function becomes possible. Registered visitors can choose which theme to use when they view the site. When multiple themes are enabled, a registered user can pick a theme as their default theme and the system will remember their choice.

When the multiple theme function is active, site visitors can select their preferred theme via the Theme configuration preferences on the edit I

tab of the My account page. This functionality can be disabled by the I

administrator.

Note that once you enable a theme, another choice appears on the Theme Manager interface. Enabling a theme causes the Configure option to become active (it will appear to the right of the Default radio button in the column labeled Operations). The Configuration Manager provides access to both global configuration options and theme-specific settings. In the next section, we will take a look at both.

Configuring a Theme

In this section, we're going to go through the system and highlight the configuration options that are part of the default Drupal distro. We're not going to install any additional extensions or modify any code—we're going to focus exclusively on what can be done straight out of the box. We'll then apply this knowledge with an example configuration of the Garland default theme in the section that follows this one.

To begin, navigate to the theme manager (Administer | Site building | Themes). Access the configuration options of the Garland theme by clicking the configure link in the right hand column.

The Garland theme as it appears in the Theme Manager. The configure link is in the right hand column

The Garland theme as it appears in the Theme Manager. The configure link is in the right hand column

The Theme Configuration screen provides access to both global configuration and theme-specific configuration settings. As the name implies, global configuration is used to apply configuration choices consistently site wide—even across multiple themes. The theme specific configuration options relate only to a particular theme.

If there is a conflict between the theme specific configuration settings and the global configuration settings, the theme specific settings will take precedence.

Theme-Specific Configuration Options

The initial view on your screen is the theme-specific configuration options. In Garland, that looks like the following illustration:

The Theme-specific configuration options available with the Garland theme - [ 33 ] -

Let's break this down and look at what each section of the configuration manager can do.

Color Picker

The Color Picker is a nifty little tool made possible by color.module, which is included by default in the core. Not all themes support this configuration option, but when they do, this is a dead easy way to modify the colors used throughout the theme. The best way to learn this tool is to just get in and play with it. It is a simple tool and the range of choices and the limitations become apparent pretty quickly.

The padlock icons on the Color Picker color fields are used to lock in the relationship between two or more color choices. This allows you to experiment with different color combinations, all the while keeping the relationship between the various colors intact.

Enable/Disable Page Elements

Toggle display

Unable or dliable the display of certain page elerr e it.

F La g o P =;ite nan e p site slog an P Mission statement I kor pict lies il pOStS Use r p i ot j res n so m m e nts Search box Shorter Icon

The Page Elements section contains a set of options that can be toggled on or off. Many of the options in this section relate to fundamental elements of the look and feel like the logo, site name, slogan, and mission statement. Other options are specific to certain types of functionality, for example, whether to show or hide the users' pictures in posts or comments. Note that two of the checkboxes in this section, Logo and Shortcut icon, affect the two sections that appear below. Note also that the Search box option that appears on this page is dependent on the Search module being active. If the Search module is disabled, the search box option will not be available.

You can enable/disable the Search module from the Modules Manager, located at Administer | Site building | Modules.

Logo Settings

Logo image settings

If toggled on, the following logo will b.= displayed

Use the default logo Check here if you want the fhem^ to use the logo supplied with it. Path to custom logo:

The path tö the file yöü would like to use a? your log! file Instead of the default logo. Upload logo image:

If you dont have direct file access to the server, use this field to upload your logo.

The Logo section allows you to select which logo the site theme will use. This section is dependent on the Logo checkbox being selected in the Page Elements section, above. If the Logo checkbox is selected, then the administrator has the choice between using the default logo included with the theme, or of providing an alternative logo. An upload option allows the administrator to upload a new logo image directly from the admin interface, without having to resort to another application. Once the logo is uploaded, note that the location and name the system has given to the logo file appears in the box labeled Path to custom logo.

Favicon Settings

Shortcut icon settings

Your shortcut icon if 'favicon' is displayed in the address bar and bookmarks of most browsers.

P" Use the default shortcut icon.

Cheek here if you want thé theme to use the default shortcut icon Path to custom icon:

Îhë path to the imago file you mould like to use a? your custom shortucut icon. Upload icon imafle:

If you dont have direct file access to the server, u.re this filed to upload your shortcut icon

Save configuration Reset to defaults [

The Shortcut icon section allows you to select which favicon the site theme will use. Like the Logo section, this section is dependent on the Shortcut icon checkbox being selected in the Page Elements section, above. If the Shortcut icon checkbox is selected, then the administrator has the choice between using the default favicon included with the template, or of providing an alternative favicon. An upload option allows the administrator to upload a new favicon directly from the admin interface, without having to resort to another application. Once the favicon is uploaded, note that the location of the favicon file appears in the box labeled Path to custom icon.

The options discussed above are, as noted above, theme-specific. The options will vary from theme to theme, depending on the choices made by the theme developer when they created the theme. Compare for example, the options available in the Garland theme with those in the Chameleon and Marvin themes.

Global Configuration Settings

In addition to the theme-specific configuration options, the administrator can also access and change the Global configuration settings by selecting the Global tab at the top of the Theme Configuration page.

The global theme configuration options - [37 ] -

You will note there is a great deal of similarity between the Global Configuration options and the Site Configuration options. Hie choices mean the same in both sections and operate in the same manner. The only difference is in the Enable/Disable Page Elements section where the Display post information on option appears.

The Display post information on option is unique to the Global Theme Configuration manager. The three controls in this box control allow you to select whether the text "submitted by (Username) on (date)" appears to viewers of certain types of content.

Managing Modules and Blocks

Modules are plug-ins which extend the functionality of the Drupal core. The Modules you select to use and the positioning of their output (Blocks) on the page can affect greatly the look and feel of your site. Managing effectively the various Modules and Blocks is a key to controlling the user experience on your site.

The standard Drupal distro includes a number of modules, only some of which are active in the default configuration. You can enable additional modules or disable some of the optional ones to achieve the functionality you desire.

' A variety of modules can be found on the official Drupal site at

http://drupal.org/proj ect/Modules

The Module Manager

The Module Manager (Administer| Site building | Modules) includes a list of all available installed Modules. The default modules are categorized as Core - optional and Core - required. As you add additional modules to your installation, other group names may appear.

Home > Administer > Site building MOduleS Unlnstall

Modules are plugins for Drupal that extend its core function a [[ty. Here you can select which modules are enabled. Click on the name of the module In the navigation menu Tor their individual configuration pages. Once a module is enatsed, new permissions might be made available, Modules can automatically be temporarily disabled to reduce server load when your site becomes extremely bus/ by enabling the throttle.module and checking throttle. The auto-throttle functionality must be enabled cm the throttle configuration page after having enabled the throttle module

It is important that update.ptip ts run every time a module is updated to a newer version. You can rind all administration tasks belonging to a particular module on the administration by module page. Core - optional

Enabled Name Version Description

F

Aggregator

5.1

Aggregates syndicated content (R5Sf RDF, and Atom Feeds).

r

□ log

5.1

Enables keeping easily and regularly updated user web pages or blog s.

r

Blog API

5.1

Allows users to post content using applications that support XML-RPC blog APIs.

r

Book

5.1

Allows users to collaboratively author a book.

p

Color

5.1

Allows the user to change the color scheme of certain themes.

F

Comment

5.1

Allows users to comment on and discuss published corrtent-

fti.4j.jrL-J 1f fgrum (dtii&lfed}

r

Contact

5.1

Enables the use of both personal and site-wide contact farms.

r

Drupal

5.1

Lets you register your site with a central server and improve ranking of Drupal projects by posbng Information on your Installed modules and themes

r

Forum

5,1

Enables threaded discussions about general topics. Depends oft; fajtsftomv [enabled), Comment (enabled)

The Modules Manager

To enable a Module, simply access the Module Manager and then click the checkbox to the left of the Module's name. De-select the box to disable the Module. Once you have made your choices, click the Save configurationbutton at the bottom of the page.

Additional Modules can be downloaded and installed easily. Note that while you can disable any Module, you should not delete any of the Required Core Modules or else you will lose critical or important functionality on your site.

[_ Enabling a new module may result in additional user permissions that T

v \ / need to be set, or other configuration decisions that need to be taken by I

the administrator. To access all the user permissions and configuration I

screens in one place, view your administrator console by module. J

Blocks are output generated by the various components in the system. In many cases, enabling a Module automatically creates one or more related Blocks. Accordingly, your next step after enabling a Module should be a visit to the Blocks Manager.

The Blocks Manager

The tasks relating to Block management are accessed through the Blocks Manager, which can be found at Administer| Site building | Blocks.

The Blocks Manager interface looks like this:

The Blocks Manager. Note that the system helps with Block assignment by showing all the active regions in the theme

The Blocks manager gives you control over a number of useful aspects relevant to your theme. First, and of primary importance is the ability to publish Blocks to Regions of your theme, thereby allowing you to position the output on the screen.

To assign a Block to a Region, select the target Region from the combo box immediately to the right of the Block's name. Click the Save blocks button. When the page reloads, the Block will have been moved to reflect the new assignment; if all things necessary for output to appear have been satisfied, the output will now also appear on the page.

For a Block to be visible, the Block must be both enabled and assigned to an active Region on the page.

Hiding a block is just as easy: Simply select <none> from the combo box and then click Save blocks; the Block will be immediately hidden from view.

' Remember that Region placement may vary from theme to theme. If you I are using multiple themes on your site, be sensitive to Block placement I

across themes.

You can also manage the ordering of Blocks from the Blocks Manager. Immediately to the right of the Region combo box is the Weight combo box.

Weight, as the term is used in this context, reflects the ordering of Blocks within a single Region. A "lighter" Block will float up in the ordering, while a "heavier" Block will sink down relative to other Blocks. A weight of -1 is less than a weight of 1. Accordingly, the lightest setting is -10, the heaviest setting is 10. Don't forget to click the Save configuration button after you have chosen the weight of your Block.

Configuring Individual Blocks

The Blocks Manager also gives us access to the configuration options for each of our Blocks. Blocks can be configured at any time. Simply click the Block's configure link in the far right Operations column. Let's crack open the User Login Block and look at the configuration options presented there, as they are typical of the group.

Configuring the User Login Block - a typical Block configuration screen - [42 ] -

The Block configuration page provides options for naming and displaying the Block.

All parameters on this page are optional.

Block Title

The first option, Block title, gives you a free text field into which you can enter a specific name that will override the default Block name. If nothing is entered, the default name (supplied by the system for the default blocks) will appear. If you wish no title to appear with the Block, then enter <none> in the text field provided.

The remaining options all relate to the visibility of the block. You are able to control when the block will appear to a user by setting and applying the conditions on this screen.

User Specific Visibility Settings

The first option, labeled User specific visibility settings, allows you to give users the freedom to show or hide blocks and to set their own preferences regarding whether the block displays by default. If you do not wish to grant users this discretion, leave the default setting.

Role Specific Visibility Settings

The second option is labeled Role specific visibility setting. The system presents you with 2 boxes, but 3 choices. If you want everyone to see the block, leave the default state. Alternatively, you can show the block only to authenticated users (i.e., users who have logged in) or only to anonymous users (i.e., users who have not logged in).

[_y In addition to the parameters on this page, blocks can also be hidden during busy periods to decrease load on your server. The throttle module ' controls this specialized visibility setting.

Page Specific Visibility Settings

The final option is labeled Page specific visibility settings, but the label is actually a bit of a misnomer, as you can do much more here than simply tie block visibility to the page on the screen. The first two options allow you to list pages to include, or exclude, the display of the block. To enable this function, select the appropriate radio button then enter the URLs of the pages you wish to specify in the box below.

Let's look at the syntax for this window, as the Drupal system requires you to specify things in a particular fashion. Note that there are also some good shortcuts available here which will save you from having to enter a number of URLs to capture every single page of a particular content area or functionality:

term

designates

<front>

The home page

admin

The Admin main page

admin/*

All URLs that include admin/

aggregator/*

The RSS Aggregator main page

aggregator/x

The RSS Aggregator with the ID of x

(where x is an integer)

aggregator

All URLs that include aggregator/

blog

The blog main page

blog/x

The blog with the ID of x (where x is an

integer)

blog/*

All URLS that include blog/ (every personal

blog main page)

contact

The default system Contact form

forum

The Forum main page

forum/x

The Forum with the ID of x (where x is an

integer)

forum/*

All URLs that include forum/ (every forum

main page)

node/x

An item with the node ID of x (where x is an

integer)

user/*

The User pages.

user/x

The main page of the user with the ID of x

(where x is an integer)

Note that you can use more than one statement at a time. To use multiple statements, simply input them on separate lines in the text box. One consideration to keep in mind is that you cannot specify at the same time, pages on which a Block will appear as well as pages on which the Block does not appear—those options are mutually exclusive.

The third radio button on this section is where the fun begins (and this should arguably be a separate control on the page, but the Drupal team simplified the interface by just listing it all under one section). If you select the third button, then you are able to enter PHP code that can control the visibility of the block in almost literally any fashion you choose. Don't be fooled by the label they put on it—Pages — this is a wild card field in which you can apply PHP code that can be used to establish logic that determines visibility according to various criteria.

Adding PHP to Blocks

With PHP statements Blocks management becomes much more interesting. You can add custom visibility settings of any variety. Tie visibility to a user, to a role, to a content type or whatever combination is needed for your site.

Let's look at some examples:

1. Display a Block only to the user who's User ID = 1:

<?php global $user; if ($user->uid == 1){ return TRUE;

return FALSE;

2. Display a Block only to users who belong to a particular role (in this example, the role = Moderator):

if (in_array('Moderator',$user->roles)) { return TRUE;

return FALSE;

3. Display a Block only for a specific content type (in this example, the content type = story):

if (arg(O) == 'node' && is_numeric(arg(1))) { $nid = arg(1);

$node = node_load(array('nid' => $nid)); $type = $node->type; if (isset($types[$type])) { $match = TRUE;

4. Display a Block throughout all Forums:

if (arg(O) == 'node' && ctype_digit(arg(1))) { $node = node_load(arg(1)); if ($node->type == 'forum') { return TRUE;

5. A variation: Display a Block throughout all Blogs:

if (arg(O) == 'node' && ctype_digit(arg(1))) { $node = node_load(arg(1)); if ($node->type == 'forum') { return TRUE;

There is a great deal of flexibility here and you should explore creative use of this feature. While you cannot combine the page syntax, above, with the PHP snippets, you can control your Block display to a very high degree with the use of the PHP visibility snippets above.

In addition to the default Blocks, administrators can also use the Blocks manager to define custom Blocks—through use of the Add Block tab at the top of the

Blocks Manager.

Theming in Action: Dressing Up Garland

Now, just for the sake of practice, let's take what's been covered in this chapter and apply it to the tailoring an existing theme. We'll start with a default theme and apply the various options available in the system in an effort to create a uniquely tailored theme.

For purposes of the following example, our hypothetical client is Fluid Carbon, a fan site for Italian sports cars. This is a hobbyist's site, so the owner has a very limited budget and doesn't want to pay for custom design work or custom component development; the budget restrictions basically force us to work with Drupal straight out of the box.

Here are the client's requirements...

Look & Feel

• Fluid 3 column layout

• Color scheme to match existing client I.D.

• Must use client's logo in header

• Wants clean look—not too much clutter

• Vertical main nav, in the right column

Functionality

• Blog for site editor (only one blog)

• Ability to display third party RSS feed content

• Must support user generated comments

• Display button ads

The client's requirements are squarely within the capabilities of the default Drupal distro, with only one exception- the need for button ads. Normally, you might want to go ahead and install a banner management extension to handle this task, but this client has no budget, so we're come up with an old-fashioned, low cost (but rather high maintenance!) solution.

Major Tasks to accomplish:

• Modify theme colors to match client I.D.

• Configure theme to match requirements

• Get client logo into theme

• Enable necessary Modules

• Enable new Blocks

• Assign Blocks to create 3 column layout

• Set Block visibility rules

• Create Menu items

• Set user access controls

Along the way, we'll also look at a few little tweaks that will help the usability of the site and add some variety as well. The client is going to load his own content, so for our testing purposes, we'll only create dummy content as needed along the way.

Let's assume for this example, a fresh installation of Drupal. To begin, go to the Theme Manager (Administer | Site building | Themes) and click on the configure button by the Garland theme. Garland is a fluid design, which supports either 2 or three columns. It is simple and clean and consistent with the client's general wishes. Garland also supports the Color module which makes it easy for us to change the theme color scheme to match the client's existing logo.

Set the Color Scheme

First, let's work on the color scheme. In the configuration manager, select Custom from the Color set combo box and enter the values you see in the illustration:

The color module lets you set theme colors from within the admin interface. As you modify the colors, the Preview image updates

Change Display Settings

Next, scroll down the configuration screen and change the Toggle display settings to enable only the Logo option—we don't want the site name, slogan or any of those other things cluttering up the design.

Toggle display

Enable or disable the display of certain page elements.

F Logo Site rame Site slogan V Mission statement user pictures m posts User pictures m comments r Search box —I Shortcut icon

Our Toggle display settings for this example - [49 | -

Was this article helpful?

0 0

Post a comment