Integrar las valoraciones de productos

La integración de las valoraciones de productos de Trusted Shops funciona de forma muy sencilla a través del Trustbadge^®. Lo mejor: Al utilizar el Trustbadge^® se garantiza automáticamente que solo valoren los clientes que realmente han comprado en tu tienda.

Integrar las valoraciones de productos en dos pasos:

La base para acumular valoraciones de productos es la integración del Trustbadge^®. En caso de que aún no hayas integrado el Trustbadge^®, accede aquí al manual sobre el Trustbadge^®.
Para las valoraciones de productos deberás introducir de forma adicional en el paso 3 de la integración del Trustbadge® los datos del producto (URL del producto, nombre del producto y numero SKU del producto de manera obligatoria) de la cesta de la compra.

<div id="trustedShopsCheckout" style="display: none;">
 <span id="tsCheckoutOrderNr">2016-05-21-001</span>
 <span id="tsCheckoutBuyerEmail">my.customer@mail.com</span>
 <span id="tsCheckoutOrderAmount">4005.95</span>
 <span id="tsCheckoutOrderCurrency">EUR</span>
 <span id="tsCheckoutOrderPaymentType">PREPAYMENT</span>
 <span id="tsCheckoutOrderEstDeliveryDate">2016-05-24</span>
 <!-- product reviews start -->
 <!-- for each product in the basket full set of data is required -->
 <span class="tsCheckoutProductItem">
 <span class="tsCheckoutProductUrl">http://www.shop.url/product_page.html</span>
 <span class="tsCheckoutProductImageUrl">http://www.shop.url/image.png</span>
 <span class="tsCheckoutProductName">Product Name</span>
 <span class="tsCheckoutProductSKU">0123456789</span>
 <span class="tsCheckoutProductGTIN">0123456789</span>
 <span class="tsCheckoutProductMPN">0123456789</span>
 <span class="tsCheckoutProductBrand">ABCDEFGHIJ</span>
 </span>
 <!-- product reviews end -->
 </div>

(los requisitos mínimos son tsCheckoutProductUrl, tsCheckoutProductName y tsCheckoutProductSKU).

¡Ahora estás listo para empezar a acumular de forma automática valoraciones para tus productos!

Tu cliente entregará primero la valoración para su tienda con el comentario y las estrellas a través del formulario de valoración. Después será reenviado a la página de confirmación, donde podrá valorar de forma adicional los productos comprados.

Explicación:

Campos obligatorios

tsCheckoutProductUrl: La URL del artículo
tsCheckoutProductName: El nombre del producto que aparece en la página de la ficha del mismo
tsCheckoutProductSKU: El número de identificación o número de artículo (SKU) propio de la tienda

Campos opcionales

tsCheckoutProductImageUrl: Aquí podrás enviarnos imágenes del producto o su URL
tsCheckoutProductGTIN: Número de identificación, con el que se podrá identificar de forma inequívoca los productos y los paquetes en todo el mundo, desarrollado por GS1
tsCheckoutProductMPN: Número de serie que se asigna al producto de forma inequívoca a un fabricante específico
tsCheckoutProductBrand: Nombre de la marca del producto

Mostrar las valoraciones de productos en la tienda

¿Deseas mostrar en tu tienda las valoraciones de productos acumuladas y aumentar así las ventas? Entonces integra fácilmente nuestro sticker del producto.

Podrás personalizar el sticker del producto en su totalidad. Selecciona un color y un formato, y publica tus valoraciones de productos directamente en las páginas de detalles del producto. La integración tiene lugar integrando el siguiente código JavaScript.

<script type="text/javascript">
  _tsProductReviewsConfig = {
	tsid: 'XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX',
	sku: ['ART-123'],
	variant: 'productreviews',
        /* optional */
	borderColor: '#0DBEDC',
	backgroundColor: '#ffffff',
	locale: 'en_GB',
	starColor: '#FFDC0F',
	commentBorderColor: '#dad9d5',
	commentHideArrow: 'false',
	richSnippets: 'on',
	starSize: '15px',
	ratingSummary: 'false',
	maxHeight: '1200px',
	hideEmptySticker: 'false',
	filter: 'true',
	introtext: 'What our customers say about us:'
  };
  var scripts = document.getElementsByTagName('SCRIPT'),
  me = scripts[scripts.length - 1];
  var _ts = document.createElement('SCRIPT');
  _ts.type = 'text/javascript';
  _ts.async = true;
  _ts.charset = 'utf-8';
  _ts.src ='//widgets.trustedshops.com/reviews/tsSticker/tsProductSticker.js';
  me.parentNode.insertBefore(_ts, me);
  _tsProductReviewsConfig.script = _ts;
