0

As mentioned above, my image appears perfectly fine in the front page which displays my latest blog posts. (please see below) However, when I click the image and go inside the post, the image of the post gets distorted and is not reflected fully (please click this link to have a look).

What can I do? Thanks.

enter image description here

4
  • Welcome to WP.SE! Can you add a more detailed description of what goes wrong in here in the post? Otherwise no one will be able to make sense of this question once you have fixed the problem, and the answers you get may not be of value to anyone else. What is the original size of the image, and what size are you getting? How is it distorted? Do you know what code you are using to display the thumbnail in the post?
    – Pekka
    Jul 14, 2017 at 16:40
  • 1
    the picture itself is grainy and distorted. its because it was up-sized from a smaller image.
    – rudtek
    Jul 14, 2017 at 20:27
  • Thanks for your comment. So now I create two different sizes for the image, one smaller one for display in the front page, and one bigger one to put inside the blog post. But here another problem comes- where should I put the smaller image in the front page?? While I know I can put the bigger one in the featured image box i, I have no idea where to change the smaller pic in the front page.
    – Katherine
    Jul 16, 2017 at 6:16
  • If I just add the bigger image to the featured image box, the image works fine for the blog post, but not so good with that in the front page, which turns out to be like the blue image (left of the red circle) of the screenshot I posted previously.
    – Katherine
    Jul 16, 2017 at 6:24

1 Answer 1

0

That's because you're using an small image to display in that container, the containers has 1100x300 pixels and you're using a imagem with 560x315 pixels, so when you resize it lost quality. When working with imagem I recommend you to get a image with at least the same sizes of the maximum sizes that you site uses.

3
  • Thanks for your comment. So now I create two different sizes for the image, one smaller one for display in the front page, and one bigger one to put inside the blog post. But here another problem comes- where should I put the smaller image in the front page?? While I know I can put the bigger one in the featured image box i, I have no idea where to change the smaller pic in the front page.
    – Katherine
    Jul 16, 2017 at 6:16
  • If I just add the bigger image to the featured image box, the image works fine for the blog post, but not so good with that in the front page, which turns out to be like the blue image (left of the red circle) of the screenshot I posted previously.
    – Katherine
    Jul 16, 2017 at 6:24
  • Hi, so it depends on the theme you're using. when you get the image with get_the_post_thumbnail or get_the_post_thumbnail_url, the second parameter is the size of the image. You have to go to the files of your theme where the images are being displayed, and change the size parameter to the ones you created it. Jul 16, 2017 at 19:27

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.