SmartWeb Classic

Get Started

Instala Clerk en SmartWeb Classic siguiendo estos sencillos pasos

Haz que Clerk funcione en tu tienda SmartWeb Classic en solo unos pasos. Esta guía te guía en la conexión de tu tienda, la instalación de los scripts de seguimiento 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 general personal de cómo funcionará Clerk en tu webshop, antes de configurar el resto del sistema.

Añadir tienda #

Después de iniciar sesión en my.clerk.io, lo primero que debes hacer es añadir tu tienda:

Add new store form

  1. Escribe el Name y el Domain de tu tienda online.

  2. Elige SmartWeb como Platform y elige tu Currency.

  3. Haz clic en Add Store.

Instalar seguimiento de visitantes #

  1. En el backend de tu SmartWeb Classic, ve a Kontrolpanel > Design Manager > Rediger design.

  2. Haz clic en Indsæt Javascript y pega el script de seguimiento de visitantes de Clerk. Luego haz clic en Gem.

  3. Asegúrate de que el script esté insertado en el encabezado bajo <head>.

Insert JavaScript dialog
Tracking script in header

Utiliza INSERT_PUBLIC_API_KEY en el fragmento de abajo y reemplázalo por tu Public Key de my.clerk.io > Developers > API Keys.

<!-- Clerk.io Visitor Tracking (SmartWeb Classic) -->
<script type="text/javascript">
  (function(w,d){
    var e=d.createElement('script');e.type='text/javascript';e.async=true;
    e.src='https://cdn.clerk.io/clerk.js';
    var s=d.getElementsByTagName('script')[0];s.parentNode.insertBefore(e,s);
    w.__clerk_q=w.__clerk_q||[];w.Clerk=w.Clerk||function(){ w.__clerk_q.push(arguments) };
  })(window,document);

  Clerk('config', { key: 'INSERT_PUBLIC_API_KEY' });
</script>

Instalar seguimiento de pedidos #

  1. En SmartWeb Classic, ve a Kontrolpanel > Design Manager > Rediger filer > Modules > Checkout.

  2. Abre checkout-approved.tpl y añade el código de seguimiento de ventas al final del archivo.

Sales tracking code
<span
  class="clerk"
  data-api="log/sale"
  data-sale="{$page.orderId}"
  data-email="{$orderCustomer->Email}"
  data-customer="{$user->Id}"
  data-products='[{$products}]'>
</span>

Sincronizar datos #

Sincronizar datos conecta tu tienda SmartWeb Classic con Clerk, permitiendo que Clerk acceda a tus productos, pedidos, clientes y otra información de la tienda. Esto permite que Clerk proporcione recomendaciones personalizadas y resultados de búsqueda basados en los datos reales de tu tienda. Sigue los pasos en la guía de Sync Data para configurar la sincronización de datos.

Añadiendo Clerk.js #

  1. Haz clic en el icono de Settings en el menú lateral de tu tienda y luego en Tracking Code.
Settings tracking code
  1. Copia el Tracking Script
Tracking script

  1. Inserta este código en el archivo que genera todas las páginas.

    Normalmente esto es Kontrolpanel->Design Manager-> Rediger filer->index.tpl

Index template file
  1. Haz clic en Gem en la parte superior de la página para guardar los cambios.

Seguimiento de pedidos #

  1. En el Admin de SmartWeb Classic, ve a Modules → Checkout → checkout-approved.tpl

  2. Inserta el siguiente código de Sales-Tracking al final del archivo, justo antes de la etiqueta de cierre </div>.

   {% raw %}{if !empty($page.orderId)}
    {entity controller=order assign=order id=$page.orderId userId=false statusId=false}

    {* Order Customer entity *}
    {entity controller=orderCustomer assign=orderCustomer orderId=$page.orderId}

    {* Order Lines collection *}
    {collection controller=orderLine assign=orderLines orderId=$page.orderId repay=false}

    {* Group order collection by class *}
    {$orderList = $orderLines->groupByClass()}

    {assign var=products value=''}

    {if $orderLines->getActualSize() gt 0}
        {if isset($orderList['CollectionOrderLine'])}
            {foreach $orderList.CollectionOrderLine as $orderLine}
                {$products = $products|cat:{ldelim}|cat:' "id": '|cat:$orderLine->ProductId|cat:', "quantity": '|cat:$orderLine->Amount|cat:', "price": '|cat:$orderLine->Price|cat:{rdelim}}

                {if !$orderLine@last}
                    {$products = $products|cat:', '}
                {/if}
            {/foreach}
        {/if}
    {/if}

    <span
        class="clerk"
        data-api="log/sale"
        data-sale="{$page.orderId}"
        data-email="{$orderCustomer->Email}"
        data-customer="{$user->Id}"
        data-products='[{$products}]'>
    </span>
   {/if}{% endraw %}
Order tracking code
  1. Haz clic en Gem para guardar los cambios.

Múltiples sitios #

Clerk puede integrarse fácilmente en varios Sites que comparten el mismo backend de SmartWeb Classic / Hostedshop.

La manera más sencilla de implementar Clerk en múltiples Sites en instalaciones estándar es creando una Store separada para cada Site en my.clerk.io.

De esta manera, puedes separar productos, ventas, monedas, etc. para hacer el seguimiento de cada Site.

  1. Comienza creando tu main Store y sigue la Setup Guide para conectar tu Store a Clerk y elegir las Recommendations y/o Search Results que quieres mostrar en tu webshop.

  2. 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", la última opción de la lista desplegable (generalmente bajo las store(s) existentes y el nombre de tu empresa):

Add new store dropdown
  1. En la Add New Store page, haz clic en Advanced para ver todas las configuraciones.
Advanced settings
  1. Rellena los datos de tu webshop y elige tu main Store del desplegable Copy Elements From Existing Store, luego haz clic en Add Store.

Esto transferirá los Elements y Designs de tu main Store.

Copy content from existing store
  1. Ahora puedes seguir de nuevo la Setup Guide, para activar Clerk haciendo clic en Getting Started, para Sync Data para el nuevo sitio.
Getting started page

  1. En el backend de SmartWeb Classic, cambia al Site que quieres configurar.

  2. Esto te permitirá activar Clerk en el Site a través de la Setup Guide en my.clerk.io.

  3. Cuando el Data Sync termine, tu Site estará listo y usando la misma configuración que tu main Store.

Recuerda traducir los Headlines, en Element-> Edit -> Select Design al idioma correcto también.

Puedes seguir este proceso para todos los sitios donde quieras usar Clerk.

Esta página ha sido traducida por una IA útil, por lo que puede contener errores de idioma. Muchas gracias por su comprensión.