WordPress.org

Support

Support » Plugins and Hacks » Easy FancyBox » [Plugin: Easy FancyBox] How to create a pop-up link like the one on the demo page

[Plugin: Easy FancyBox] How to create a pop-up link like the one on the demo page

Viewing 7 replies - 1 through 7 (of 7 total)
  • Plugin Author RavanH

    @ravanh

    On http://wordpress.org/extend/plugins/easy-fancybox/faq/ you can find the usual instructions under “Can I display INLINE content in a FancyBox overlay ?” and (just below that) “Can I make an image or hidden content to pop up in FancyBox on page load?” about showing inline content in FancyBox and making it pop up on page load.

    What you are seeing on the demo page is a combination of the two with this exception: the wrapping <div style="display:none" class="fancybox-hidden" is not used so that the content is also visible on the page itself.

    Hope that clears it up 🙂

    It works on Firefox, but not on Chrome…
    Thinking about it, an iFrame would be better. But I don’t understand the instructions: how to add a class to a link? Can I still decide the portion of the frame?

    Plugin Author RavanH

    @ravanh

    It works on Firefox, but not on Chrome…

    The auto popup on http://demo.4visions.nl/easy-fancybox-sandbox/ should work in Chrome just fine…

    Thinking about it, an iFrame would be better. But I don’t understand the instructions: how to add a class to a link?

    Adding a class attribute to a normal text link in WordPress is not possible when editing your post in the View tab. You’ll have to switch to the HTML tab. Sorry about that, it’s just the way it is in WordPress currently. I hope that will change in a future version.

    When you have a thumbnail image that links to its larger version (for example, it can link to anything really) then you can select the thumbnail in the View tab and click the Edit icon. Choose the Advanced tab in the dialog window and scroll down to the link attributes section. There you can ad a class name to the link.

    Can I still decide the portion of the frame?

    Not sure what you mean. An iframe showing only part of the linked page content? That’s not possible with modern day HTML.

    You could link with a hash tag to an anchor tag (with name attribute) on the linked page and then limit the size of FancyBox so that the rest of the page outside the frame…

    Now I have this:
    <a class="fancybox-iframe" href="http://grazieadiosonoateo.org/title/"><img class="size-full wp-image-1712 alignnone" title="tab Newsletter" src="http://grazieadiosonoateo.org/wp-content/uploads/2012/06/tab-Newsletter.jpg" alt="" width="150" height="80" /></a>
    and just a white windows appears (in Firefox. In Chrome nothing happens at all…).

    Plugin Author RavanH

    @ravanh

    OK, so if I understand this correctly, you have this image on http://grazieadiosonoateo.org/title/ that is linked to and should open http://grazieadiosonoateo.org/title/ inside fancybox… As far as I can see, FancyBox tries to do this but it is confusing the browser. It’s a browser issue.

    And why would you want to show the same page embedded in an iframe inside itself anyway? I see the logic in a browser skipping that content.

    Link to any other page (like http://grazieadiosonoateo.org/contatti/ or even outside your wordpress site) and it will work just fine. But if you want to include a form that is inside the same page, you are better off displaying it as Inline content in FancyBox.

    Plugin Author RavanH

    @ravanh

    For (test) example:
    <a class="fancybox" href="#comments"><img class="size-full wp-image-1712 alignnone" title="tab Newsletter" src="http://grazieadiosonoateo.org/wp-content/uploads/2012/06/tab-Newsletter.jpg" alt="" width="150" height="80" /></a>

    I was using that post as a test, the iframe will be on the homepage.
    But you were right: as soon as I put it there, it worked (also in Chrome).

    Thank you very much!

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘[Plugin: Easy FancyBox] How to create a pop-up link like the one on the demo page’ is closed to new replies.
Skip to toolbar