william1872
Member
I've had a custom lead capture for designed for appending to the bottom of new and existing threads, to capture email addresses of visitors to the site.
The PSD has been sliced and coded however when the developer went to install the code into the ad_message_body template we discovered a problem on submission of the form.
It produced a security error and after putting the following post out in the community yesterday we discovered that posts are effectively forms and you can't nest a form, within a form.
The solution one of the staff gave was to use iframe or custom javascript.
Here's the thread I put out for reference, there's a screenshot of the lead capture form on the thread below.
http://xenforo.com/community/threads/appending-an-image-to-the-end-of-new-threads.66038/#post-712788
The custom code developed for the form that's in the above template.
I've attached a screenshot of the lead capture form and I'm looking for a developer who can iframe or create a javascript?
It's critical the custom form design and copy is used, if this is something you can do please drop me a private message with a quote?
Thanks
William
The PSD has been sliced and coded however when the developer went to install the code into the ad_message_body template we discovered a problem on submission of the form.
It produced a security error and after putting the following post out in the community yesterday we discovered that posts are effectively forms and you can't nest a form, within a form.
The solution one of the staff gave was to use iframe or custom javascript.
Here's the thread I put out for reference, there's a screenshot of the lead capture form on the thread below.
http://xenforo.com/community/threads/appending-an-image-to-the-end-of-new-threads.66038/#post-712788
The custom code developed for the form that's in the above template.
Code:
<xen:if is="{$post.position} % {$xenOptions.messagesPerPage} == 0 AND !{$message.conversation_id} AND {$forum.node_id} != 4 AND {$forum.node_id} != 6 AND {$forum.node_id} != 12">
<!doctype html>
<html>
<head>
<script type="text/javascript" src="http://app.getresponse.com/view_webform.js?wid=675716&mg_param1=1&u=Bt1t"></script>
<meta charset="utf-8">
<title>index</title>
<link href="css/style.css" rel="stylesheet" type="text/css">
<style type="text/css">
@charset "utf-8";
/* CSS Document */
@font-face {
font-family: 'MyriadProRegular';
src: url('styles/uix/uix/fonts/myriadpro-regular.eot');
src: url('styles/uix/uix/fonts/myriadpro-regular.eot') format('embedded-opentype'),
url('styles/uix/uix/fonts/myriadpro-regular.woff') format('woff'),
url('styles/uix/uix/fonts/myriadpro-regular.ttf') format('truetype'),
url('styles/uix/uix/fonts/myriadpro-regular.svg#MyriadProRegular') format('svg');
}
@font-face {
font-family: 'MyriadProBold';
src: url('styles/uix/uix/fonts/myriadpro-bold_1.eot');
src: url('styles/uix/uix/fonts/myriadpro-bold_1.eot') format('embedded-opentype'),
url('styles/uix/uix/fonts/myriadpro-bold_1.woff') format('woff'),
url('styles/uix/uix/fonts/myriadpro-bold_1.ttf') format('truetype'),
url('styles/uix/uix/fonts/myriadpro-bold_1.svg#MyriadProBold') format('svg');
}
body {
margin: 0;
padding: 0;
}
* h1, h2, h3, h4, h5, h6, address, blockquote, dd, dl, hr, form, input, p, ul, li {
margin: 0;
padding: 0;
}
a {
text-decoration: none;
outline:none;
}
a img {
border: 0;
}
img {
border: none;
}
#main {
width:100%;
}
#wrapper {
width:461px;
margin:auto;
margin-top:95px;
}
.header{
-moz-border-bottom-colors: none;
-moz-border-left-colors: none;
-moz-border-right-colors: none;
-moz-border-top-colors: none;
background-attachment: scroll;
background-clip: border-box;
background-color: #D7EDFC;
background-image: url("http://www.jvfocus.com/styles/uix/uix/images/top_bg.jpg");
background-origin: padding-box;
background-position: 0 0;
background-repeat: no-repeat;
background-size: auto auto;
border-bottom-color: #CEE1EE;
border-bottom-style: solid;
border-bottom-width: 1px;
border-image-outset: 0 0 0 0;
border-image-repeat: stretch stretch;
border-image-slice: 100% 100% 100% 100%;
border-image-source: none;
border-image-width: 1 1 1 1;
border-left-color-ltr-source: physical;
border-left-color-rtl-source: physical;
border-left-color-value: #CEE1EE;
border-left-style-ltr-source: physical;
border-left-style-rtl-source: physical;
border-left-style-value: solid;
border-left-width-ltr-source: physical;
border-left-width-rtl-source: physical;
border-left-width-value: 1px;
border-right-color-ltr-source: physical;
border-right-color-rtl-source: physical;
border-right-color-value: #CEE1EE;
border-right-style-ltr-source: physical;
border-right-style-rtl-source: physical;
border-right-style-value: solid;
border-right-width-ltr-source: physical;
border-right-width-rtl-source: physical;
border-right-width-value: 1px;
border-top-color: #CEE1EE;
border-top-style: solid;
border-top-width: 1px;
float: left;
height: 437px;
margin-bottom: 80px;
margin-top: 25px;
width: 459px;
}
.header h1{
width:100%;
float:left;
margin-top:21px;
text-align:center;
}
.header h2{
width:95%;
float:left;
font-family: 'MyriadProRegular';
font-size:18px;
color:#000;
text-align:center;
font-weight:normal;
margin-top:-25px;
}
.header h2 font{
font-family: 'MyriadProBold';
font-size:18px;
}
.header h2 span{
font-family: 'MyriadProBold';
font-size:18px;
color:#b70000;
}
.header h2 span img{
position:absolute;
margin:-35px 0 0 10px;
}
.header input{
width:416px;
height:53px;
float:left;
border:none;
font-family:arial;
font-size:20px;
color:#b9b9b9;
text-align:center;
margin:4px 0 0 11px;
padding:0px 10px 0px 10px;
background:url(http://www.jvfocus.com/styles/uix/uix/images/input.png) no-repeat;
}
.now{
width:100%;
float:left;
margin-top:12px;
text-align:center;
}
.submit
{
background: url(http://www.jvfocus.com/styles/uix/uix/images/yes_img.png) no-repeat !important;
color: transparent !important;
margin-left: 11px !important;
width: 435px !important;
height: 64px !important;
}
.Tinhte_XenTag_WidgetRenderer_Cloud h3 { display: block !important }
</style>
</head>
<body>
<div id="main">
<div id="wrapper">
<div class="header">
<h1><img src="http://www.jvfocus.com/styles/uix/uix/images/build_txt.png" alt=""/></h1>
<h2> You'll get powerful, business building Case Studies, <br> How-Tos... and <font> even Insider Secrets </font> <br> to help you succeed online -
<span> absolutely FREE! <img src="http://www.jvfocus.com/styles/uix/uix/images/arrow_img.png" alt=""/> </span> </h2>
<form accept-charset="utf-8" action="https://app.getresponse.com/add_contact_webform.html?u=Bt1t"
method="post">
<input class="wf-input wf-req wf-valid__email" type="text" placeholder="Email Address">
<input class="submit" type="submit" />
<input type="hidden" name="webform_id" value="675716" />
</form>
</div>
</div>
</div>
</body>
</html>
</xen:if>
I've attached a screenshot of the lead capture form and I'm looking for a developer who can iframe or create a javascript?
It's critical the custom form design and copy is used, if this is something you can do please drop me a private message with a quote?
Thanks
William