</script>

Los parámetros "TS-ID", "variant", "locale" y "sku" son obligatorios y el resto son opcionales.

Explicación:

Campos obligatorios

tsID: Tu ID de Trusted Shops
variant "productreviews": Para el sticker del producto
sku: El número de identificación del producto o el número de artículo del fabricante (SKU)
locale: Este parámetro determina el idioma del sticker.

Además, también es posible mostrar las valoraciones recopiladas para un producto que está disponible en distintas variantes como, por ejemplo, diferentes colores o tamaños. De esta forma, se recopilarán todas las valoraciones de productos con distintas variantes en un único lugar.

Simplemente introduce las distintas SKU en código para los respectivos artículos de la siguiente forma: ['product1sku','product2sku']

Campos opcionales

borderColor: Selecciona el color del marco que se adapte a tu tienda
backgroundColor: Selecciona el color de fondo del sticker
starColor: El color de las estrellas de valoración
starSize: El tamaño de las estrellas de valoración (en píxeles)
ratingSummary: Decide si deseas mostrar la valoración total arriba a la izquierda en el Sticker
maxHeight: Este parámetro te permite ajustar la altura del Sticker para productos
introtext: Añade un texto descriptivo que llame la atención de tus clientes hacia las valoraciones de productos.
hideEmptySticker: Si únicamente deseas visualizar el sticker en tu sitio web una vez disponga de valoraciones de productos, entonces deberás configurar el parámetro "hideEmptySticker".
richSnippets: Si activas este parámetro, los datos estructurados para la visualización de las estrellas en Google estarán a disposición directamente en la viñeta.
commentBorderColor: Con ello determinas el color del marco para cada valoración individual.
commentHideArrow: Con este parámetro activas/desactivas el pequeño triángulo en el borde inferior de cada valoración.

Ya has terminado. ¡Te deseamos que disfrutes con las valoraciones de productos de Trusted Shops!

Mostrar las estrellas de valoración por separado

No solo el Product Sticker muestra las estrellas de valoración. Para cada artículo, puedes mostrar las estrellas de valoración total por separado de los comentarios de los clientes en la página detallada del producto. Las estrellas de valoración, diseñadas de forma individual y ubicadas en un lugar destacado, ofrecen a tus clientes una impresión a primera vista sobre la calificación del producto.

Completa el siguiente código de JavaScript para publicar las estrellas de valoración a tu gusto.

<div id="test"></div>
<script type="text/javascript" src="//widgets.trustedshops.com/reviews/tsSticker/tsProductStickerSummary.js"></script>
<script> 
var summaryBadge = new productStickerSummary();
summaryBadge.showSummary(
{
'tsId': 'TSID',
'sku': ['9990004'],
'element': '#test',
'starColor' : '#FFDC0F',
'starSize' : '14px',
'fontSize' : '12px',
'showRating' : 'true' ,
'scrollToReviews' : 'false' ,
'enablePlaceholder' : 'false',
}
);
</script>

Explicación:

Campos obligatorios

tsId: Tu ID de Trusted Shops
sku: El número de identificación del producto o el número de artículo del fabricante (SKU)
element: Ubicación de las estrellas de valoración

Campos opcionales

starColor: El color de las estrellas de valoración
starSize: El tamaño de las estrellas de valoración (en píxeles)
frontSize: El tamaño de la fuente para el número de valoraciones y la nota (en píxeles)
showRating: Mostrar nota de la valoración (verdadero) u ocultar (falso)
scrollToReviews: Al hacer clic en las estrellas la página se desplaza hasta el Product Sticker (activar con "true")
enablePlaceholder: Si activas este parámetro, las estrellas de valoraciones del producto se mostrarán en gris siempre que aún no se disponga de valoraciones.

Soporte

Integrar correctamente las valoraciones de productos