Popup with fancybox

Popup with fancybox plugin allows you to create lightweight JQuery fancy box popup window in your blog with custom content. In the admin interface we can easily configure popup size and timeout (i.e. show popup window based on timeout after page load). In this popup we can display any content such as Video, Image, Advertisement and much more.

In the admin we have standard wordpress HTML editor to create the popup message. So that we can customize the messages easily. also we have option to set expiration time for popup window. and we have option to display popup once per session, so that the popup never appear again if user navigate to another page.

Live demo

Live popup window will open 10 second after page load. Please refresh the page to view the demo again. It support all latest browser IE, Firefox, Chrome.

Advantage of this plugin

  • Lightweight JQuery.
  • Fancybox css in popup windows.
  • Show popup window based on timeout after page load.
  • HTML editor to create the popup message.
  • Option to set expiration time for message.
  • Option to set popup display once per session.

Installation Instruction

Option 1

  • Download the plugin popup-with-fancybox.zip from download location.
  • Unpack the *.zip file and extract the /popup-with-fancybox/ folder.
  • Drop the ‘popup-with-fancybox’ folder into your ‘wp-content/plugins’ folder.
  • In word press administration panels, click on plug-in from the menu.
  • You should see your plug-in listed under Inactive plug-in tab.
  • To turn the word presses plug-in on, click activate.

Option 2

  • Go to Add New menu under Plugins tab in your word-press admin.
  • Search ‘Popup with fancybox’ plugin using search option.
  • Find the plugin and click ‘Install Now’ link.
  • Finally click activate plug-in link to activate the plug-in.

Option 3

  • Download the plugin popup-with-fancybox.zip from download location.
  • Go to Add New menu under Plugins tab in your word-press admin.
  • Select upload link (top link menu).
  • Upload the available popup-with-fancybox.zip file and click install now
  • Finally click activate plug-in link to activate the plug-in.

Plugin configuration

Display popup in specific page/post

This plugin have short code option to display the popup in specific page. Just copy and paste the plugin short code into specific posts or pages to display the popup. We can use group name or message id to display the popup.

Short code

[popupwfancybox group="GROUP1"]

[popupwfancybox id="1"]

Display popup in entire website

We have two options to display the popup box in entire website.

1. Go to widget page and drag and drop the widget Popup with fancybox into your sidebar, so that popup will display in entire website.

2. Copy and paste the given PHP code into your footer.php file, so that popup will display in the entire website.

a. Download footer.php file from your theme folder.
b. Paste the below PHP code, and upload back to server.

<?php popupwfb( $Popupwfb_group = "", $Popupwfb_id = "" ); ?>

Display popup only in the home page

a. Download footer.php file from your theme folder.
b. Paste the below PHP code, and upload back to server.

<?php if (is_home()) { popupwfb( $Popupwfb_group = "", $Popupwfb_id = "" ); } ?>

Frequently asked questions

Q1. How to display popup message box once per session?

Go to Dashboard ==> Settings ==> Popup with fancybox ==> Popup Setting (Button)

In the above page we have option to configure session display. Select YES to show popup message once per session, Meaning, popup never appear again if user navigate to another page.

Q2. What is Group and Id in the plugin short code?

Go to Dashboard ==> Settings ==> Popup with fancybox

In the above page, we can view all the existing popup messages, Message ID available in the first column of the grid, and 5th column we can see the group name of the popup message.

Q3. How to modify popup window style?

CSS file name
popup-with-fancybox\inc\jquery.fancybox.css

Class name

.fancybox-content-inside {

}

We can easily update the popup window style in the above mentioned css class name.

Q4. How to setup expiration date for the popup message?

Expiration date option available from version 1.1. In the admin you have a separate text box to enter expiration date.

Download location

http://www.gopiplus.com/work/wordpress-plugin-download/

Plugin official webpage

http://www.gopiplus.com

Video tutorial

http://www.gopiplus.com/work/2013/09/29/popup-with-fancybox-wordpress-plugin-video-tutorial/

