Embedding registration onto your website

Http vs Https considerations for embedding

An embedded registration gives a very nice and professional look to your site, but there are a few issues that may need to be addressed. This is accomplished by adding an resizable iframe to your site and putting your Vantora registration into that frame. It is important to note that the Vantora code is all secured on https pages.

Internet users have been trained to have more trust for https pages and make sure they are secure before putting in credit card, or other sensitive data on a web page. If you do not receive payments, this may not be a concern. If only taking PayPal, the PayPal code automatically breaks out of iframes and starts a new browser window when the customer is transferred to them to make a payment. But either way, depending on your customers browser, and browser settings, and any anti-phising, anti virus software they might be using, your customer may get a message that some of the information not secure, and some will even issue a warning.

Secure Web Page for embedding

This is even worse if you are using authorize.net to get credit card info, as then that will not kick out to a new page, but will ask for the secure info on a secure frame on a nonsecure page – making browsers, and sometimes customers, not happy.

The ultimate solution to this is secure your website. Most hosting companies can just set your site to be secure in a matter of an hour or so. They just apply for a secure certificate and apply it. It might be free if included in your hosting, or maybe a fee of $50 a year or so. You will be fine with a shared secure certificate and don’t need to spend hundreds a year on your certificate.

After you have your secure certificate, you want to make sure the page you are sending people to do their reservations is https://www.yourpage.com/registration etc.

If using WordPress, after you install your security certificate, there are free plugins you can download called Really Simple SSL that will then turn your entire site into https pages without you having to do any other changes or coding. And you will see that search engines, etc will update very quickly, and any legacy links that are pointing to a page like http://www.yoursite/this_page will automatically switch to https://www.yoursite/this_page

Ready to embed

So when you are ready to test an embedded page, you need to copy and paste the following lines and make sure they are in between yourandtags on the page where you are going to embed your registration.

<!– JavaScript for resizing iFrames –>

<script type=’text/javascript’
src=”https://code.jquery.com/jquery-3.3.1.min.js”
integrity=”sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=”
crossorigin=”anonymous”></script>

<script type=’text/javascript’
src=”https://cdnjs.cloudflare.com/ajax/libs/iframe-resizer/3.5.16/iframeResizer.js”
integrity=”sha384-EOBIY32SK8HiSV13WhWwedbApBXxWghFSI061UObhrGa9vD2AwdAGkJMYp+P8GJq”
crossorigin=”anonymous”></script>

<script type=’text/javascript’
src=”https://www.vantora.com/e/jettydive/content/js/embedded.js”></script>

Note: in the bottom line above you see the line with “https://www.vantora.com/e/jettydive/content/js/embedded.js”

You will modify this to match your field code,  so the e/jettydive/  might become something like  paintball/gat/ etc.

If using WordPress

Without knowing any programming, it is still easy to accomplish the above with a WordPress page thanks to a plugins that write to the header for you without you having to edit PHP pages. They can also write the code just to the particular page, or pages you want instead of all pages.  One example is a plugin called H & F. Go to your plugins, choose add new, and search for “header footer” in the search bar. Look for the H & F as pictured to the right. Then install the plug in.

After it is installed, you can go to the settings, click on Header Footer and in the top left box for header, you paste in the code from above. When done it should look like the following (except for your Vantora id instead of Gatsplat)

Then on the page where you want to have your booking, you will put the following code – again changing the e/jettydive/ to whatever your vantora code is.

<iframe id=”frame-Name” style=”border: none; width: 100%;” src=”https://www.vantora.com/e/jettydive/registration/embedded.asp” width=”300″ height=”150″ scrolling=”no”></iframe>
<script>iFrameResize({heightCalculationMethod: ‘taggedElement’, checkOrigin: false}, ‘#frame-Name‘)</script>

Using Variables

If you have been using variables on our links to specify referral source, quantity of players, packages, etc, you still can! If you read over the page on Variables, the rules are basically all the same. Review This Page

The only real difference is you will add the variables to the url of the link to the page where your registration is embedded. Let’s look at an example:

Lets assume that the page where you have your registration is https://www.mysite.com/bookings/. If you want to run a link to a particular package, lets assume pid=21 and quantity of 8 and you are running this from a google ad, and want the referred to be GA1 (google ad 1), your complete link would look like:

https://www.mysite.com/bookings/?pid=21&qty=8&ref=GA1

Of if using a page that ends with .htm, or .asp, or .php, etc, your link would look like

https://www.mysite.com/bookings.htm?pid=21&qty=8&ref=GA1