Most Drupal themes adhere to a standard approach for incorporating the logo and the name of the site. To change the logo of the site from the default Genesis logo, click on the Appearance link in the top menu. On the Appearance page, click on the Settings link for your Genesis subtheme. On the Settings page, uncheck the use default logo checkbox. As soon as you uncheck the box, Drupal displays a text field where you can enter the path to the image you wish to use for your logo or have the option to upload a file. Either approach results in a new logo being displayed in place of the default Genesis logo. Be mindful of the dimensions of the logo based on the dimensions of your banner area. You can also change the site’s name by clicking on the Configuration link on the top menu and on the Configuration page clicking on the Site information link. On the Site information page you can change the value in the Site name text field. A Tool for Helping You Theme Your Site There is a tool that I use on a daily basis that is indispensible when it comes to theming: Firefox’s Firebug plug-in (which is now available for Google Chrome). Firebug provides all of the information you need to identify the right CSS elements to create or modify in order to achieve the look of any item on any page. Firebug provides a simple-to-use mechanism for identifying the CSS ID or class that is assigned to a specific element by simply right-clicking on that element and choosing the inspect element item from the menu. For example, I right-clicked on the site title in the header area and selected the inspect element option. As shown in Figure 13-11, Firebug displayed the HTML used by the theme to render the title and the CSS used by the browser to render that element. Firebug even goes so far as to display the name of the CSS file and the line number within that file where the attributes are defined. It doesn’t get much easier than that!
