• Hello

    I would be most grateful for advice on any plugins or coding that would assist me in avoiding images in my WordPress media library from being resized when I attempt to link to them using html code. By way of background, I have multiple image maps with multiple clickable regions and I want to use each image map on a separate page of my site. Further to an image map being automatically resized, the co-ordinates in the html code no longer apply.

    It was kindly suggested to me that I could try using a plugin that allows me to recreate clickable links. However, using the non-Pro version has led to some difficulties on top of the considerable amount of time involved with the intricacies of creating many smooth and presentable hot spot areas. Therefore, I am now back to the drawing board.

    Thanks in advance

Viewing 6 replies - 1 through 6 (of 6 total)
  • I think the advice I gave in https://www.ads-software.com/support/topic/recreating-clickable-image-map/ could be reduced to:
    * using classic editor or classic block or custom HTML block, put your image and coordinate code
    * edit the HTML for the img tag to have style="width: __px; height: __px;", filling in the correct numbers for the size of the image
    * remove the wp-image-* class from the img tag

    Depending on the theme’s content width and your image, it might work on a large window, but on a small window, the image would shrink. To prevent that, add max-width: none; to the style on the img tag.

    Thread Starter margmacd

    (@margmacd)

    Thank you, Joy. I am currently taking a different approach to using the code, based on some trouble-shooting. However, I will bear in mind your suggestions, should I need to rely on the media library in the end. Can I please confirm where I am to obtain the size numbers you are referring to?

    You would use the width and height numbers you used when determining the coordinates.

    Thread Starter margmacd

    (@margmacd)

    Hi Joy

    I am not the person who defined the co-ordinates. The image was originally created by a learning technologist and I am no longer in touch with them. However, I have had a quick search online regarding how to obtain image size in pixels and noted the content at https://www.sleewee.com/get-an-image-size/. From your reply, I am assuming that in the code you provided, you were referring to the original image size , which is what I really wanted to check with you, thanks.

    Yes, you need to use the original image size, so that it matches the coordinates that you have.

    Thread Starter margmacd

    (@margmacd)

    Thanks for your suggestion regarding editing code, Joy. While this makes no difference and this may be due to the landing page plugin that I am using overriding the suggested code edits, I am currently exploring the possibility of linking to an html page with the image included.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Protecting image dimensions’ is closed to new replies.