Cómo integrar Trusted Shops con Google Tag Manager en tu eCommerce

En esta guía te mostramos paso a paso cómo integrar en tu tienda online tanto el Trustbadge como la Trustcard de Trusted Shops con Google Tag Manager, sin necesidad de tocar el código fuente de tu ecommerce.

Ideal para tiendas basadas en PrestaShop, Shopify, WooCommerce, Magento u otras plataformas compatibles con Google Tag Manager.

¿Qué son el Trustbadge y la Trustcard de Trusted Shops?

El Trustbadge es un widget que muestra el sello de calidad, las valoraciones de clientes y facilita la protección al comprador. Se trata de una herramienta imprescindible para aumentar la confianza y las conversiones en tu tienda online.

La Trustcard es el componente que aparece automáticamente en la página de confirmación del pedido. Permite mostrar al cliente un resumen de su compra y recoger su consentimiento para enviarle una invitación de valoración, tanto del servicio como de los productos comprados.

Con esta configuración podrás mostrar el sello de confianza en todo el sitio y automatizar la recopilación de opiniones tras cada compra. Ideal para aumentar la conversión y generar confianza en tu ecommerce.

Requisitos antes de integrar Trusted Shops con Google Tag Manager

Antes de comenzar, asegúrate de:

• Tener una cuenta activa en Trusted Shops
• Disponer del TSID (ID de Trusted Shops) de tu tienda
• Tener correctamente la instalación de Google Tag Manager en tu ecommerce

Paso 1: Añadir el Trustbadge en todas las páginas

1.1. Crear una nueva etiqueta en Google Tag Manager

1. Entra en tu cuenta de Google Tag Manager
2. Ve a la sección Etiquetas y haz clic en "Nueva"
3. Nombra la etiqueta, por ejemplo: Trustbadge
4. En Configuración de la etiqueta, selecciona HTML personalizado
5. Pega el siguiente código, reemplazando YOUR_TSID con tu propio ID:

<script async 
  data-desktop-y-offset="0"
  data-mobile-y-offset="0"
  data-desktop-disable-reviews="false"
  data-desktop-enable-custom="false"
  data-desktop-position="right"
  data-desktop-custom-width="156"
  data-desktop-enable-fadeout="false"
  data-disable-mobile="false"
  data-disable-trustbadge="false"
  data-mobile-custom-width="156"
  data-mobile-disable-reviews="false"
  data-mobile-enable-custom="false"
  data-mobile-position="left"
  data-mobile-enable-topbar="false"
  data-mobile-enable-fadeout="true"
  data-color-scheme="light"
  charset="UTF-8"
  src="//widgets.trustedshops.com/js/YOUR_TSID.js">
</script>

4. Marcar la opción "Compatible con document.write"
5. Seleccionar “Todas las páginas”
6. Guardar los cambios

Paso 2: Configurar recopilación de valoraciones (servicio y productos)

2.1. Añadir Data Layer en la página de confirmación

Debes insertar un fragmento de código en la página de gracias (confirmación del pedido). Este paso varía según el ecommerce, pero la lógica es la misma: generar dinámicamente los datos del pedido.
Aquí un ejemplo para pedidos con valoraciones de servicio + producto:

<script>
dataLayer.push({
  ts_checkout: {
    tsCheckoutOrderNr: '2025-0001',
    tsCheckoutBuyerEmail: 'cliente@dominio.com',
    tsCheckoutOrderAmount: 123.45,
    tsCheckoutOrderCurrency: 'EUR',
    tsCheckoutOrderPaymentType: 'TARJETA',
    tsCheckoutProducts: [{
      tsCheckoutProductUrl: 'https://www.tutienda.com/producto1',
      tsCheckoutProductImageUrl: 'https://www.tutienda.com/img1.jpg',
      tsCheckoutProductName: 'Producto 1',
      tsCheckoutProductSKU: 'SKU-001',
      tsCheckoutProductGTIN: '1234567890123',
      tsCheckoutProductBrand: 'Marca X'
    }]
  }
});
</script>

Importante: Sustituye los valores en negrita por variables dinámicas de tu plataforma, por ejemplo en PHP:

<?php echo $order->id ?>

2.2. Crear Variables en Google Tag Manager

