How to make images responsive on existing site?

Community Forums Forums Design Tips and Tricks How to make images responsive on existing site?

This topic is: not resolved

This topic contains 4 replies, has 3 voices, and was last updated by  askdesign 2 months, 3 weeks ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #13302

    maui
    Participant
    Post count: 22

    Hi,

    I have updated News theme to latest version which is responsive. My site contains more than 800 posts with hundreds of images which are now too wide for mobile view. Is there any tool to adjust images to meet width of content?

    :)

    #13334

    bandj
    Participant
    Post count: 117

    Look into the regenerate thumbnails plugin. That may solve the problem.


    #14971

    maui
    Participant
    Post count: 22

    Thanks It does not work with regenerate thumbnails. I have changed caption width to max 100%. In mobile device the images are now resized but not accurately dispayed.

    #86890

    askdesign
    Participant
    Post count: 20

    I have the same question, hoping to discover the answer somewhere…


    Anne S. Katzeff
    Web/Graphic Designer & Artist

    #86893

    askdesign
    Participant
    Post count: 20

    Here’s what I’ve discovered:
    When you add an image to a page/post, one of the options is to select its size (“Attachment Display Settings”). Once the image is inserted, check the html code and delete the “width: xx” and “height: xx”. The image will then be responsive.

    After inserting the image, sometimes you want to scale down the image. You can do this by clicking on the image, selecting the image icon, selecting “advanced settings” and the desired scale. But, this method re-inserts the width and height code that renders the image “un-responsive”.

    –One solution is to scale the image to the desired size before uploading to WordPress.
    –Another solution is to scale the image by editing it in the Media Library.
    With either solution, you still have to delete the “width” and “height” in the html code.

    cheers!


    Anne S. Katzeff
    Web/Graphic Designer & Artist

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

You must be logged in to reply to this topic.