39 Responses to“Popup with fancybox”

  1. Gopi Ramasamy
    August 9, 2013 at 3:03 am #

    Plugin Short code

    [popupwfancybox group="GROUP1"]

    [popupwfancybox id="1"]

  2. Gopi Ramasamy
    October 6, 2013 at 2:04 am #

    Use below HTML code to add YouTube video into the popup content.

    <iframe class="youtube-player" type="text/html" src="http://www.youtube.com/embed/hc7RymU_NJE " frameborder="0" height="400" width="630"></iframe>

  3. Dan H
    April 17, 2014 at 12:49 am #

    I can’t seem to get any jQuery or Javascript running inside the Fancybox…for example, I need to be able to hide a DIV inside the fancybox that only shows when someone clicks on a link I have in the fancybox…I’ve tried many variations and no luck.

    Is this a limitation or should this be possible?

    Thanks!

    • Gopi Ramasamy
      April 19, 2014 at 1:51 am #

      Hi Dan,

      Please send me your webpage link, so that i can check for you.

  4. Min CHEN
    April 19, 2014 at 3:08 pm #

    Hi, I would like to make the popup occur only once per session (i.e. no more popup after refreshing the page) but the check button provided does not seem to do the job.

    As I am new to web design (school project actually) I tried to use javascript cookie check to get it done, but I don’t know how to code in order to invoke the popup in javascript, could you help me? Thank you!

    • Gopi Ramasamy
      April 19, 2014 at 4:00 pm #

      Hi, This option already available in the plugin. Please read the FAQ section in the above post.

      • Min CHEN
        April 19, 2014 at 7:56 pm #

        I know, and as I said I checked this option as “YES” but it doesn’t work (in chrome and in IE)

        • Gopi Ramasamy
          April 20, 2014 at 1:47 am #

          Is it working in Firefox and IE? Session is not a browser dependent.

          • Min CHEN
            April 20, 2014 at 7:54 am #

            I made it very clear that the Session Option has no effect at all. Whether a YES or NO the popup will come out every time I refresh the page (or come back after navigating away) Chrome. IE, Firebox don’t matter it just won’t work.

            So I try to code it myself and now I need to know how to invoke this specific popup in javascript code instead of the code segment [popupwfancybox group = "GROUP1"] in HTML

  5. Zain
    April 20, 2014 at 11:45 pm #

    Hi,

    Thank you for the plugin. It works as advertised. Although I am trying to run a shortcode in the pop up. I would use the anything pop up but i need the on page load functionality. Can you please help ?

    • Gopi Ramasamy
      April 21, 2014 at 1:16 am #

      Hi Zain, This plugin is developed to display HTML content, you cannot use other plugins short code in this. i will try to create separate plugin for this option. Thanks

  6. Flo
    April 29, 2014 at 12:12 pm #

    Hi Gopi !

    Thanks for your the use of your nice plugin ! The option for “one per session” is very useful.

    I would like to add a html link code inside the fancy box (ie in the popup message content) to close the box. I mean, i want the user able to close the box, both by clicking on the cross, and by clicking the html link inside the content box. Couds you pleaase give me a hand ? I don’t know javacript, only html …

    Thanks in advance.

  7. Dave
    April 30, 2014 at 7:59 am #

    Nice work, Gopi. I second Zain’s idea of the shortcode inside the popup. That would come in really handy for some of my applications too.

  8. sb
    May 2, 2014 at 3:12 pm #

    Yes please add ability to add a SHORT CODE in the popup – I need a OPTIN form to pop up but it uses a shortcode. thanks

  9. Israel
    May 2, 2014 at 6:23 pm #

    Hello, nice plugin, thanks, i would like to make the pop up appear on click, is this possible?

  10. Objectif-Mairage
    May 13, 2014 at 12:36 pm #

    Hello ,
    Is there a way to laod the fancybox after 5 min ? And not immédiatly when the visitor come on the page ? (the idea is to tell the visitor : “if you like this site, please like the content ” ) => if he had not yet read the site , it could not want to like the content :D

    • Gopi Ramasamy
      May 13, 2014 at 12:58 pm #

      Timeout option already available in the admin. Please check plugin admin page in your dashboard.

  11. Vera
    May 27, 2014 at 11:05 pm #

    Hi, is it possible to trigger the popup by clicking an image/link? how? Thanks!!

    • Gopi Ramasamy
      May 28, 2014 at 5:17 am #

      Lots of popup plugin available in the website. please find best suitable plugin.

  12. enffie
    June 4, 2014 at 1:28 pm #

    Hi,Dear:I want to add a popup contact form window to the button of CALL TO ACTION,how could I do?

    • Gopi Ramasamy
      June 5, 2014 at 12:07 pm #

      This plugin opens popup on page load, Please find my other popup plugin (Lots of popup plugin available in this site) for this feature.

  13. natalia
    June 9, 2014 at 4:42 pm #

    Can shortcodes work in widgets?
    I have a 2 language website and I would like to have GROUP1 on one language site and GROUP2 on the second language site?

    Thanks

    • Gopi Ramasamy
      June 10, 2014 at 1:19 pm #

      At present this plugin not support short code in widget.

  14. BAYU
    June 13, 2014 at 10:04 am #

    1. Popup shows on all pages even i’ve already set the Session option to yes
    2. Popup timeout not working

    Help, please check my website

    • Gopi Ramasamy
      June 15, 2014 at 12:44 am #

      Session options may be not working on your server.

      • Ronald
        July 6, 2014 at 10:28 pm #

        There is another way to fix this?

  15. Humphrey Davy
    June 18, 2014 at 11:00 pm #

    Hi Gopi,

    Many thanks for making this free. You also have tons of the other stuff, which I will explore obviously. I have a question. Is it possible to display pop up after every 10 mins automatically, that’s without refreshing the page?

    Once again thanks for your software. It’s lightweight and awesome.

    cheers

    • Gopi Ramasamy
      June 23, 2014 at 7:53 am #

      At present we don’t have option to display popup every 10 min.

  16. Gregg
    June 22, 2014 at 1:54 am #

    I need to make this responsive. Currently setting the width in the admin sets it for every screen size. This doesnt work of course, because on phones and tablets it might be to wide.

    Do you have any plans to fix this so it is responsive?

    • Gopi Ramasamy
      June 23, 2014 at 7:57 am #

      Already responsive option available in this plugin. you have to enter width and height in %.

      • Gregg
        June 25, 2014 at 4:17 am #

        The % doesnt really work. On a phone you will want it to be 90%, but on a big 20+ inch screen you might want it at 40-60% at most.

        I would still need a way to specify two different sets of width/height.

        There is never a reason to have a popup at 90% of the screen on a big desktop monitor, but on a phone thats standard.

  17. Rod
    June 23, 2014 at 8:30 am #

    Hi Gopi
    Thanks for this plugin.Since the plugin does not support short codes(which would make an excellent plugin by the way) .
    1)How does one add video to the popup?.
    2)Can one add self hosted video to the popup ?
    3)Do you do custom work(you seem to be an expert in popups ?
    Thanks again.

  18. Rajkumar
    June 30, 2014 at 7:33 pm #

    Hi, gopi, I like your wordpress plugin, Email newsletter and pop up plugin, Could you make another plugin to pop up Email Subscriber form for Sign Up newsletter .

  19. Tell Stevens
    July 1, 2014 at 4:05 pm #

    Thanks for this great plugin. It’s simple and works great. My only issue is that I have the setting set to only show the popup once per session but it’s displaying everytime you visit my homepage. Any ideas?
    http://tmcn.org

    Thanks

  20. Blazs
    July 13, 2014 at 9:56 pm #

    Hi, can i force the visitor to read the pop-up, or just exit with the button only? Thanks for the answer!

  21. Karen
    July 18, 2014 at 3:32 pm #

    I though that the timeout field would allow the popup to disappear after so many milliseconds but it seems that means to when it actually appears after page load. Can you set it up so that the popup goes away without a user clicking on it?

    Thanks!

    • Gopi Ramasamy
      July 19, 2014 at 4:02 pm #

      At present no option.

Leave a Reply

Your email address will not be published. Required fields are marked *

(Required)

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Current day month ye@r *