Monday, November 5, 2012

Google Trusted Stores With Your ShopSite Website

Google Trusted Stores is a feature you can setup for your website if you have a Google Account.  You will need to have a verified website in Google. Google Trusted Stores is another way to let online shoppers know that you are a verified, secure, and trusted website.  Customers are encouraged to report feedback on your website. Shoppers can hover over or click on the Google Trusted Stores logo on your website to see your company's standing with Google Stores.

To set this up, you will need to add some custom JavaScript to all your store pages.  You will also need to get your Google Product ID for all your products (this can be done by moving this information into an extra product field).  Follow the instructions below for adding the Google Trusted Stores code to your website.
  1. Add Google Product ID For Products Into An Extra Product Field. For this example, I will be placing the Google Product ID in the extra product field 10.  Do this by downloading your products database (Utilities > Database > Download).  You only need to download your product identifier field (either name or SKU), and the Google Product ID field.  Once you have downloaded the file and saved it to your computer, re-upload it into your store.  When you get to the step where you can map the product fields, click on the link to map the fields, and change the Google Product ID field to the Product Field 10, then complete the upload. 
    Note: If you are already using the extra product field 10, you will want to use a different product field.
      
  2. Begin Setting Up Your Google Trusted Stores Account. If you have a Google Account for your business, you can go to http://www.google.com/trustedstores/merchants/, to begin setting up your Google Trusted Stores account.  Go through the process until you need to place the JavaScript code on your website, then go onto step 3.
     
  3. Paste Code Below Onto All Store Pages. The code below should be added to all store pages.  It should be included in the template.  What I would suggest is create an include file called "GoogleTrustedStoresPageCode" and paste this code into that include file, replacing the red fields below with your specific store information.  Then include the include file at the bottom of the page code in all the template types (in your page template and search template DEFINE PAGE section, product template DEFINE MORE_INFO_PAGE section, and the cart template DEFINEs).  For example, in your page template, at the bottom of the template it should look similar to:
    [-- INCLUDE GoogleTrustedStoresPageCode PROCESS --]
    </body>
    </html>
    [-- END_DEFINE PAGE --]

    You will also want to add the following VAR tag to the TOP of all your templates (except the product template).
    [-- VAR.Field10 "" --]

    Your product template should be slightly different.  In the product template, you will want to place the following VAR tag in both the [-- DEFINE PRODUCT --] and [-- DEFINE MORE_INFO_PAGE --] sections.
    [-- VAR.Field10 PRODUCT.Field10 --]

    Here is the JavaScript for the include file:
    <!-- BEGIN: Google Trusted Store -->
    <script type="text/javascript">
      var gts = gts || [];
      gts.push(["id", "555555"]);
      gts.push(["google_base_offer_id", "[-- IF VAR.Field10 --][-- VAR.Field10 --][-- ELSE --]90014c3c-6d63-11e1-9ced-000a5e410845[-- END_IF --]"]);
      gts.push(["google_base_subaccount_id", "555555"]);
      gts.push(["google_base_country", "ISO 3166-1"]);
      gts.push(["google_base_language", "ISO 639-1"]);
      (function() {
        var scheme = (("https:" == document.location.protocol) ? "https://" : "http://");
        var gts = document.createElement("script");
        gts.type = "text/javascript";
        gts.async = true;
        gts.src = scheme + "www.googlecommerce.com/trustedstores/gtmp_compiled.js";
        var s = document.getElementsByTagName("script")[0];
        s.parentNode.insertBefore(gts, s);
      })();
    </script>
    <!-- END: Google Trusted Store -->

    Note: 90014c3c-6d63-11e1-9ced-000a5e410845 in the code above should be replaced with ANY of your products' Google Product ID number.
     
  4. Add JavaScript To Your Thank You Screen. The last step involves adding the JavaScript code below into the DEFINE THANK_YOU section of your shopping cart template.  Again, replace the red information below with your specific store information.
    <script type="text/javascript">
    var d = new Date();
    var seven_date = d.getDate()+7;
    if (seven_date < 10) {var seven_date_two = "0" + seven_date;}
    else {var seven_date_two = seven_date;}
    var curr_month = d.getMonth();
    if (curr_month < 10) {var curr_month_two = "0" + curr_month;}
    else {var curr_month_two = curr_month;}
    var curr_year = d.getFullYear();
    var weekDate =(curr_year + "-" + curr_month_two + "-" + seven_date_two);
    var prodNum = number_products;
    document.write("<div id=\"gts-order\">");
      document.write("<span id=\"gts-o-id\">" + ss_ordernum + "<\/span>");
      document.write("<span id=\"gts-o-domain\">www.yourdomain.com<\/span>");
      document.write("<span id=\"gts-o-email\">" + ss_email + "<\/span>");
      document.write("<span id=\"gts-o-country\">US<\/span>");
      document.write("<span id=\"gts-o-currency\">USD<\/span>");
      document.write("<span id=\"gts-o-total\">" + ss_ordertotal + "<\/span>");
      document.write("<span id=\"gts-o-discounts\">" + ss_coupon_discount + "<\/span>");
      document.write("<span id=\"gts-o-shipping-total\">" + ss_shiptotal + "<\/span>");
      document.write("<span id=\"gts-o-tax-total\">" + ss_taxtotal + "<\/span>");
      document.write("<span id=\"gts-o-est-ship-date\">" + weekDate + "<\/span>");
      document.write("<span id=\"gts-o-has-preorder\">N<\/span>");
      document.write("<span id=\"gts-o-has-digital\">N<\/span>");
    for (i=0; i<prodNum; i++) {
      document.write("<span class=\"gts-item\">");
        document.write("<span class=\"gts-i-name\">" + ss_name[i] + "<\/span>");
        document.write("<span class=\"gts-i-price\">" + ss_price[i] + "<\/span>");
        document.write("<span class=\"gts-i-quantity\">" + ss_quantity[i] + "<\/span>");
        document.write("<span class=\"gts-i-prodsearch-id\">" + ss_field10[i] + "<\/span>");
        document.write("<span class=\"gts-i-prodsearch-store-id\">555555<\/span>");
        document.write("<span class=\"gts-i-prodsearch-country\">US<\/span>");
        document.write("<span class=\"gts-i-prodsearch-language\">en<\/span>");
      document.write("<\/span>");
    }
    document.write("<\/div>");
    </script>

    Note: The orange areas in the code above can be changed but don't necessarily have to.  The first one, d.getDate()+7, says that you are telling Google you will ship the order 7 days after it is placed.  If your average ship time is longer than that, you will want to modify the 7 to whatever is more accurate for your store. The next few, " + ss_coupon_discount + ", " + ss_shiptotal + ", " + ss_taxtotal + " should remain the same if you have coupons, use any shipping rates, and use tax rates.  If you do not use any of these, replace the orange with 0. Also, the codes provided above are generic codes and should work for most stores.  I am not guaranteeing that they work for all stores.
