How To Style Genesis Featured Image in Homepage

Want to change your default featured image style in Genesis Framework homepage like I have done? Then you are at the right place as in this short genesis tutorial I will share how I have changed the home page excerpt featured image in my Genesis News Pro theme.

By default the homepage featured image of a genesis child theme will be styled good only. But still if you want to change the style or fit the image 100% in your homepage featured image area, then this genesis tutorial will help you achieve the same.

READ  How To Buy Genesis Framework & Download Theme Files

Steps to Style Genesis Featured Image in Homepage

To do this change, you have to change the genesis CSS stylesheet as I am not going to use any free genesis plugin to achieve the same.

To find out which CSS elements are actually controlling the featured image area in home page, right click on the featured image of home page and the click on inspect element.

READ  How To Remove Genesis Featured Image From Post Page

You will easily find that the a.alighleft img tag is having the CSS code which actually changed the design or style of my site’s featured image area. Here is the complete CSS code that you can paste in your theme to get the similar featured image area in homepage.

a.alignleft img, img.alignleft, .wp-caption.alignleft {
float: left;
display: block;
width: 300px;
height: 200px;
padding: 0.667em!important;
background-color: #EEE;
border: 1px solid #CCC;
margin: 0 10px 24px 0;
margin: 0 1rem 2.4rem 0;

Now change the featured image width & height, padding, color scheme, margin etc as per your need.

READ  How To Remove Default Genesis Logo & Add New Custom Logo

If you are expert in CSS coding then you can easily achieve any kind of design and style you want for your genesis WordPress theme. Share your thoughts on this short genesis guide if you find it useful.

Rate this post

Want to rank first in Google? Check backlinks for free online

You May Also Like

About the Author: Santanu

Santanu is not a full-time blogger yet, but a blogger by heart. :) Loves to explore blogging tricks, affiliate marketing techniques, online income opportunities & the world of WordPress. I hope my honest attempt of sharing my blogging learning and income secrets will be helping newcomer bloggers to make their blog noticeable and money making.

Leave a Reply

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

CommentLuv badge