-
AuthorPosts
-
August 1, 2020 at 8:56 am #1234473
Hi,
Is it possible to open an image (link) in a lightbox from an icon?
I want to use the “Eye” icon (fa fa-eye) to open a preview image on my site,
Can anbody help?Kind regards,
Mark
August 5, 2020 at 8:57 pm #1235507Hey Mark,
Please edit your Icon element and link it to your image in Advanced > Link Settings and it would open in lightbox :)
Best regards,
YigitAugust 6, 2020 at 9:55 am #1235640No that doesn’t work unfortunately!
There is no setting for lightbox and manually setting the link to the image doesn’t work either.
I think I need some kind of code!
Mark
August 6, 2020 at 12:13 pm #1235668Hi Mark,
Could you please post temporary admin logins and a link to your page so we can look into it?
Best regards,
YigitAugust 6, 2020 at 12:31 pm #1235675can you show me a link to that page with the icon?
how did you insert the icon ( guess it is font-awesome) – as shortcode ?
or this way ?
<i class="fa fa-eye" aria-hidden="true"></i>
you can surround this with an
<a href …></a>
see here your eye: https://webers-testseite.de/abc/by the way – entypo-fontello got the eye too in the list – that is more comfortable to style.
August 6, 2020 at 2:06 pm #1235725Yes, that you gave “https://webers-testseite.de/abc/”, that’s exactly what I want to do! But how do I do it in Enfold?
Doing an inspection of the link element it has a class assigned to it: class=”lightbox-added”, is there an equivalent class in Enfold?
Mark
August 6, 2020 at 2:21 pm #1235730so again my question : how did you insert that icon
August 6, 2020 at 3:48 pm #1235782I haven’t yet, but I have tried to code it with <i></i>!
Mark
August 6, 2020 at 5:08 pm #1235800<a href="link to your image" ><i class="fa fa-eye" aria-hidden="true"></i></a>
I removed it from my page now – because i do not need font-awesome.
it remains visible in the frontend, but in the backend the code is unfortunately no longer visible after saving.
Maybe it is also due to my implementation via:( just embedded via functions.php the fast way by:
function font_awesome_5(){ ?> <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous"> <?php } add_action('wp_head', 'font_awesome_5');
-
AuthorPosts
- You must be logged in to reply to this topic.