1. Ve a la sección Variables y haz clic en "Nueva"
2. Crea variables del tipo "Variable de capa de datos"
3. Usa los siguientes nombres para las variables:

2.3. Crear etiqueta Trustcard (Checkout)

1. Ve a Etiquetas > Nueva
2. Nómbrala por ejemplo: Trustcard
3. Selecciona tipo HTML personalizado
4. Pega este código:

<script>
var strOut = '';
strOut += '<div id="trustedShopsCheckout" style="display: none;">';
strOut += '<span id="tsCheckoutOrderNr">' + {{tsCheckoutOrderNr}} + '</span>';
strOut += '<span id="tsCheckoutBuyerEmail">' + {{tsCheckoutBuyerEmail}} + '</span>';
strOut += '<span id="tsCheckoutOrderAmount">' + {{tsCheckoutOrderAmount}} + '</span>';
strOut += '<span id="tsCheckoutOrderCurrency">' + {{tsCheckoutOrderCurrency}} + '</span>';
strOut += '<span id="tsCheckoutOrderPaymentType">' + {{tsCheckoutOrderPaymentType}} + '</span>';

var list = {{tsCheckoutProducts}};
list.forEach(function(product) {
  strOut += '<span class="tsCheckoutProductItem">';
  strOut += '<span class="tsCheckoutProductUrl">' + product.tsCheckoutProductUrl + '</span>';
  strOut += '<span class="tsCheckoutProductImageUrl">' + product.tsCheckoutProductImageUrl + '</span>';
  strOut += '<span class="tsCheckoutProductName">' + product.tsCheckoutProductName + '</span>';
  strOut += '<span class="tsCheckoutProductSKU">' + product.tsCheckoutProductSKU + '</span>';
  strOut += '<span class="tsCheckoutProductGTIN">' + product.tsCheckoutProductGTIN + '</span>';
  strOut += '<span class="tsCheckoutProductBrand">' + product.tsCheckoutProductBrand + '</span>';
  strOut += '</span>';
});

strOut += '</div>';
document.write(strOut);

if ("undefined" !== typeof trustbadge) {
  trustbadge.remove();
  trustbadge.reInitialize();
}
</script>

5. Marca la opción "Compatible con document.write"

2.4. Crear Activador para la página de confirmación

1. Haz clic en "+" en Activadores
2. Tipo: "Vista de una página - DOM preparado"
3. Elige la opción "Algunos eventos DOM"
4. Crea una regla del tipo: Page URL → contiene → /gracias o /order-confirmation (ajusta según tu ecommerce)
5. Guarda y vincula este activador a la etiqueta Trustcard

Paso final: Configura el trigger en el backend de eTrusted

Una vez realizada la integración mediante Google Tag Manager, es importante revisar la configuración en tu cuenta de eTrusted para que el envío de las invitaciones de valoración funcione correctamente.

1. Accede al backend de eTrusted
2. Ve al menú de Configuración > Invitaciones automáticas
3. Asegúrate de que el evento de activación (trigger) esté configurado como checkout
4. Ajusta el número de días de espera si es necesario, para que el correo de solicitud de valoración se envíe tras un plazo adecuado

Si antes usabas otro tipo de integración (como API o plugin nativo), es posible que el trigger estuviera en delivery. Ahora, con Google Tag Manager, debe estar en checkout para que funcione correctamente.

Verifica y publica

Una vez creadas las etiquetas y activadores, haz clic en "Vista previa" en GTM para verificar que todo se activa correctamente. Luego, publica los cambios.

En el resultado final:

• El Trustbadge aparece en todas las páginas del sitio

• En la página de confirmación de pedido, se lanza la Trustcard:

• Se recopilan automáticamente valoraciones de servicio y productos
• Todo gestionado desde Google Tag Manager

Con esta integración, tu ecommerce gana en confianza, conversión y visibilidad online. Trusted Shops no solo aporta una imagen de calidad, sino que permite recopilar opiniones auténticas y mostrarlas fácilmente a tus futuros compradores.

¿Dudas con la integración en tu plataforma? En digitalDot podemos ayudarte, ¡Contáctanos! 😉

Preguntas frecuentes sobre la integración de Trusted Shops con Google Tag Manager