Theming Unique Home Page Elements in Drupal with $is_front & PHP


Ask 10 Drupal Themers how they would accomplish a task in Drupal and you just might get 10 different answers. Most likely those 10 different ways of accomplishing the task would all be valid and unique. This concept would apply when theming a home page element in Drupal; there are several different ways of going about this. For example, you could use page-front.tpl.php, Panels, Context, the front page module or custom body classes -- well the list goes on.

Recently we needed to have a different logo on the home page than the rest of the site as it was on a black background unlike the rest of the site which was a white background so the logo needed to be a reversed version. We were already rendering some CSS styles that were unique to the home page using custom CSS body classes but in the case of the logo, our Drupal theme was already rendering the logo with the tag. In the search to have a different logo, we found a module that could do this but it seemed like too much configuration and overhead for what we needed. So we discovered a Drupal theme variable called $is_front. Combing this with an if-then enabled to render the different logo on the home page.

You can see from the code below that we switch logos based on whether or not the page being called is the home page or not using $is_front. The code is in our site's theme page.tpl.php file so you know where to go to add / edit this.

<?php if ($is_front): // switch the logos for front and interior ?>
    <?php if ($logo): //front page logo ?>
       <div id="logo">
          <a href="<?php print check_url($front_page); ?>" title="<?php print t('Home'); ?>">
          <img src="/sites/default/themes/mytheme/images/logo-black.png"
          alt="<?php print $site_name; ?>" title="<?php print $site_name; ?>" />
          </a>
       </div>
    <?php endif; ?>
    <?php else : ?>
  <?php if ($logo): //call the default logo that your drupal theme provides for interior pages ?>
     <div id="logo">
        <a href="<?php print check_url($front_page); ?>" title="<?php print t('Home'); ?>">
        <img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" />
        </a>
      </div>
   <?php endif; ?>
<?php endif; //end logo switch ?>

Hopefully this post will help any others encountering this type of need for unique home page elements in Drupal Theming.

Note for Drupal 7, the code is the same but if you are using Omega, then you'd want to use Delta + Context.

Tags