How do I extract data from the Woocommerce checkout page and feed it into supplied Google Customer Reviews code-snippet?

Question

I am trying to implement Google Customer Reviews into my checkout page on my Wordpress website.

I am running Woocommerce and I've implemented the below code-snippet into my checkout page.

<script src="https://apis.google.com/js/platform.js?onload=renderOptIn" async defer></script>

<script>
  window.renderOptIn = function() {
    window.gapi.load('surveyoptin', function() {
      window.gapi.surveyoptin.render(
        {
          // REQUIRED FIELDS
          "merchant_id": XXXXXX,
          "order_id": "ORDER_ID",
          "email": "CUSTOMER_EMAIL",
          "delivery_country": "COUNTRY_CODE",
          "estimated_delivery_date": "YYYY-MM-DD",

          // OPTIONAL FIELDS
          "products": [{"gtin":"GTIN1"}, {"gtin":"GTIN2"}]
        });
    });
  }
</script>

This script seems to work correctly when I hard-code my email address, order ID and country code.

However, I wish to extract the order ID, customer_email and others from the checkout page on which the script is active. I am unable to find a way how to do this. I did find this link which talks about an order object: https://www.businessbloomer.com/woocommerce-easily-get-order-info-total-items-etc-from-order-object/

Even with this information, I don't know how to extract the order details from the webpage and feed them as parameters inside the code snippet.

I've also tried Google's example (found here: https://support.google.com/merchants/answer/7106244):

<!-- BEGIN GCR Opt-in Module Code -->

<script src="https://apis.google.com/js/platform.js?onload=renderOptIn"

async defer>

</script>

<script>

window.renderOptIn = function() {

window.gapi.load('surveyoptin', function() {

window.gapi.surveyoptin.render(

{

"merchant_id": 42,

"order_id": "<?php echo $order_id ?>",

"email": "<?php echo $email_address ?>",

"delivery_country": "<?php echo $user_country ?>",

"estimated_delivery_date": "<?php echo $delivery_date ?>",

"products": [{"gtin":"<?php echo $gtin_1 ?>"}, {"gtin":"<?php echo $gtin_2 ?>"}],

"opt_in_style": "BOTTOM_LEFT_DIALOG"

});

});

}

</script>

<!-- END GCR Opt-in Module Code -->

<!-- BEGIN GCR Language Code -->

<script>

window.___gcfg = {

lang: 'en_US'

};

</script>

<!-- END GCR Language Code -->

This example tries to echo the values into the required fields.

My two questions:

• How do I find out which objects are present on my checkout page?
• How do I call the objects to extract data from it to feed to the code-snippet?

Answer 1

In this example, the delivery date is 10 days from the order date (+10 days). I added this to the functions.php file of my child theme.

//  ADD Google Customer Reviews Code
//  
function woo_google_reviews($order_id) {
    //getting order object
    $order = wc_get_order($order_id);
    $email = $order->billing_email;
    $shipcountry = $order->shipping_country;
    $deliverydateDate=Date('Y-m-d', strtotime('+10 days'));
    ?>
    <script src="https://apis.google.com/js/platform.js?onload=renderOptIn" async defer></script>
    <script>
        window.renderOptIn = function () {
            window.gapi.load('surveyoptin', function () {
                window.gapi.surveyoptin.render(
                        {
                            "merchant_id": "xxx your merchant id here xx",
                            "order_id": "<?php echo $order_id; ?>",
                            "email": "<?php echo $email; ?>",
                            "delivery_country": "<?php echo $shipcountry; ?>",
                            "estimated_delivery_date": "<?php echo $deliverydateDate; ?>"
                        }
                );
            });
        };
    </script>
    <?php
}

add_action('woocommerce_thankyou', 'woo_google_reviews');
//  
//END ADD Google Customer Reviews Code