Pure custom html form for popups on wordpress site
I need to display a form on my home page (Wordpress site) in a popup. This is my own form, not contact 7 or whatever. I want a popup plugin or code that can do the same on my home page. I have tried many plugins, but some have their own form design that prevents me from adding my form to it.
I need some simple good HTML.
+3
source to share
1 answer
You can use JQuery dialog to open a popup with your form.
Just insert your form into a div with id and convert it to dialog.
Html
<button type="button" id="but" >Open Popup</button>
<div id="dialogForm">
<form id="myform" method="post">
Name:
<input type="text"/><br/>
Phone:
<input type="text"/><br/>
<button type="submit"> Submit </button>
</form>
</div>
JavaScript
$('#but').click(function() {
$("#dialogForm").dialog("open");
});
$("#dialogForm").dialog({
modal: true,
autoOpen: true,
show: {effect: "blind", duration: 800}
});
JavaScript to load the dialog when the master page is loaded Note that autoOpen is set to true.
$(window).load(function() {
$("#dialogForm").dialog({
modal: true,
autoOpen: true,
show: {effect: "blind", duration: 800}
});
});
Here's a fiddle: http://jsfiddle.net/sve3Lmje/
Script to open dialog without clicking: http://jsfiddle.net/sve3Lmje/1/
+2
source to share