Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
  • #22891


    I’m trying to create a blog post using Single Author, small preview. I’ve added a featured image, but the image itself shows up in a grey box in the upper right. It looks terrible. Any way to fix this?



    yes, the gray box is 180×180 pixels. If your featured image is smaller, it won’t fill out the whole area. I changed the size my featured images to 180×180 to fill it up.

    However, I think they are too big. Where can I change that image size? css?


    That’s a real problem. Is there any way to fix this so smaller images don’t look so terrible?


    How can we remove the featured images from the CSS? I’d rather not have them at all until the display and sizing issues are fixed.


    You’ve two options:

    1) Make the thumbnail size smaller – insert following code into the quick css field:

    .small-preview {
    width: 81px;
    height: 81px;

    and instead of 81px insert a value which fits your thumbnail size.

    2) You can try following code – it should adjust the preview image size automatically:

    .small-preview {
    width: 100%;
    height: 100%;

    If you want to remove the thumbnail use:

    .small-preview {
    display: none;


    works fine in the blog roll (main blog listing page). Actually #’s work better sine the % still keeps the larger image’s padding.

    However, in the individual post page, the “featured image” still shows up as large image (in my case 180×180) to the side of the content. Is there a way to make that smaller as well?




    There might be a work around for you. if you go to

    enfold > General Settings > Body Style

    and set it to “Grid Layout”

    It seems in this setting, the “featured image” is not shown in the blog posts.

    However, I still would like a smaller (81px) “featured image” in my blog posts.


    @techshad – thanks, I discovered the same thing as well. I agree with you, I wish there was a smaller (81px) “featured image” in the blog posts as well (and that it doesn’t have a grey background with an oddly aligned image for smaller images – looks broken).



    You can install the http://wordpress.org/extend/plugins/simple-image-sizes/ plugin, which will allow you to modify the default expected image sizes for various locations throughout the theme, as well as whether to crop or not .. located in Settings > Media. Just remember that changing the settings does not affect the images already there (you will need to regenerate images, located on same page lower).. but it will affect all new uploads. If you run into problems , it may be easier to re-upload the image since if your wordpress doesn’t have enough memory, regenerate will not work.




    Hi Guys,

    how can you simply change the color of the background of the image ?

    let us say from Grey to White ?





    Since there is no example, I will assume you mean the background of a jpg, png image, and not background color of the website. You would need to use an image editor , such as Photoshop to edit an actual image. As to what commands to use in Photoshop to do that, you would need to consult a tutorial online, there are thousands of them written by Photoshop gurus. Have I understood your request correctly?




    Hi Nick,

    thanks for your reply.

    I need to clarify my question a bit more.

    First things first :

    the circle into which a gravatar will show has a grey background. That is the grey I’m talking about.

    When you use a gravatar with a transparent background, the grey background of the circle shows up.

    I would like to be able to modify that grey background to white to make the gravatar stand out.

    Another option is to modify the original image used for the avatar but then it might not look good on other sites where the avatar is used.

    I hope that is clearer.

    Thanks for your help.




    Here is the css. Please add it to /css/custom.css or to Quick CSS located in Enfold > Layout .. on bottom of the page. … there is an outline which is not seen, i left it as grey, though you can change it whichever way you want in this css

    #top .rounded-container {
    background: white;
    border-color: grey;





    Thanks a lot.


Viewing 14 posts - 1 through 14 (of 14 total)

The topic ‘Featured Image in Single Author Small – Grey Background?!?’ is closed to new replies.