Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

We've moved the forum!

Please use forum.silverstripe.org for any new questions (announcement).
The forum archive will stick around, but will be read only.

You can also use our Slack channel or StackOverflow to ask for help.
Check out our community overview for more options to contribute.

All other Modules /

Discuss all other Modules here.

Moderators: martimiz, Sean, Ed, biapar, Willr, Ingo, swaiba

UserForms Module: JavaScript on After Submission Page?


Go to End


4 Posts   2595 Views

Avatar
Worp

Community Member, 11 Posts

2 June 2011 at 11:29pm

Edited: 03/06/2011 12:04am

I have been working on getting JavaScript Code to run on the page that appears after i successfully submitted a UserForms Form.

Background:
I have a contact form on the website. I want to add a conversion-tracking JS Code to it for SEO, so that every time someone submits a contact-form the code is called.

Problem:
Including JS in silverstripe works either via the controller or via the template. But with that i would call the script on pageload and not after successful submission of the contact-form. So if a visitor navigates to the site, the conversion tracking will count +1 user, even though he did not use the contact form but called the phone number instead.

What i have tried so far:
I have tried to add the script into the ReceivedFormSubmission.ss, which i assumed to be used to display the after submission message.
So my ReceivedFormSubmission.ss file looks like this:

$OnCompleteMessage <!-- Default content -->
<% require javascript(mysite/javascript/conversiontracking.js) %> <!-- My added content to include the javascript file located in mysite/javascript/ called "conversiontracking.js"-->

The content of conversiontracking.js is

// JavaScript Document
<!-- Google Code for Kontaktformular (hart) Conversion Page -->

<script type="text/javascript" src="http://www.googleadservices.com/pagead/conversion.js">
</script>

<script type="text/javascript">
	/* <![CDATA[ */
	var google_conversion_id = xxx;
	var google_conversion_language = "de";
	var google_conversion_format = "1";
	var google_conversion_color = "ffffff";
	var google_conversion_label = "xxxx";
	var google_conversion_value = 0;
	/* ]]> */
</script>

<noscript>
	<div style="display:inline;">
	<img height="1" width="1" style="border-style:none;" alt="" src=								"http://www.googleadservices.com/pagead/conversion/xxx;script=0"/>
	</div>
</noscript>

// JavaScript Document
<!-- Google Code for Kontaktformular (hart) Conversion Page -->

(Sorry for the xxx-es but there is some user specific content in there.

Question:
How or where do i best add the conversion-tracking to make it a) work and b) only be called on successful submission of the contact form?

Reference:
If the website i am referring to is needed, i will send the link via private message to prevent spam.

Attached files:
Screenshots of the userforms backend and the site i would like the conversion tracking to appear.

Thanks in advance for any helping comment!
Worp

Avatar
Willr

Forum Moderator, 5523 Posts

6 June 2011 at 3:27pm

You could define a custom template file for the submission page. All finished forms are directed to page-name/finished (https://github.com/silverstripe/silverstripe-userforms/blob/master/code/UserDefinedForm.php#L766) so if you create a template layout such as Page_finished.ss or UserDefinedForm_finished.ss (make sure you flush) the success page will now use that template layout.

You can then alter that template has much as you want to (include js, call new functions etc).

Avatar
Worp

Community Member, 11 Posts

6 June 2011 at 7:36pm

Edited: 06/06/2011 7:37pm

Thank Willr,

you're the greatest. Sorry i didn't find that passage. I though I'd looked everywhere.

Will try your solution and report back :D

*edit:
Deleted my double post. It was posted because of frustration anyways.

Avatar
Worp

Community Member, 11 Posts

12 June 2011 at 10:29pm

Thank you Willr!

I added the full JS code (see above) into the "ReceivedFormSubmission.ss" file in ../userforms/templates/ which added the JS code to every submission of the contact formular.

For everyone who is getting this problem in the future: It did not work via the silverstripe requirements. So writing the ReceivedFormSubmission.ss like this

<% require javascript(mysite/javascript/yourscript.js) %>
<% require javascript(http://www.googleadservices.com/pagead/conversion.js) %>

<div style="display:inline;">
	<img height="1" width="1" style="border-style:none;" alt="" src="http://www.googleadservices.com/pagead/conversion/973315624/?label=9WMsCMjF3AIQqLyO0AM&amp;guid=ON&amp;script=0"/>
	</div>

and then write the Javscript in "mysite/javscript/yourscript.js" will not do the job. I just put it hardcoded in the template file, which worked fine.

This can be marked as solved! =)