Get Started

Pon Clerk en funcionamiento en tu tienda Lightspeed en solo unos pocos pasos. Esta guía te guía a través de la conexión de tu tienda, la instalación de scripts de seguimiento y la sincronización de tus datos.

Conectando tu tienda #

Después de seguir estos sencillos pasos podrás ver tu Live Demo, que te da una visión personal de cómo funcionará Clerk en tu tienda online, 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:

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

2. Elige Lightspeed como Platform y selecciona tu Currency.

3. Haz clic en Add Store.

Instalar scripts de seguimiento #

El script de seguimiento de Clerk utiliza variables Lightspeed Liquid para leer datos de la tienda como la moneda y el contexto del producto. Debido a esto, el script debe colocarse en un archivo de tema donde se procese Liquid.

Seguimiento de visitantes #

1. En el backend de tu Lightspeed, ve a Design > Theme Editor > Advanced > Edit Code.

2. Abre layouts > custom.rain.

3. Pega el siguiente script al final del archivo y reemplaza INSERT_PUBLIC_API_KEY con tu Public Key de my.clerk.io > Developers > API Keys.

<!-- Clerk.io Visitor Tracking (Lightspeed) -->
<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',
    formatters: {
      convert_currency: function(price) {
        const rate_raw = '{{ 100 | money }}'.replace(/[^0-9.]/g, '');
        const rate = parseFloat(rate_raw) ? (parseFloat(rate_raw) / 100) : 1;
        return rate * price;
      }
    },
    globals: {
      currency_iso: '{{ shop.currency2.code }}',
      currency_symbol: '{{ shop.currency2.symbol }}'
    }
  });
  // Clerk.js Context
  Clerk('context', {
    product: {% if product.id %}'{{ product.id }}'{% else %}null{% endif %},
    category: {% if collection.category_id %}'{{ collection.category_id }}'{% else %}null{% endif %},
    page: {% if product.id %}null{% else %}{% if collection.category_id %}null{% else %}'{{ template }}'{% endif %}{% endif %}
  });

  {% if page.account.email %}
  Clerk('call', 'log/email', { email: '{{ page.account.email }}' });
  {% endif %}
</script>

4. Haz clic en Save.

Seguimiento de pedidos #

1. En el backend de tu Lightspeed, ve a Settings > Website-Settings > Web Extras.

2. Encuentra la caja de Tracking e inserta el código de seguimiento de pedidos de Clerk.

<span
  class="clerk"
  data-api="log/sale"
  data-sale="{{ order.information.number }}"
  data-email="{{ order.customer.email }}"
  data-customer="{{ order.customer.id }}"
  data-products='[{% for product in order.products %}{"id":{{ product.product_id }},"quantity":{{ product.quantity }},"price":{{ product.base_price_incl }}}{% if not loop.last %},{% endif %}{% endfor %}]'>
</span>

3. Haz clic en Save.

Sincronizar datos #

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