Tagged: , ,

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #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

    #1235507

    Hey Mark,

    Please edit your Icon element and link it to your image in Advanced > Link Settings and it would open in lightbox :)

    Best regards,
    Yigit

    #1235640

    No 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

    #1235668

    Hi Mark,

    Could you please post temporary admin logins and a link to your page so we can look into it?

    Best regards,
    Yigit

    #1235675

    can 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.

    https://www.w3schools.com/howto/howto_css_icon_buttons.asp

    #1235725

    Yes, that you gave “https://webers-testseite.de/abc/&#8221;, 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

    #1235730

    so again my question : how did you insert that icon

    #1235782

    I haven’t yet, but I have tried to code it with <i></i>!

    Mark

    #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');
Viewing 9 posts - 1 through 9 (of 9 total)
  • You must be logged in to reply to this topic.