Links & autoresponders

[Davora]

Hi All
I hope everyone is doing well.

Can someone advise the following as it is several years since I worked on my site, (currently using web designer premium 15).
After someone completes a contact Us page & presses send, I want a 'Thanks for your enquiry' page to display on screen, I have created the Thanks for your enquiry page, I'm not sure how to link this up.

I have also created some property pages (with a contact box via a placeholder & entered code in the body of the placeholder), where customers can complete an enquiry box, as so much time has lapsed, I have forgotten how I created them & how I receive the enquiry, from memory I may have created these contact enquiry pages using some coding via mailerlite.

I have attached a screen shot of how this looks on my local machine when I view the webpage.

Any guidance on how the best way is to set the above up would be much appreciated.

Many Thanks In advance.

Dave

[RKissane]

Dave,

Is the screen shot of your property pages or your contact Us page?

For your send button on the contact us page, is it part of an Iframe or is it Xara object?

Ray

[Acorn]

Hi All
I hope everyone is doing well.

Can someone advise the following as it is several years since I worked on my site, (currently using web designer premium 15).
After someone completes a contact Us page & presses send, I want a 'Thanks for your enquiry' page to display on screen, I have created the Thanks for your enquiry page, I'm not sure how to link this up.

I have also created some property pages (with a contact box via a placeholder & entered code in the body of the placeholder), where customers can complete an enquiry box, as so much time has lapsed, I have forgotten how I created them & how I receive the enquiry, from memory I may have created these contact enquiry pages using some coding via mailerlite.

I have attached a screen shot of how this looks on my local machine when I view the webpage.

Any guidance on how the best way is to set the above up would be much appreciated.

Many Thanks In advance.

Dave

Dave, usually a form has a trigger or set-up where you insert a Response Page URL (web address).
It will be so much harder from an existing form.

The approach required would be to determine the CSS of the Send Message button and attach a trigger to it using JavaScript or jQuery.
You probably have to add an ID to the IFRAME.

jQuery Code could be like:
$('#iframe_id > #submit').click(function(e) {
//e.preventDefault();
//$('#submit').submit();
document.location.href = 'response.htm';
});
The preventDefault and forced submit are REMmed out on the expectation that the Submit action will still be triggered.
If you have encountered XaraTeplates.com, michal has such coing in his templates and some are free so it might be worth a look just to see how he did it.

Acorn

[Davora]

Hi Ray

Thanks, the screen shot is from a property page with a send message button.

I have attached the code below from the property page 'Send Message'

This code is in the HTML PLACEHOLDER CODE BODY - See Below I will check the contact page I think that is just a page I created in Xara, Thanks alot Dave

<style>
CSS code deleted as it has no relevance to the Form function
</style>
<div id="mlb2-4206197" class="ml-subscribe-form ml-subscribe-form-4206197">
<div class="ml-vertical-align-center">
<div class="subscribe-form ml-block-success" style="display:none">
<div class="form-section">
<p>Thank you for Contacting Us We Will Be In Touch Within 48 Hours. Davora</p>
</div>
</div>
<form class="ml-block-form" action="https://landing.mailerlite.com/webforms/submit/z8e1l1" data-id="299797" data-code="z8e1l1" method="POST" target="_blank">
<div class="subscribe-form">
<div class="form-section">
<div class="form-group ml-field-name ml-validate-required">
<input type="text" name="fields[name]" class="form-control" placeholder="Full Name*" value="" autocomplete="name" x-autocompletetype="name" spellcheck="false" autocapitalize="off" autocorrect="off">
</div>
<div class="form-group ml-field-email ml-validate-required ml-validate-email">
<input type="email" name="fields[email]" class="form-control" placeholder="Email*" value="" autocomplete="email" x-autocompletetype="email" spellcheck="false" autocapitalize="off" autocorrect="off">
</div>
<div class="form-group ml-field-country ml-validate-required">
<input type="text" name="fields[country]" class="form-control" placeholder="Subject*" value="" spellcheck="false" autocapitalize="off" autocorrect="off">
</div>
<div class="form-group ml-field-company ml-validate-required">
<input type="text" name="fields[company]" class="form-control" placeholder="Message*" value="" spellcheck="false" autocapitalize="off" autocorrect="off">
</div>
<div class="form-group ml-field-phone">
<input type="text" name="fields[phone]" class="form-control" placeholder="Phone" value="" spellcheck="false" autocapitalize="off" autocorrect="off">
</div>
</div>
<div class="form-section ml-validate-required">
<label class="confirmation_checkbox">
<input type="checkbox"> Please Contact Me
</label>
</div>
<input type="hidden" name="ml-submit" value="1" />
<button type="submit" class="primary gradient-on">
Send Message
</button>
<button disabled="disabled" style="display: none;" type="button" class="loading gradient-on">
<img src="https://static.mailerlite.com/images/rolling@2x.gif" width="20" height="20" style="width: 20px; height: 20px;">
</button>
</div>
</form>
<script>
function ml_webform_success_4206197() {
var $ = ml_jQuery || jQuery;

$('.ml-subscribe-form-4206197 .ml-block-success').show();
$('.ml-subscribe-form-4206197 .ml-block-form').hide();
};
</script>
</div>
</div>
<script type="text/javascript" src="https://static.mailerlite.com/js/w/webforms.min.js?v4a60e9ef938a7fa0240ac9ba567062cb" ></script>

[Davora]

Hi Ray
Re' Contact page

