Personal tools

Integrating Google Checkout with your Plone site

If you already have a shopping cart on your plone site, integrating with Google Checkout is made easy with the HTML integration API. If you haven't setup a shopping cart yet, relax, your job will be made easier with the SimpleCartItem Plone Product, available at plone.org.





This tutorial demonstrates how to integrate Google Checkout with your SimpleCartItem based shopping cart.   If you don't use SimpleCartItem, you should still be able to follow the example and apply it to your cart setup.

For basic setups, the Google Checkout HTML API is the method of choice.  If you require advanced options, such as tax tables, that is beyond the scope of the HTML API and you'll have to make use of Google Checkout's XML API.

Google Checkout on your website will revolve around an HTML Form with a Google Checkout submit button.  I would recommend creating a new macro to encapsulate this form from the rest of your cart as follows:

Create a new page template called checkout_macros.  Then define a google macro inside the template.  Also create a results object which pulls the cartList from the session scope:

<html xmlns:tal="http://xml.zope.org/namespaces/tal"
      xmlns:metal="http://xml.zope.org/namespaces/metal"
      i18n:domain="plone">
<body>

<div metal:define-macro="google"
     tal:define="results here/REQUEST/SESSION/cartList|nothing;"
     tal:condition="results">



</div>
</body>
</html>

Next, let's fill the macro with the following code, keeping in mind that this code is intended for use with the SimpleCartItem product:

<form method="POST"
      action="https://checkout.google.com/cws/v2/Merchant/yourMerchantID/checkoutForm"
      accept-charset="utf-8">

    <tal:block repeat="item results">

        <input type="hidden"
            tal:attributes="name python: 'item_name_' + str(repeat['item'].index + 1);
                               value item/name;" />
        <input type="hidden"
            tal:attributes="name python: 'item_description_' + str(repeat['item'].index + 1);
                            value item/options" />

        <input type="hidden"
            tal:attributes="name python: 'item_quantity_' + str(repeat['item'].index + 1);
                            value item/quantity;" />

        <input type="hidden"
            tal:attributes="name python: 'item_price_' + str(repeat['item'].index + 1);
                            value item/price;" />

    </tal:block>

    <input type="hidden" name="ship_method_name_1" value="UPS Ground" />
    <input type="hidden" name="ship_method_price_1" value="25" />

    <input type="hidden" name="tax_rate" value="0.0875" />
    <input type="hidden" name="tax_us_state" value="NY" />

    <input type="hidden" name="_charset_"/>

    <input type="image" name="Google Checkout" alt="Fast checkout through Google"
src="http://checkout.google.com/buttons/checkout.gif?merchant_id=yourMerchantID&w=180&h=46&style=white&variant=text&loc=en_US"                height="46" width="180" style="border: 0;" />

</form>

Once you've created your macro, call it from the cart template as follows:

<div metal:use-macro="here/checkout_macros/macros/google">
    Google Checkout Button
</div>

Need assistance with your project? Universal Web Services can help.
Contact us to request a quote.