We provide simple integration with your website whether you have a custom coded website or use wordpress. Integration with spark is simple with basic knowledge of the platform that you use.
With this simple HTML integration and basic understanding of HTML is helpful but not required as the code is provided for you and the changes required are illustrated below.
Adding the spark form
For wordpress you will need a plugin that will allow you to create custom shortcodes and include those anywhere in the website that you choose. We recommend Shortcoder plugin. This is a very powerful tool for creating html code or text and including it anywhere. This allows you to then make edits in one place and that the change propagates everywhere you use the shortcode. VERY POWERFUL!
Once the plugin is installed you will create 2 shortcodes.
The first Short code is for the phone number.
Name the shortcode “trackingphonenumber” and then put the phone number that we provide you.
Create a shortcode for Contact form
Name this shortcode “basiccontactform” in this case we want this to be in the footer of every page so locate the shortcode script and copy that and place it in your theme.
This form uses the wordpress plugin as a shortcode.
Changes to deploy the form on your website
the Client id routes the form data to your account.
<input name=”clientid” type=”hidden” value=”1033” />
The redirect is the landing page that will be redirected to on completion.
<input name=”redirect” type=”hidden” value=”http://www.sparkleadmanagement.com/thank-you/” />
The human validator is an optional feature to reduce auto form span and ensure that a human is filling out the form. This feature can be removed by taking out “-humanvalidator” from the url.
<form target=”_contact” action=”https://spark.fireups.com/Apps/leadprocessor-humanvalidator.asp” method=”post” name=”myform2″>
You can add additional data to the form collection in the notes field. in this example I name the form and add that content to the notes collection
<input name=”notes” type=”hidden” value=”Spark Lead Manager Form” />
Full Style Customization
The basic style is provided to format the form but you may format the form with your theme style or the custom styles that you choose:
<style>
.input{ width:100%; font-size:1.5em; margin:2px; padding:5px; border: thin solid #999; border-radius:9px; background-color:#333; color:#ccc}
</style>
below is example code for the basic contact form:
Add this code to your website with the changes illustrated above and all your form
<style>
.input{ width:100%; font-size:1.5em; margin:2px; padding:5px; border: thin solid #999; border-radius:9px;}
</style>
<form target="_contact" action="https://spark.fireups.com/Apps/leadprocessor-humanvalidator.asp" method="post" name="myform2"><input name="postcode" type="hidden" value="34567sdfdgh98765hj" /><input name="type" type="hidden" value="SITE" /> <input name="clientid" type="hidden" value="1033" /><input name="source" type="hidden" value="contact form" /><input name="location" type="hidden" value="" /> <input name="notes" type="hidden" value="Spark Lead Manager Form" /><input name="redirect" type="hidden" value="http://www.sparkleadmanagement.com/thank-you/" />
<h3 align="center">Let us know how we can help you</h3>
<input class="input" name="name" required="" size="8" type="text" placeholder="Name:" />
<input class="input" name="phonenumber" required="" size="8" type="text" placeholder="Phone:" />
<input class="input" name="emailaddress" required="" size="8" type="text" placeholder="Email:" />
<textarea class="input" cols="25" name="notes" rows="5" placeholder="Comments/Questions:" ></textarea>
<label>
<input id="terms" name="terms" type="hidden" value="ON" /></label><input class="input submit" name="Submit" type="submit" value="Contact Us" />
<a class="style1" href="https://www.granitemakeover.com/privacy.asp" target="_privacy" rel="noopener">Read the privacy statement</a>
</form>