I guess it is iFrame it is a normal Xara page with an HTML placholder created from Xara & then code added. Thank you very much Dave
This is the code from the HTML PLACEHOLDER HTM CODE (Body)
<style>
CSS code deleted as it has no relevance to the Form function
</style>
<div id="mlb2-4206197" class="ml-subscribe-form ml-subscribe-form-4206197">
<div class="ml-vertical-align-center">
<div class="subscribe-form ml-block-success" style="display:none">
<div class="form-section mb0">
<h4></h4>
<p>Thank you for Contacting Us We Will Be In Touch Within 48 Hours. Davora</p>
</div>
</div>
<form class="ml-block-form" action="//app.mailerlite.com/webforms/submit/z8e1l1" data-id="299797" data-code="z8e1l1" method="POST" target="_blank">
<div class="subscribe-form">
<div class="form-section">
<div class="form-group ml-field-name ml-validate-required">
<label for="fields[name]">Full Name</label>
<input type="text" name="fields[name]" class="form-control" value="">
</div>
<div class="form-group ml-field-email ml-validate-required ml-validate-email">
<label for="fields[email]">Email</label>
<input type="text" name="fields[email]" class="form-control" value="">
</div>
<div class="form-group ml-field-country ml-validate-required">
<label for="fields[country]">Subject</label>
<input type="text" name="fields[country]" class="form-control" value="">
</div>
<div class="form-group ml-field-company ml-validate-required">
<label for="fields[company]">Message</label>
<input type="text" name="fields[company]" class="form-control" value="">
</div>
<div class="form-group ml-field-phone ml-validate-required">
<label for="fields[phone]">Phone</label>
<input type="text" name="fields[phone]" class="form-control" value="">
</div>
</div>
<div class="form-section ml-validate-required">
<label class="confirmation_checkbox">
<input type="checkbox"> Please Contact Me
</label>
</div>
<input type="hidden" name="ml-submit" value="1" />
<button type="submit" class="primary gradient-on">
Send Message
</button>
<button disabled="disabled" style="display: none;" type="button" class="loading gradient-on">
<img src="//static.mailerlite.com/images/rolling.gif" width="20" height="20" style="width: 20px; height: 20px;">
</button>
</div>
</form>
<script>
function ml_webform_success_4206197() {
jQuery('.ml-subscribe-form-4206197 .ml-block-success').show();
jQuery('.ml-subscribe-form-4206197 .ml-block-form').hide();
};
</script>
</div>
</div>
<script type="text/javascript" src="//static.mailerlite.com/js/w/webforms.min.js?v86b0a4c660f110085cbf49e83e53be98" ></script>

[Davora]

Hi Acorn

Thanks I think with the contact page I just created a fairly normal Xara web page. inserted a placeholder & the the code below in the HTML code (Body). Again I think I did this with mailer lite.

<style>
CSS code deleted as it has no relevance to the Form function
</style>
<div id="mlb2-4206197" class="ml-subscribe-form ml-subscribe-form-4206197">
<div class="ml-vertical-align-center">
<div class="subscribe-form ml-block-success" style="display:none">
<div class="form-section mb0">
<h4></h4>
<p>Thank you for Contacting Us We Will Be In Touch Within 48 Hours. Davora</p>
</div>
</div>
<form class="ml-block-form" action="//app.mailerlite.com/webforms/submit/z8e1l1" data-id="299797" data-code="z8e1l1" method="POST" target="_blank">
<div class="subscribe-form">
<div class="form-section">
<div class="form-group ml-field-name ml-validate-required">
<label for="fields[name]">Full Name</label>
<input type="text" name="fields[name]" class="form-control" value="">
</div>
<div class="form-group ml-field-email ml-validate-required ml-validate-email">
<label for="fields[email]">Email</label>
<input type="text" name="fields[email]" class="form-control" value="">
</div>
<div class="form-group ml-field-country ml-validate-required">
<label for="fields[country]">Subject</label>
<input type="text" name="fields[country]" class="form-control" value="">
</div>
<div class="form-group ml-field-company ml-validate-required">
<label for="fields[company]">Message</label>
<input type="text" name="fields[company]" class="form-control" value="">
</div>
<div class="form-group ml-field-phone ml-validate-required">
<label for="fields[phone]">Phone</label>
<input type="text" name="fields[phone]" class="form-control" value="">
</div>
</div>
<div class="form-section ml-validate-required">
<label class="confirmation_checkbox">
<input type="checkbox"> Please Contact Me
</label>
</div>
<input type="hidden" name="ml-submit" value="1" />
<button type="submit" class="primary gradient-on">
Send Message
</button>
<button disabled="disabled" style="display: none;" type="button" class="loading gradient-on">
<img src="//static.mailerlite.com/images/rolling.gif" width="20" height="20" style="width: 20px; height: 20px;">
</button>
</div>
</form>
<script>
function ml_webform_success_4206197() {
jQuery('.ml-subscribe-form-4206197 .ml-block-success').show();
jQuery('.ml-subscribe-form-4206197 .ml-block-form').hide();
};
</script>
</div>
</div>
<script type="text/javascript" src="//static.mailerlite.com/js/w/webforms.min.js?v86b0a4c660f110085cbf49e83e53be98" ></script>

[Acorn]

Dave, you need to access the form design in MailerLite and modify along the lines of https://kirstenrosetti.com/mailerlit...Thank_You_page & https://www.mailerlite.com/help/how-...ng-subscribers.

I am not in a position to hack into your code for you.

Acorn

[Davora]

Hi Acorn
Thanks I think I will have to create a new mailerlite account & start from scratch.
Dave