Never miss a thing!

Sign up to have the latest news and announcements from my site delivered straight to your inbox.
  • This field is for validation purposes and should be left unchanged.

Reader Interactions

Comments

  1. Hey Susanta, did you check to see if the email address has an image associated with it on your Gravatar.com account ?

  2. If there a way I could use the URL of my image instead? I went to the header but I can’t really use an image cuz it replaces the text logo, which kinda vitiates the very purpose of this code to begin with.

  3. No working in Dynamik unfortunately and as usual. It places the gravatar right in the middle of the header.

    Might be time to start using some different child themes, Dynamik is one huge royal pain in the backside as pretty much all but none of the Genesis tutorials ever work for it.

    • Tomas – sounds like it worked fine (use Inspect Element to see if it inserted the code just before your site title). Regardless of Dynamik theme or other, you’ll need to add custom styles to accommodate for your theme. Applying a left float to the site image might be do the trick?

      If you want a ton of control over design/layout without messing with code, you might enjoy Beaver Builder. I wrote a little about it here.

  4. Hey Carrie!

    Thanks so much for the post, very helpful! I was hoping I might be able to ask a few questions on it though if I may…

    I am trying to add a circular shaped logo before my site title and tagline, so it’s the same shape and size as about how the avatar looks here on your page. However I’m not sure exactly where to upload and insert my logo image into the code you shared.

    Also, as for hooking the function. All I was able to find in my genesis sample child theme settings was the header.php and it shows this;

    do_action( ‘genesis_before_header’ );
    do_action( ‘genesis_header’ );
    do_action( ‘genesis_after_header’ );

    Is that the section of code I need? Do I insert this…

    add_action( ‘genesis_header’, ‘cd_site_image’, 5 );

    …somewhere within that section?

    Thanks so much for any help you’re able to give, much appreciated!! ^.^

    • Hey Bree,
      Great questions. First things first – never, ever edit Genesis Framework files (i.e. /genesis/). Next time you update Genesis you’ll be sorely disappointed when your customizations are overwritten. That’s the beauty of child themes (in your case, the Genesis Sample Theme). Make customizations within your child theme and then you never have to worry about updates (child themes don’t really get updated).

      So, your mods for this tutorial belong in your child theme’s functions.php and style.css, respectively.

      As for your logo, I don’t think Genesis Sample Theme supports a custom logo out of the box, but I’m linking to an article below that should help.

      Here’s a couple of posts you might find helpful:

      Some FAQs About the Genesis Framework, StudioPress Themes, and 3rd Party Themes

      How to: Add a Logo to a Genesis theme

      Cheers,
      Carrie

  5. Hi Carrie, nice tutorial.

    But can you tell me what is the function of ‘224’ in your get_avatar function? why did you use the number? why not others?

  6. Hi Carrie,

    Weird issue I’m experiencing; maybe you can help?

    Screenshot: http://prntscr.com/b95zqo

    Inspecting the header I can see the image is there; however, I cannot for the life of my figure out why it isn’t actually showing.

    Note: I’m using the following modified version of you snippet @function.php

    ‘add_action( ‘genesis_header’, ‘kp_site_image’, 5 );

    function kp_site_image() {
    $header_image = ”;
    printf( ‘%s’, $header_image );
    }’

  7. Hi, Carrie. Tried this out and it works great with a Gravatar pull if there is no header image. When I add a header image to the site, however, the image is displayed twice — once as expected and ALSO as a replacement for the text-based title. Any ideas?

  8. Hi Carrie,

    Thanks for the tutorial. I like very much yours classes at Lynda’s
    I am trying to put an own logo as you said, but all I get is an avatar … I am using the last version of Genesis framework, and I am working from the Genesis sample theme.
    This is the code I have :

    add_action( ‘genesis_header’, ‘cd_site_image’, 5 );
    /**
    * Output image before site title.
    *
    * Checks to see if a header image exists. If so, output that in an `img` tag. If not, get
    * the Gravatar associated with the site administrator’s email (under Settings > General).
    *
    * @see get_header_image() Retrieve header image for custom header.
    * @see get_avatar() Retrieve the avatar “ tag for a user.
    *
    * @return string HTML for site logo/image.
    */
    function cd_site_image() {
    $header_image = get_header_image() ? ” : get_avatar( get_option( ‘admin_email’ ), 224 );
    printf( ‘%s’, $header_image );
    }

    What Am I missing. Thanks a lot.

  9. Nice article and great code, thanks for it! I would like to use it but in the mobile view the image is aligned left, and ‘text-align: center’ or any other code do not work for me. Do you have any idea?

  10. Thank you for the tut. I learned a lot from it. Reading from the replies and your comments, this tutorial will only work for child themes of the Genesis framework except the Genesis sample? And by child themes, meaning all themes made by StudioPress and the third party themes found in StudioPress.com?

  11. Hi Carrie,

    I have two questions:

    To start with, I’m using a Genesis child theme I created using your tutorial on Lynda.com…

    1. If I use the header image, it puts it up twice instead of once. Is there a way to stop that from happening?

    2. If I remove the header image and use the Gravatar, it places the Gravatar in the upper left hand corner and the text for my header will not align with it at all. It sits to the right of the Gravatar, but it also sits below the Gravatar. (I thought it might be Safari, but I tried it in Chrome & Firefox with the same issue.)

    I tried changing the display option but that just causes bigger issues (inline-block causes all header elements to stack instead of displaying inline, just inline puts the title directly under the Gravatar).

    Any ideas? Thanks!

  12. Hi Carrie,

    I have created my own genesis child theme by following your course on lynda(dot)com. Can you please post an article on “How to improve the page-load speed of genesis child theme”.

  13. Hi Carrie,

    How do I get my image and site title on the same line? At the moment my gravatar image appears above my site title rather than to the left. I have tried float left/right, align: left/right etc. but no joy.

    My site is https://petertremayne.com

    Thanks,

    Peter

  14. Hi Carrie,

    Yes I ended up created a header using PicMonkey and added a couple of lines of CSS code to position it correctly.

    Peter

Leave a Reply