Navigation
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • #1147338
    wolfpackhearing
    Participant

    http://www.wolfpackhearing.com
    * All latest versions of wordpress, Xtheme, and Cornerstone.

    On the front page at the bottom where it shows ‘Recent Posts’, you can see that the thumbnails crop the heads off of our faces. Is there a way to edit the thumbnail appearance of images? Or a way to have this not be an issue in the future? Thank you.

    #1147651
    Rue Nel
    Moderator

    Hello There,

    Thanks for writing in! The featured image in the recent post element is being displayed as a background image with full image width dimension. Since it is a background image, it is also set as cover to cover the whole feature image area and it is positioned at the middle of the feature image area as well. You can make use of this custom css code to make sure that the featured image will display the full image. Please add the following css code in the customizer, Appearance > Customize > Custom > CSS

    #cs-content .x-recent-posts .x-recent-posts-img {
        background-size: contain;
    }

    After adding the css code, you will also noticed that there are empty spaces around the featured image.

    Hope this helps.

    #1150139
    wolfpackhearing
    Participant

    Thank you kindly! Now that we’re not stretched, is there a way to set a fixed size to the thumbnail pics? And have them auto scaled a certain way (so heads aren’t chopped off, etc.)

    #1150228
    Rue Nel
    Moderator

    Hello There,

    Thanks for updating in. Regretfully the featured images were set as background image. The background image width is dependent of the width of the column. You can set the number of columns to display and that would have a difference in the image dimension of the featured image.

    Hope this make sense.

  • <script> jQuery(function($){ $("#no-reply-1147338 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>