I hope that this article helps as you set up your Google Trusted Stores account.  There is a month probationary period from Google for the Google Trusted Stores seal, so make sure that you have everything setup correctly, before waiting through that probation period.  Good luck :).

Full Code Example (changed for 4 days out for shipping instead of 7):
<script type="text/javascript">
var d = new Date();
var seven_date = d.getDate();
var curr_month = d.getMonth() + parseInt(1);
if (seven_date < 25) {
  var curr_year = d.getFullYear();
  var seven_date_two = seven_date + parseInt(4);
  if (curr_month < 9) {var curr_month_two = "0" + curr_month;} else {var curr_month_two = curr_month;}
  var weekDate =(curr_year + "-" + curr_month_two + "-" + seven_date_two);
}
else if (curr_month > 11) {
  var curr_year = d.getFullYear()+1;
  var curr_month_two = "01";
  var weekDate =(curr_year + "-" + curr_month_two + "-" + seven_date_two);
}
else {
  var curr_year = d.getFullYear();
  var curr_month_two = curr_month + parseInt(1);
  if (curr_month_two < 9) {var curr_month_three = "0" + curr_month_two;} else {var curr_month_three = curr_month_two;}
  var seven_date_two = "04";
  var weekDate =(curr_year + "-" + curr_month_three + "-" + seven_date_two);
}
var prodNum = number_products;

document.write("<div id=\"gts-order\" style=\"display: none;\">");
  document.write("<span id=\"gts-o-id\">" + ss_ordernum + "<\/span>");
  document.write("<span id=\"gts-o-domain\">www.laurenhillsdesign.com<\/span>");
  document.write("<span id=\"gts-o-email\">" + ss_email + "<\/span>");
  document.write("<span id=\"gts-o-country\">US<\/span>");
  document.write("<span id=\"gts-o-currency\">USD<\/span>");
  document.write("<span id=\"gts-o-total\">" + ss_ordertotal + "<\/span>");
  document.write("<span id=\"gts-o-discounts\">0<\/span>");
  document.write("<span id=\"gts-o-shipping-total\">0<\/span>");
  document.write("<span id=\"gts-o-tax-total\">" + ss_taxtotal + "<\/span>");
  document.write("<span id=\"gts-o-est-ship-date\">" + weekDate + "<\/span>");
  document.write("<span id=\"gts-o-has-preorder\">N<\/span>");
  document.write("<span id=\"gts-o-has-digital\">N<\/span>");

for (i=0; i<prodNum; i++) {
  document.write("<span class=\"gts-item\">");
    document.write("<span class=\"gts-i-name\">" + ss_name[i] + "<\/span>");
    document.write("<span class=\"gts-i-price\">" + ss_price[i] + "<\/span>");
    document.write("<span class=\"gts-i-quantity\">" + ss_quantity[i] + "<\/span>");
    document.write("<span class=\"gts-i-prodsearch-id\">" + ss_field14[i] + "<\/span>");
    document.write("<span class=\"gts-i-prodsearch-store-id\">123455<\/span>");
    document.write("<span class=\"gts-i-prodsearch-country\">US<\/span>");
    document.write("<span class=\"gts-i-prodsearch-language\">en<\/span>");
  document.write("<\/span>");
}
document.write("<\/div>");
#### show this line only for testing the date purposes.
#document.write(weekDate);
</script>

No comments:

Post a Comment