FAQ

¿Tienes problemas con tu integración de BigCommerce? Este FAQ cubre los problemas más comunes y sus soluciones, desde precios de grupos de clientes hasta formatters.

Uso de formatters #

Clerk.js te permite escribir funciones personalizadas de JavaScript que añaden nueva funcionalidad a tus Designs.

Los formatters se pueden añadir de dos maneras:

• A través de my.clerk.io > Developers > Formatters, donde cada Formatter puede ser creado como entradas separadas.

• Como una configuración para Clerk.js, en el tracking-script que se inserta en todas las páginas, donde se pueden añadir múltiples formatters a la vez.

Ejemplo de formatter #

Se puede ver un ejemplo a continuación. Ten en cuenta que esto es Clerk V2 (versión más reciente):

Clerk('config', {
  key: 'O7UITkJIXqXibeQF9ONobiGGKYYKtbvh',
  formatters: {
    log_price: function(price) {
      console.log(price);
    }
  }
});

Múltiples formatters #

Puedes escribir cualquier cantidad de formatters, separados por comas, de la siguiente manera:

formatters: {
  log_price: function(price) {
    console.log(price);
  },
  calculate_discount: function(price, special_price) {
    return price - special_price;
  },
  substring: function(text) {
    var short_string = text.substring(0, 20);
    return short_string;
  }
}

Uso en diseños #

Después de crear tus formatters, puedes usarlos en Designs usando esta sintaxis:

Esto te permite crear cualquier funcionalidad en tus Designs que quieras utilizar con Clerk en tu tienda online.

Precios por grupo de clientes (Legacy) #

Esta función está en desuso y solo se puede usar si ya la tienes activada. No funciona con Search 3.0 y no será soportada en el futuro.

La configuración de los precios por grupo de clientes consta de 2 pasos:

1. Ejecuta una sincronización completa entre Clerk y BigCommerce.

2. Proporciona un contexto de precio al mostrar el contenido en la página.

Ejecutar sincronización completa #

Cuando realizas una sincronización completa entre Clerk y BigCommerce, Clerk almacenará los diferentes precios de grupos de clientes y reglas de precios que estén activos para la tienda.

Estas reglas se almacenarán por separado para cada producto y se usarán al mostrar el producto en el sitio web.

Estas reglas también solo se actualizarán cuando se ejecute una sincronización completa.

Proporcionar contexto de precio #

Al mostrar el producto en el sitio web, debes proporcionar un contexto de precio a Clerk.

Esto se puede hacer proporcionando el ID de grupo de clientes del cliente actual o proporcionando su dirección de email o ID de cliente.

El contexto de precio puede proporcionarse en los atributos HTML de la etiqueta anchor del contenido en sí, o puede proporcionarse como parte de la llamada Clerk('config', ...).

Atributos HTML #

Aquí tienes algunos ejemplos de cómo se vería este código si se proporciona en la propia etiqueta anchor:

<span
  class="clerk"
  data-template="@content-1"
  data-price_context='{"customer":{"email": "support@clerk.io"}}'
></span>

<span
  class="clerk"
  data-template="@content-2"
  data-price_context='{"customer":{"id": 12345}}'
></span>

<span
  class="clerk"
  data-template="@content-3"
  data-price_context='{"qualifiers":{"customer_group_id": 0}}'
></span>

Configuración de Clerk #

Aquí tienes un ejemplo de cómo se vería si se proporciona como parte de la llamada Clerk('config', ...):

Clerk('config', {
  price_context: {
    customer: {
      email: "support@clerk.io"
    }
  }
})

El enfoque anterior puede combinarse con otros valores predeterminados que se configuran al cargar la página:

Clerk('config', {
  key: 'YOUR_PUBLIC_KEY',
  language: 'english',
  price_context: {
    customer: {
      email: "support@clerk.io"
    }
  }
})

Inyección dinámica #

Para inyectar este contenido dinámicamente, deberías utilizar las variables disponibles en tu tema Stencil, en lugar de codificar manualmente la entrada a una dirección de email o un ID de usuario determinado.

Puedes encontrar cómo imprimir las distintas variables de cliente en el tema a continuación:

Customer Object BigCommerce

Aquí tienes un ejemplo de cómo podrías usar el objeto customer en tu tema para establecer dinámicamente el contexto de precio:

<span
  class="clerk"
  data-template="@content-1"
  data-price_context='{"customer":{"email": "{{ customer.email }}"} }'
></span>