Get Started
Configura Clerk y ponlo en funcionamiento en tu tienda JTL en solo unos pocos pasos. Esta guía te guía a través de la conexión de tu tienda, la configuración del plugin y la sincronización de tus datos.
Conectando tu tienda #
El primer paso para instalar Clerk es conectar tu tienda con tu cuenta de Clerk.
Después de seguir estos sencillos pasos, podrás ver tu Demo Store, que te da una visión personal de cómo funcionará Clerk en tu tienda online, antes de configurar el resto del sistema.
Agregar tienda #
Después de iniciar sesión en my.clerk.io, lo primero que debes hacer es agregar tu tienda:
Escribe el Nombre y Dominio de tu tienda online.
Elige JTL como la Plataforma y selecciona tu Moneda.
Haz clic en Add Store.
Una vez creada la tienda, se enviará un email sobre tus claves públicas y privadas al propietario del email de la cuenta.
Configurar conexión #
Desde el menú principal de la Guía de Configuración, haz clic en Install Extension:
La siguiente página muestra lo que necesitas hacer para configurar la conexión JTL.
Ve a tu plugin Clerk en el backend de JTL y agrega las claves públicas y privadas de la tienda Clerk en sus respectivos campos.
Sincronizar tienda #
Después de permitir el acceso, solo necesitas sincronizar tu tienda.
Vuelve a la Guía de Configuración y haz clic en Sync Your Data:
Completa los detalles de tu tienda y haz clic en Start Sync.
La url del feed de JTL debe generarse siguiendo esta guía Creación de feeds de datos en JTL.
Ejemplo de instalación completa #
IMPORTANTE: Debes haber instalado el plugin (S360 CLerk) en tu backend JTL en Plugins
Esta documentación te guiará a través de los siguientes pasos:
Agregar una tienda #
Cada Store en Clerk es un entorno aislado con sus propios datos, claves API y Panel de Control.
Lo primero que necesitarás hacer al configurar tu cuenta de Clerk es crear tu primer Store:
Después de esto, la Guía de Configuración te guiará en el resto de la configuración.
Ten en cuenta que cada vez que se crea una tienda, se enviará un email con las claves públicas y privadas al propietario de la cuenta de la empresa. Esto se utiliza para crear acceso seguro entre Clerk y JTL.
Instalación de scripts de seguimiento #
Con el plugin S360 Clerk, puedes habilitar tanto los scripts de seguimiento de visitantes como de pedidos, que se inyectarán en partes de la tienda online:
El script de Seguimiento de Visitantes, que inicializa Clerk. Este debe ser inyectado dentro de la cabecera de la tienda online.
El script de Seguimiento de Pedidos, que permite rastrear los pedidos en tiempo real. Normalmente se instala en la página de confirmación de pedido.
Puedes habilitarlos dentro del plugin JTL en la sección ALLGEMEIN:
Cuando ambos scripts están insertados, Clerk se habrá inicializado.
Sincronizando tu tienda #
Para mostrar resultados, Clerk debe sincronizar los productos, categorías, ventas, páginas y clientes de JTL en un feed de datos generado.
Esto se hace configurando un feed de datos que permite acceder regularmente a los datos.
Esto se explica con más detalle en esta guía Creación de feeds de datos en JTL.
Cuando el feed de datos se haya generado y añadido a tus ajustes de sincronización de datos bajo Estado del Sistema en tu backend de my.clerk.io.
Agregar búsqueda y recomendaciones #
Los elementos frontend en Clerk constan de dos partes:
Un Design que controla la presentación visual de los productos. Esto puede ser modificado para coincidir con cualquier estilo que desees o puedes usar algunas de nuestras plantillas estándar Template Design to use in Clerk.
Normalmente usarás 3 Designs: Uno para Instant Search, la página de Search y Recommendations.
- Un Element con un embedcode adjunto que muestra los productos. Cada elemento tiene un nombre específico en su embedcode que quieres añadir en el campo respectivo llamado Clerk TemplateName. Esto se usa para comunicar entre tu tienda online y el respectivo elemento de clerk.
La Setup Guide te indicará dónde debe colocarse cada elemento en la mayoría de configuraciones JTL.
Al final de tu configuración, los ajustes del plugin deberían verse así. Las siguientes imágenes son solo para fines demostrativos.
| Opción | Significado |
|---|---|
| API Key | Tu clave API recibida de Clerk |
| Private Key | Tu clave privada legacy proporcionada por Clerk. Requerida para restringir el acceso al feed de datos. |
| Language | Idioma del feed de datos |
| customer group | Precios para el grupo de clientes |
| Currency | Moneda en el feed de datos |
| Faceted design | Diseño de los facets |
| Componente | Opción | Significado |
|---|---|---|
| Generalmente | Usar tracking sin cookies | Seguimiento sin el uso de cookies |
| Usar seguimiento del carrito de compras? | Informa a Clerk sobre cambios en el carrito de compras (seguimiento general del carrito de compras) | |
| Anonimizar emails | Las direcciones Email se transmiten a Clerk de forma anónima (como hash). | |
| Live Suche (Header) | ¿Activar búsqueda en vivo? | Si está desactivado, Clerk Live search no se mostrará en el frontend. |
| Selektor Livesearch | Selector de búsqueda en vivo independiente de Clerk | |
| Clerk TemplateName Livesuche | Plantilla para la búsqueda en vivo (Clerk Backend → Search → Elements → Live search → Insert into website → En el código el valor de “data-template=’@WERT’”) | |
| Número de sugerencias de búsqueda en la búsqueda en vivo | Cantidad de sugerencias de búsqueda a mostrar | |
| Número de sugerencias de categoría | Cantidad de sugerencias de categorías a mostrar | |
| Número de sugerencias de página | Cantidad de sugerencias de páginas a mostrar | |
| Posición | Posición del resultado de búsqueda en vivo en relación al selector | |
| Search (página de resultados) | ¿Activar página de resultados? | Si está desactivado, la página de resultados Clerk no se mostrará en el frontend. |
| Clerk TemplateName Search | Plantilla para búsqueda en vivo (Clerk Backend → Search → Elements → Search → Insert into website → En el código el valor de “data-template=’@WERT’”) | |
| Position facets | Posición de los facets | |
| Show facets in URL | Mostrar facets en la URL | |
| Clerk Facets Attribute | Lista separada por comas de los facets disponibles (características JTL) | |
| Clerk Facets Attributes Multiple Values | Lista separada por comas de los facets disponibles con múltiples valores (características JTL para filtrado OR) |
| Componente | Opción | Significado |
|---|---|---|
| Data Feed | Procesamiento Cron | Cómo debe activarse el cron para generar el feed de datos (explicado en más detalle en la sección de posibilidades de creación de feed de datos) |
| Batch size | Tamaño del batch de los productos del feed (explicado en más detalle en la sección de tamaño de batch) | |
| Página de producto | ¿Activar slider en la página de producto? | Si está desactivado, el slider en la página de producto no se mostrará en el frontend. |
| Selector slider de artículo | Selector para el slider de artículos independiente de Clerk | |
| Clerk TemplateName Article | Nombres de las plantillas de slider a mostrar. Se pueden especificar varios nombres de plantillas separados por comas. | |
| Slider Insert method | Cómo añadir el slider al selector (After, Append, Before, Prepand, ReplaceWith) | |
| Filter duplicates | Evita que los sliders posteriores contengan productos de sliders previos (predeterminado: Sí) | |
| Página del carrito de compras | ¿Activar slider del carrito de compras? | Si está desactivado, el slider de la página del carrito no se mostrará en el frontend. |
| Selector slider del carrito | Selector para el slider del carrito independiente de Clerk | |
| Clerk TemplateName Shopping Cart | Nombres de las plantillas del slider a mostrar. Se pueden especificar varios nombres de plantillas separados por comas. | |
| Slider Insert method | Cómo añadir el slider al selector (After, Append, Before, Prepand, ReplaceWith) | |
| Filter duplicates | Evita que los sliders posteriores contengan productos de sliders previos (predeterminado: Sí) | |
| Powerstep | ¿Activar Powerstep Slider? | Si está desactivado, el slider en el power step no se mostrará en el frontend. |
| Powerstep Selector | Selector para el Powerstep Slider independiente de Clerk | |
| Clerk TemplateName Powerstep | Nombres de las plantillas del slider a mostrar. Se pueden especificar varios nombres de plantillas separados por comas. | |
| Powerstep insertion method | Cómo añadir el slider al selector (After, Append, Before, Prepand, ReplaceWith) | |
| Filter duplicates | Evita que los sliders posteriores contengan productos de sliders previos (predeterminado: Sí) |
| Componente | Opción | Significado |
|---|---|---|
| Página de categoría | ¿Activar slider en la página de categoría? | Si está desactivado, el slider en la página de categoría no se mostrará en el frontend. |
| Selector slider de categoría | Selector para el slider de categoría independiente de Clerk | |
| Clerk TemplateName Shopping Cart | Nombres de las plantillas de slider a mostrar. Se pueden especificar varios nombres de plantillas separados por comas. | |
| Slider Insert method | Cómo añadir el slider al selector (After, Append, Before, Prepand, ReplaceWith) | |
| Filter duplicates | Evita que los sliders posteriores contengan productos de sliders previos (predeterminado: Sí) | |
| Exit Intent | ¿Activar Exit Intent Slider? | Si está desactivado, la intención de salida no se mostrará en el frontend. |
| Clerk TemplateName Exit Intent | Plantilla para la intención de salida |
Múltiples dominios #
La forma más sencilla de implementar Clerk en varios dominios en configuraciones estándar es creando un Store separado para cada dominio en my.clerk.io, y luego sincronizándolos con cada uno de tus dominios de idioma JTL.
De esta manera, puedes separar los productos, ventas, monedas, etc. para realizar un seguimiento de cada dominio.
Comienza creando tu main Store y sigue la Setup Guide para conectar tu Store a Clerk, y elige las Recommendations y/o Search Results que quieras mostrar en tu tienda online.
Cuando hayas terminado la configuración inicial, vuelve a la página de inicio de my.clerk.io (haciendo clic en el logo de Clerk en la esquina superior izquierda del menú lateral) y luego haz clic en "+ Add new store" en la última opción de la lista desplegable (generalmente debajo de los store(s) existentes y el nombre de tu empresa):
- En la página Add New Store, haz clic en Advanced para ver todas las configuraciones.
- Completa los datos de tu dominio y elige tu main Store desde el desplegable Copy Elements From Existing Store, luego haz clic en Add Store. Esto trasladará los Elements y Designs de tu main Store.
- Ahora puedes seguir la Setup Guide nuevamente, para activar Clerk haciendo clic en Getting Started, para Sync Data para el nuevo dominio.
Esto te permitirá sincronizar tu dominio con tu Store en my.clerk.io a través de la Setup Guide.
Cuando Data Sync haya finalizado, tu dominio estará listo y usando la misma configuración que tu main Store.
Repite este proceso para cada uno de tus dominios de idioma JTL. Recuerda traducir los Headlines en Element-> Edit -> Select Design al idioma correcto también.
Esta página ha sido traducida por una IA útil, por lo que puede contener errores de idioma. Muchas gracias por su comprensión.