Enabling the Shopify Integration

Configure a webhook

The following webhook notification will let us know when visitors purchase products from your store.

1. From your Shopify admin, go to Settings > Notifications.
2. Click Webhooks.
3. Click Create webhook.
4. In the Event drop-down menu select Order Creation
5. In the Format drop-down menu, choose JSON
6. In the URL field, enter https://service.giosg.com/api/v5/public/orgs/<your-organization-id>/rooms/<domain_room_id>/shopping_carts/shopify_webhook. Replace your-organization-id and domain_room_id with actual values for your giosg organization.
7. In the Webhook API version, select the version marked (Latest). At the time of writing it is 2025-10 (Latest)

Shopify documentation on how to create webhooks

Configure a giosg script

The following script will allow us to link store visitors to the shopping carts, visible to agents

This requires modifications to your store theme source code to include giosg script.

1. From your Shopify admin, go to Online Store > Themes.
2. Click Horizontal menu > Edit code.

In the location where you add your giosg script (e.g. section of layout/theme.liquid) add

    <!-- giosg tag -->
    <script>
    // **giosg-script location**

    _giosg(function() {
      // Submit cart on all page loads
      submitCartToGiosg();
    });

    // Update cart to Giosg each time it changes
    document.addEventListener("cart:update", submitCartToGiosg);


    function submitCartToGiosg() {
      fetch("/cart.js")
        .then((res) => res.json())
        .then((cart) => {
          console.log(cart);
          giosg.api.visitor.setIdentifier(cart.token.split("?")[0]);

          const products = [];
          cart.items.forEach((element) => {
            products.push({
              name: element.product_title,
              price: element.presentment_price,
              quantity: element.quantity,
            });
          });
          if (products.length > 0) {
            giosg.api.shoppingCart.submit(products);
            console.log("Submitted products:", products);
          } else {
            giosg.api.shoppingCart.clearCart();
            console.log("Cleared cart");
          }
        });
    }

    </script>
    <!-- giosg tag -->

This will keep the shopping cart updated and visible to agents and also enables cart freezing when a visitor completes an order.

Shopify documentation on how to edit themes