I have seen sites serving small images but right clicking the image and opening it in a new tab, gives the original full size image. I cannot figure out how that is done. I have tried to call the image by wp_get_attachment_image($imgid, ‘my-small-custom-size’); but that just render the small image without the option to open the full size in a new tab.
How are you adding the images? If you’re using the editor, you can insert the image and choose the size it displays at. Then you can click the link icon to link to the media file: https://www.screencast.com/t/X3RTZ5kmi
You can do it that way. You’d just call one of the smaller sizes (thumbnail, medium etc..), then wrap the image in a link which calls the URL for the full URL.
If you don’t want it linked and just want the user to right-click and open the full image, then you’ll include the full image on the page, and resize it down with CSS.
If you don’t want it linked and just want the user to right-click and open the full image, then you’ll include the full image on the page, and resize it down with CSS.
That’s exactly what I want to achieve, but I do not want to resize it using CSS due to loading time. There must be another way. I have seen sites using some srcset attributes. Is it WordPress-core or custom plugin?
WordPress core uses srcset, but I’m not sure that’s how it works. When you right-click + open the image in a new tab, it opens the image you clicked on – I believe that’s how the browser itself is set up.
If that image is small, it will open up the small image.
Of course, I could be wrong, but I’m not aware of a way to tell the browser to open a different image.