Gravatar in heading

  • janvanarkel

    (@janvanarkel)


    15 years ago

    Hi all,
    A question from a newbee…
    – I added a gravatar to the heading of a posting
    – it works ok, but I’m not pleased with how it looks

    The code in index.php is:

    <div class="indent">
<div class="title">
<div class="bgr-left"><div class="bgr-right"><div class="bgr-bot">
<div class="corner-left-top"><div class="corner-right-top"><div class="corner-left-bot"><div class="corner-right-bot">

<h2>
<a href="<?php the_permalink() ?>"
       rel="bookmark" title="Permanent Link to
       <?php the_title_attribute(); ?>">
       <?php the_title(); ?></a>
       <?php echo get_avatar( get_the_author_email(), '50' ); ?>
</h2>
<small>
       Gepubliceerd op <?php the_time('j F Y') ?>
       door <?php the_author_link() ?>
       in categorie <?php the_category(', ') ?>
</small>

    Now the gravatar is placed right after the text of the title.
    I would like to have the gravatar completely to the right (on a fixed place).

    I think that somehow I should do this in ‘style.css’. Right?
    For the comments I can see the following tag:

    .commentlist li .avatar {
		float: right;
		border: 1px solid #eee;
		padding: 2px;
		background: #fff; /*margin:0px 20px 15px 0px;*/
		}

    So I suspect I should do something similar for a avatar in the heading.
    But how…?

    Any help is appreciated.
    Jan van Arkel

Viewing 2 replies - 1 through 2 (of 2 total)
  • Michael

    (@alchymyth)

    you are on the right track:
    just change your code from:

    <h2>
<a href="<?php the_permalink() ?>"
       rel="bookmark" title="Permanent Link to
       <?php the_title_attribute(); ?>">
       <?php the_title(); ?></a>
       <?php echo get_avatar( get_the_author_email(), '50' ); ?>
</h2>

    to: (move the gravatar out of the h2 tags, and surround it with a new div, class .gravatar)

    <div class="gravatar"><?php echo get_avatar( get_the_author_email(), '50' ); ?></div>
<h2>
<a href="<?php the_permalink() ?>"
       rel="bookmark" title="Permanent Link to
       <?php the_title_attribute(); ?>">
       <?php the_title(); ?></a>
</h2>

    and in style.css add whatever styling you want:
    .gravatar { float:right; margin: 10px 10px 10px 10px; background-color: #eee; }

    Thread Starter janvanarkel

    (@janvanarkel)

    Great!

    Thanks for helping out.

    Jan

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Gravatar in heading’ is closed to new replies.