Is it possible to trigger the popup by clicking a link/button/images?

We have an event page that currently has a form at the bottom of the page .. would like instead to have an image on the page which, when clicked, would open an attractive pop up containing the form. PopUp! doesn’t seem to have a trigger for a click .. one though I had was to trigger it with the url of the thank you page, but that isn’t logical if the user close without filling out the form.

thanks,

Jim

  • jimesten
    • Site Builder, Child of Zeus

    thanks .. we were able to work around it by loading the WP thickbox library in our custom theme and then loading the thickbox popup from a link on the page. If anyone is in need of same, I’d be happy to send the sample code I used to do a proof of concept for the sales guy on my team who came in with the request.

    thanks,

    Jim .. (this can stay RESOLVED!)

  • jimesten
    • Site Builder, Child of Zeus

    Sure!!! WP has built in Thickbox libraries and they are enabled in most themes .. the gist is you set up the container by specifying it as an inline Thickbox container, then create content to go into that container.. here is a bit from one of my actual sites: (the first div does the setup, the second one, set to display: none is what will be in the popup when link clicked)


    <div style="text-align: center; padding: 20px;"><input class="thickbox" title="" type="button" alt="#TB_inline?
    height=300&width=400&inlineId=localevent" value="Click Here to Select Your City" /></div>
    <div id="localevent" style="display: none;">

    <img style="margin: 10px auto;" alt="" src="[themeURL]/images/CBALogo.png" />
    <h2 style="margin: 10px 0; text-align: center;">We hold chapter meetings in five cities.</h2>
    <h2 style="margin: 20px 0; text-align: center;">Please click on the link below to learn
    about the meeting in your area:</h2>
    <ul style="text-align: center; font-size: 1.2em;">
    <li style="margin: 5px 0;"><a href="http://panamacity.gkicadvisor.com/mobile/business-growth-events-local-workshops-details/"> Mobile, AL</a></li>
    <li style="margin: 5px 0;"><a href="http://panamacity.gkicadvisor.com/pensacola/business-growth-events-local-workshops-details/">Pensacola, FL</a></li>
    <li style="margin: 5px 0;"><a href="http://panamacity.gkicadvisor.com/destin/local-events/"> Destin, FL</a></li>
    <li style="margin: 5px 0;"><a href="http://panamacity.gkicadvisor.com/tallahassee/business-growth-events-local-workshops-details/"> Tallahassee, FL</a></li>
    <li style="margin: 5px 0;"><a href="http://panamacity.gkicadvisor.com/panama-city/business-growth-events-local-workshops-details/"> Panama City, FL</a></li>
    </ul>
    </div>


    Hope that helps .. if you have any issues getting the popup to actually display, the most likely problems are either the library isn’t being loaded in your theme (you can Google up a quick fix to that..) or you have a (usually really hard to spot…:wink: syntax error..

    peace,

    Jim

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.