Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #304096

    Hi,

    I’ve been using Easy Fancy Box + CF7 for ages, but unfortunately Enfold doesn’t work with EFB, so I’m looking for other solution.

    I am trying to work with built-in ligtbox, however I get this: http://gyazo.com/7d9d71d4a4bdebdc32ba578bcf1db6ec
    for both inline ind iframe

    I used standard code in both cases

    <a href="#inline-1" rel="prettyPhoto">Text in popup</a>
    	<div id="inline-1" class="hide">
    		<p>This is inline content opened in prettyPhoto.</p>
    		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p></div>
    	</div>

    http://sud.nasledstvo.biz.ua/
    Any Ideas?

    Thanks

    • This topic was modified 10 years, 4 months ago by axelfx07.
    #304173

    Hey axelfx07!

    Thank you for using Enfold.

    The Enfold uses MagnificPopup as default lightbox plugin. You can add this on functions.php:

    function popup_inline() { ?>
    <script type="text/javascript">
    jQuery(window).load(function(){
    	jQuery('.open-popup-link').magnificPopup({
    	  type:'inline',
    	  midClick: true // Allow opening popup on middle mouse click. Always set it to true if you don't provide alternative source in href.
    	});
    });
    </script>
    <?php }
    
    add_action('wp_head', 'popup_inline');

    Then use this on a text block:

    <div id="test-popup" class="white-popup mfp-hide">
    <p>PLACE CONTENT HERE</p>
    </div>
    
    <a class="open-popup-link" href="#test-popup">Show inline popup</a>
    

    Add this on Quick CSS or custom.css:

    .white-popup {
      position: relative;
      background: #FFF;
      padding: 20px;
      width: auto;
      max-width: 500px;
      margin: 20px auto;
    }

    Remove browser cache then reload the page a few times.

    Cheers!
    Ismael

    #312728

    Perfect thanks!
    Is there any contraindication to use add_action(‘wp_footer’, ‘popup_inline’); instead wp_header?

    #312812

    Hey!

    No, you can use wp_footer in the code Ismael posted and script will be added to footer section

    Regards,
    Yigit

    #312862

    Yes thanks,
    I already tested it, and I saw it works, but I feel more safety with your confirmation :)

    Anyway I insert that code inside a shortcode, and also the add_action to the wp_footer is inside the add_shortcode. It works only with wp_footer probably because the wp_header is already fired.

    Probably better to make a class of it, to be sure also to not output the script twice.

    #312865

    Hi!

    Great! Glad it is working fine for you too :)
    I will keep the thread open for OP. If you have any other questions or issues, feel free to start a new topic

    Regards,
    Yigit

    #315743

    I’m getting the error “image can not be loaded” when using Enfold with rel=”prettyPhoto[iframes]”

    Now realized it’s been changed.
    So what’s the rel for the new MagnificPopup lightbox?

    I need to open a youtube video in a lightbox.
    Thanks

    #315779
    #317459

    It’s working.
    Not ideal. but working .

    Thanks

Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘Contact form in pop-up (prettyPhoto issue)’ is closed to new replies.