[Support request] Image pixelated after changing width and heigh

Please login to receive premium support.

Support for the free plugin can be found here.

Home Forums Pro Support Image pixelated after changing width and heigh

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #15991
    Gabriel
    Participant

    Hello,
    Using cards base – If I change width and heigh the images look pixelated, is there a way to avoid this?

    #16020
    Tom
    Keymaster

    Any chance you can link me to the page so I can take a look?

    #16092
    Gabriel
    Participant

    Hello, you can see it in https://staging.nanova.org/noticias/2020/05/test/
    Ive changed the size of the images to 250×100, what I am trying to do is to make the height of the image smaller, not sure if i am doing this correctly, but instead of doing that, it lowers the quality of the image
    I have to mention that in my wordpress>settings>media i have everything set to 0

    #16102
    Tom
    Keymaster

    Hi there,

    The pixelation is happening to images that aren’t large enough to fill the space of the card.

    If you add this CSS, WPSP will stop forcing it to be full width, which will get rid of the pixelation, but it will also show the true width of the images:

    .wpsp-card .wp-show-posts-image img, 
    .wpsp-card.wp-show-posts-columns .wp-show-posts-single .wp-show-posts-image img {
        object-fit: unset;
        height: auto;
    }
    #16104
    Gabriel
    Participant

    Thank you very much, using your code but setting it to

    #wpsp-10911 .wp-show-posts-inner img {
    object-fit: cover;
    height: 50%;
    }

    #wpsp-10911 .wp-show-posts-inner :last-child {
    margin-bottom: 0;
    margin-top: -40px;
    font-size:20px;
    }

    was exacly the effect i wanted — the first group of images
    Is that the right way to point those especific posts and not all the other?

    #16120
    Tom
    Keymaster

    Yep – that’s perfect 🙂

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.