Title: Change Post Header HTML?
Last modified: August 30, 2016

---

# Change Post Header HTML?

 *  Resolved [JazzSP8](https://wordpress.org/support/users/jazzsp8/)
 * (@jazzsp8)
 * [10 years, 8 months ago](https://wordpress.org/support/topic/change-post-header-html/)
 * Hi All
 * I’m new to this WordPress thing, and to CSS – I’ve got a new blog that I’ve been
   working on am now getting it “just right” before I start to publicise it properly.
 * I like the idea of images for the header of each post, but I don’t want them 
   to be big as seems standard, I want them to be small thumbnails offset to the
   right of the Title Text.
 * I managed to find the sizing options in the CSS but now I want to amend the header
   so that it sits to the right.
 * This is the before: [http://www.thechillidiaries.co.uk/blog/forum/before.jpg](http://www.thechillidiaries.co.uk/blog/forum/before.jpg)
 * This is what I want: [http://www.thechillidiaries.co.uk/blog/forum/after.jpg](http://www.thechillidiaries.co.uk/blog/forum/after.jpg)
 * As you can see I used the Firefox Inspect Element to achieve it with the following
   code;
 * `<a href="http://www.thechillidiaries.co.uk/blog/next-years-chilli-plan/" rel
   ="bookmark">Next years Chilli plan</a><img src="http://i2.wp.com/www.thechillidiaries.
   co.uk/blog/wp-content/uploads/2015/10/20151001_180840-e1444239793897.jpg?fit=
   150%2C150" class="attachment-post-thumbnail wp-post-image" alt="Next Years Crop"
   align="right">`
 * But I don’t know where to make the changes, I’ve already broken it once and had
   to mess around to get it working again so before I randomly jab around at the
   code again I was hoping someone could explain it to me?
 * In as simple terms as possible please 🙂
 * Thanks in advance for any help anyone can give me on this 🙂

Viewing 3 replies - 1 through 3 (of 3 total)

 *  [Ashley](https://wordpress.org/support/users/nosegraze/)
 * (@nosegraze)
 * [10 years, 8 months ago](https://wordpress.org/support/topic/change-post-header-html/#post-6636975)
 * What you want is to **float** the image to the right.
 * That can be achieved with this CSS:
 *     ```
       .wp-post-image {
           float: right;
       }
       ```
   
 * If you don’t have a place to enter custom CSS, you can use a plugin like Simple
   Custom CSS.
 *  Thread Starter [JazzSP8](https://wordpress.org/support/users/jazzsp8/)
 * (@jazzsp8)
 * [10 years, 8 months ago](https://wordpress.org/support/topic/change-post-header-html/#post-6636985)
 * Hi NozeGraze
 * Thanks for the reply but I don’t think I’ve made myself clear, or I’ve not understood
   your reply :/
 * From poking around it seems as though I should be able to find a php file that
   I can edit to change the HTML to what I want, but I can’t seem to find it.
 * It’s that I need.
 * I think :/
 *  Thread Starter [JazzSP8](https://wordpress.org/support/users/jazzsp8/)
 * (@jazzsp8)
 * [10 years, 8 months ago](https://wordpress.org/support/topic/change-post-header-html/#post-6637013)
 * Oh!
 * Never mind, worked it out thanks to a little nudge from you NoseGraze!
 * I had to edit the content.php file and change it like so;
 *     ```
       <header class="entry-header">
       			<?php if ( is_single() ) : ?>
       			<h1 class="entry-title"><?php the_title(); ?></h1>
       			<?php else : ?>
       			<h1 class="entry-title">
       				<a href="<?php the_permalink(); ?>" rel="bookmark"><?php the_title(); ?>
       			<?php if ( ! post_password_required() && ! is_attachment() ) :
       				the_post_thumbnail();
       			endif; ?></a>
       			</h1>
       			<?php endif; // is_single() ?>
       			<?php if ( comments_open() ) : ?>
       				<div class="comments-link">
       					<?php comments_popup_link( '<span class="leave-reply">' . __( 'Leave a reply', 'twentytwelve' ) . '</span>', __( '1 Reply', 'twentytwelve' ), __( '% Replies', 'twentytwelve' ) ); ?>
       				</div><!-- .comments-link -->
       			<?php endif; // comments_open() ?>
       		</header><!-- .entry-header -->
       ```
   
 * and then changed the Stylesheet (style.css) to;
 *     ```
       }
       .entry-header img.wp-post-image {
       	float: right;
       	margin-bottom: 24px;
       	margin-bottom: 1.714285714rem;
       }
       ```
   
 * It was a combination of things – I wouldn’t have thought to poke around the CSS
   if it wasn’t for that bit of nudging – Thanks!

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Change Post Header HTML?’ is closed to new replies.

 * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 3 replies
 * 2 participants
 * Last reply from: [JazzSP8](https://wordpress.org/support/users/jazzsp8/)
 * Last activity: [10 years, 8 months ago](https://wordpress.org/support/topic/change-post-header-html/#post-6637013)
 * Status: resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics