Hi,
I am using wordpress to have few lines of code to show up in dialog box but till now no success. I tried .show() of jQuery and its working but doesn’t work if i change it to .dialog() or popup(), anyone got any idea how its not working and what should i do to make it work.? here is Fiddle
Hi,
Are you trying to display a contact form in a Lightbox?
yes, i have some other things too in div, i just want a lightbox or dialog to work.
I had to do something similar a while back.
I wrote it up in this blog post.
Maybe that’ll help you.
Does formlightbox have a do_shortcode?, as you see in my fiddle that i have using it my template in php echo statement
Sure:
[formlightbox title="Send me a message" text="Contact me"]
[contact-form-7 id="401" title="Contact form 1"]
[/formlightbox]
here is my code
echo do_shortcode('[formlightbox title="Send me a message" text="Contact me"]')
echo do_shortcode('[contact-form-7 id="36" title="Contact Attorney"]')
echo do_shortcode('[formlightbox]')
The light box work but it doesn’t display contact form, instead its showing on the page, whereas i want it to open when i click the button, am i doing something wrong?
Try putting everything in one statement:
<?php echo do_shortcode('[formlightbox title="Send me a message" text="Contact me"][contact-form-7 id="36" title="Contact Attorney"][/formlightbox]'); ?>
It worked! thanks a ton! but like i said i wanna have some html side by side the form, now how do it do it?
Is there any documentation for the lightbox? now i am trying to have a button that is clicked upon to have the lightbox opened but the button between shortcodes display in popup, where as i need the one outside to work
<button id="contact">Contact Us</button>
<?php echo
do_shortcode('[formlightbox"]
<input type="button" value="Contact Us">
[contact-form-7 id="36" title="Contact Attorney"]
[/formlightbox]');
?>
sorry to ask again, i am not good in php
Contact Form 7 wraps its content in a div with a class of “wpcf7”.
I would first of all try to append something to that.
e.g.
$(".wpcf7").append("<p>Hello</p>");
When you get that working, put your content in a template div like so:
<div id="template">
Lots of content to go next to the form
...
</div>
$template = $("#template");
$(".wpcf7").append($template);
HTH
Only problem is i don’t know where to put these and make it run
Oh dear!
Could you then post a link to your page?
here, nothing fancy. just using get_template_part above that code to make the page come together,
here are 2 issues,
- I need to make the button open the lightbox
- I will be doing a div where one div will float left containing the contact form and second div run side by side to run some text, so its like parallel.
Sorry, don’t you have a link to the page you are developing using WordPress?
The reason for needing this, is that JSFiddle will not evaluate the shortcode, whereas Wordpress will.
It will then add a bunch of divs etc to the source code which we can target with jQuery.
I have it on localhost only
Ok, well try adding it to your document just before the closing body tags.
To be on the safe side wrap it in a call to document.ready(), although this probably isn’t necessary.
<script>
$(".wpcf7").append("<p>Hello</p>");
</script>
</body>
<html>
didn’t work, here is my code
jQuery('document').ready(function(){
jQuery(".wpcf7").append("<p>Hello</p>");
});
your right, i was able to do it in do_shortcode but too many divs. Is it possible to open the lightbox with click on a button, instead of hyperlink ?
Not sure.
On the form-lightbox project page, they have an example (no. 7) using an image to open the lightbox on click.
I would think you could probably adapt that to use a button instead.
i tried that but the button displays inside the form. any idea how to fix it? I assume i am echoing the shortcode, that is why it is inside the dialog.