How can I link images in a gallery to another page using HTML?
-
Hello! I am currently editing my Portfolio and I have been struggling with editing the gallery links in HTML. What am I trying to do is create an embedded link in each image of the gallery, so when people click on the photo it opens another page with a full article. It works perfectly fine in the preview version – I click the image and it opens the page I want. However, in the updated version it does not work. It just magnifies the version. Why?
The way I did it was create the gallery block, add the photos, select the number of columns in the block and set link to attachments. Then I would edit the block into html mode and replace the href=url with the url I want my image to open.
Any help would be appreciated, thank you. This issue has been delaying my work and I have a deadline. I’m newly familiar with HTML and google has not been of any help so far.
The blog I need help with is: (visible only to logged in users)
-
Hello @ioanairimescu
Sorry that you’re going through this. I tried to replicate the issue that you’re facing and I found that after creating the gallery block, adding the photos, selecting the number of columns in the block when I set the link to attachments and then edit the block as HTML to wrap the image with the anchor() tag and click update; clicking on image loads the images in a full-screen carousel.
But when I create the gallery block, add the photos, select the number of columns in the block and let the link to none and then edit as HTML and wrap the image with the anchor tag and click update; clicking on image takes me to the link specified in the anchor tag.Hope this helps!
-
Hello @raunaqchawhan
Thank you for helping me with my gallery issue.
I tried to do it by wrapping the image with the anchor tag, but it does not seem to work either.I am not sure if I am doing it right, and the data link from the gallery html code is confusing as well, since I am not sure where to put the if right after the end of img src = url or after the data link=url
This is the html that shows when I try to edit the gallery. I followed your instructions and then the only thing I did in html was add the at the end. I tried adding the after the img = src.png but the updated version would show links instead of photos.
This is the html code updated. I am not sure if it right since it is not working. I am a newbie at this. Could you please tell me what I am doing wrong?
<ul class=”wp-block-gallery alignwide columns-3 is-cropped”><li class=”blocks-gallery-item”><figure>
</figure><li class=”blocks-gallery-item”><figure>
</figure>
Thank you!
-
-
-
Hey ioanairimescu!
Could you please try adding the URL you want your image to open to by adding a custom URL from its settings?
Would you please take a look at this guide?
https://en.support.wordpress.com/links/#adding-links-to-imagesHope this helps. :)
-
Hello @ioanairimescu
We are facing this issue because links can only be added to individual images. Images in galleries cannot be linked.
Links can only be added to individual images. Images in galleries cannot be linked
Quoted from: https://en.support.wordpress.com/links/#adding-links-to-images
Therefore, you can only add links to individual images.
I tried something that looks almost similar to gallery block in layout and we can also add an anchor tag to it so that it opens the page as we click the image. What you can do is add columns block by following this guide https://en.support.wordpress.com/wordpress-editor/blocks/columns-block/ and once the columns are added, add images to the individual column. Link the images to the custom link you want them to open when clicked. Follow this guide to link the image to a custom URLhttps://en.support.wordpress.com/links/#adding-links-to-images
Hope this helps!
-
Hi there,
Images in a media gallery cannot be linked to external pages. This has never been possible in the gallery feature.
The only workaround is to add your links to the image captions instead. I recommend using HTML links to do this, rather than just pasting the naked link, as it just looks better:
https://en.support.wordpress.com/beginning-html/2/#adding-a-link
- The topic ‘How can I link images in a gallery to another page using HTML?’ is closed to new replies.