Add Clickable Logo to the StudioPress Genesis Framework

StudioPress Genesis FrameworkThis is a very quick tutorial to add a clickable logo to the Genesis Framework. The code also adds your Bloginfo as an “Alt” and “Title” to your logo to help with SEO.

First of all you’ll need to prepare your logo, size to the correct dimensions then upload to your website. Make a note of the full URL to the logo.

Now make a backup copy of functions.php in your Genesis childtheme to allow you to revert the file in the event things go wrong.

The next step is to edit functions.php in your Genesis childtheme. I recommend that you use to use FTP to edit the files otherwise if an error occurs with your code you could lock yourself out of your website.

Add the code from the gist below and replacing ‘http://www.mywebsite.com/logo.png’ with the full path to your logo. You can also access the raw version of this gist here.

Save functions.php and test.

You may need to edit your CSS depending on the dimensions of your logo – if you want to turn off the site title and tagline then you can do so via the normal settings.

Do you have a comment to add?

Share

4 Responses to Add Clickable Logo to the StudioPress Genesis Framework

  • C R

    Thanks!  This was really helpful!

  • Amanda Mayne

    Hi C R,

    Thank you for the feedback – and glad that you found the code snippet useful.

    Thanks,
    Amanda

  • RD

    Very helpful!  Thank you so much.  I am having trouble centering the title. Is there a simple fix to this?

    Thanks!

    • Steve Mayne

      Hi RD, it is something like this to center the title, replace the width with the actual width of your logo.

      /* set the logo to 200px to align center */
      .title-area {
      width:200px;
      }

      /* align logo center */
      .title-area,
      .site-title {
      background-position: center center!important;
      float:none!important;
      margin-left:auto!important;
      margin-right:auto!important;
      }

Leave a Reply

Your email address will not be published. Required fields are marked *