Adding a Google Checkout Button to your InstantPro web site
Welcome to the InstantPro Google Checkout Intregration Tutorial. Google's Checkout facility is becoming increasingly popular across the internet, with companies of all sizes making use of this new service to create an online store quickly and easily.
With this tutorial you will be shown how to provide your very own Google Checkout Buy Now button on your InstantPro web site. The Freeola InstantPro service is an easy way to create a stylish web site in minutes! For only £3 per month you can have your own InstantPro web site, for more information please visit the Instant Sites page.
We also have a Drop Down list guide for use with the Google Checkout service, which will allow you to organise your items for sale in a more organised fashion.
Before you can add Google Checkout to your InstantPro web site, you will need to create an account.
Please be advised that Freeola Limited is not affiliated in any way with Google or the Google Checkout service. We offer these tutorials purely for the convenience of our InstantPro customers.
For tutorials for how to integrate other Payment Processing Providers, you will need to visit the InstantPro Shop Integration home page.
Signing up for Google Checkout
1. You will need to visit the Google Checkout account page, this can be accessed at: http://checkout.google.com.
From here you will need to select a seller account, and provide the required business information.
Click image to view full-size
2. If your registration has been successful then you will be able to access your Google Checkout options and settings.
You are now ready to integrate Google Checkout into your InstantPro web site.
Creating your Google Checkout Buy Now Button
The Google Checkout button allows you to individually sell items on your web site. Once the user has pressed the 'Buy Now' button they will taken to the Google web site to provide their Credit/Debit card information.
1. Once signed in to your Google Checkout account, you will need to navigate to the 'Tools' tab. From the 'Tools' tab you will see the option for 'Buy Now' buttons.
Click image to view full-size
2. You will now be able to configure the styling of your button and also provide information about the items that your selling!
Click image to view full-size
3. Once you are happy with your button, click on the 'Create button code' button. Your HTML code will now be displayed at the bottom of the page.
4. You will need to copy the HTML by highlighting the text, right-clicking and selecting 'Copy' from the list of choices.
Click image to view full-size
Now that you have your button's code, we need to add it to your Instant Site.
Adding the Google Checkout Button to your InstantPro site
5. You will now need to launch your InstantPro Builder. To do this login to your MyFreeola account, and navigate to the InstantPro Web Designer Page.
6. From the Site Overview, click the 'Page Manager' button. You will now be shown the pages of your Instant Site, you can add your button to an existing page or you can create a new page.
7. You will need to create or select a standard page from your InstantPro builder to enter your code into. Once you have chosen your page, you will need to use the 'HTML' tool from the InstantPro Editor's Toolbar.
Click image to view full-size
8. You will now see the HTML view of your web site, this is where you can enter in the code given by Google.
We are aware that some previous versions of Firefox may have problems when trying to paste HTML code into the builder, if you encounter this problem we suggest to either update your Firefox installation to version 3 (or above) or use a different browser.
Click image to view full-size
We would suggest that for the time being you paste the button below all of your HTML code, you can move the Button once it has been added by using the InstantPro Editor, rather than the HTML Editor.
Once you are happy that you have entered in the HTML code, press the 'Update' button.
11. Your button will now be displayed in your InstantPro Editor.
Click image to view full-size
You can now save your page.
Click image to view full-size
Now your items will be ready for sale through your web site, when visitors visit your web site they will be able to press the "Buy Now" button and taken to Google Checkout.
Adding multiple items to your InstantPro site
If you wish to add more items to your InstantPro web site, you simply need to follow the tutorial through again but at point 8, enter in your new Button code below all of your previous HTML code.
Click image to view full-size
And the finished result.
Click image to view full-size
Alternatively if you have a products that are similar, such as T-Shirts with different sizes, it may be worth having a look at the Google Checkout Drop Down list guide, as this is the easiest way to sell variations of your products.
