Opciones
General #
Contenido del sitio web facilita el trabajo con Recomendaciones y Resultados de búsqueda.
Los Diseños se almacenan en Clerk.io, y solo necesitas insertar un pequeño código de inserción en la página donde deseas que se muestren los productos. Esto se puede hacer utilizando la sección de Código incrustado o la sección de Inyección.
Cualquier número de bloques de contenido puede basarse en un solo diseño, o puedes crear diseños separados para cada contenido.
Puedes revisar tu contenido existente y crear nuevos haciendo clic en Buscar/Recomendaciones y luego en Contenido en el menú lateral:
Cada bloque de contenido único está controlado por su propia configuración. Puedes elegir un nombre único para todos los bloques de contenido, que también funcionará como su etiqueta de seguimiento.
La página de Configuraciones de cada bloque de contenido está dividida en cuatro secciones a las que puedes acceder haciendo clic en Editar Contenido.
Nombra tu contenido #
Controla el Nombre y las Etiquetas de seguimiento para el bloque de contenido.
Elige la lógica del producto #
Define qué tipo de productos deben mostrarse en el contenido.
También puedes controlar si se deben aplicar Filtros, si, por ejemplo, solo deseas mostrar productos por encima o por debajo de cierto precio, o de una marca específica.
Selecciona diseño #
Esto te permite elegir cuántos productos mostrar y qué diseño utilizar como base para el contenido. Si tienes una variable de título/titular en tu diseño, puedes agregar los títulos que se mostrarán para el contenido aquí también.
Insertar en el sitio web #
Los bloques de contenido están adjuntos a un código de inserción que les permite ser renderizados en todas las páginas donde hayas insertado Clerk.js. Puedes simplemente insertar el código de inserción donde deseas que se muestre este contenido o utilizar nuestra función de inyección.
Ten en cuenta que los códigos de inserción pueden necesitar variables como ID de productos, ID de categorías o correo electrónico, dependiendo de la lógica.
Usando código incrustado #
El código incrustado es un pequeño fragmento de código que puedes insertar en tu sitio web. Se puede encontrar seleccionando Usando código incrustado:
Usando inyección #
La inyección es una función que te permite insertar bloques de contenido en tu sitio web sin tener que agregar el código de inserción manualmente. Se realiza seleccionando Usando inyección:
A continuación se describe las diferentes opciones de inyección:
| Opción | Descripción |
|---|---|
| Selector CSS único para identificarlo | Inserta un selector CSS único que identificará el bloque de contenido en la página. También elige dónde debe ser inyectado; Después, Antes, Dentro o Reemplazar. |
| Excluir Duplicados | Elige si deseas excluir productos que ya se muestran en otros bloques de contenido de Clerk en la misma página. |
| ID de categoría, ID de producto, Selector CSS de correo electrónico | Si la lógica está configurada para mostrar productos de una categoría específica, producto o dirección de correo electrónico, puedes insertar el selector CSS de la categoría, producto o ID de correo aquí. |
| Atributo de categoría, producto, correo electrónico | Si la lógica está configurada para mostrar productos de una categoría específica, producto o para una dirección de correo electrónico específica, puedes insertar el atributo que contiene el valor de la categoría, producto o correo aquí. Por ejemplo, si el atributo es value-category="category-123", insertarías "value-category" en este campo. |
| Extraer ID de categoría, ID de producto, ID de correo del atributo eliminando la cadena | Si el atributo que contiene el valor de la categoría, producto o dirección de correo es parte de una cadena más larga, puedes insertar la parte que debe ser eliminada aquí. Por ejemplo, si el atributo es value="category-123" y deseas extraer el ID, insertarías "category-" en este campo. |
Titulares #
Gestionar titulares es fácil con la configuración estándar en Contenido.
En la página de Editar Contenido, haz clic en Seleccionar Diseño para ver el campo de entrada de Titular:
Cambia el texto en el cuadro de Titular y haz clic en Guardar.
El cambio se mostrará inmediatamente después de que actualices tu tienda en línea.
Etiquetas de campo de texto dinámico #
Nuestros diseños estándar utilizan etiquetas para establecer diferentes titulares para cada contenido.
Estas etiquetas pueden usarse en cualquier campo de texto en los diseños de Editor de Diseño, y en cualquier lugar en los diseños de código.
Las etiquetas tienen la sintaxis {{ variable }} y pueden tener cualquier nombre que elijas.
Comienza yendo a Diseños y haz clic en Editar Diseño para el que deseas cambiar:
En la página de Editar Diseño, inserta una etiqueta de titular con {{ headline }} en la Sección HTML:
Haz clic en Guardar y Cerrar y podrás escribir un Titular desde tu pestaña de Contenido.
Puedes agregar tantos campos de texto como desees, Titular es solo un ejemplo.
Cualquier cosa que escribas en la Sección HTML con la sintaxis {{ variable }} será utilizable como un campo de entrada desde Contenido.
Estas etiquetas también pueden usarse en cualquier campo de texto en un diseño de Editor de Diseño.
Eliminando productos duplicados #
Usar esta función obliga a cargar múltiples Clerk.io recomendaciones una tras otra, en lugar de al mismo tiempo, lo que agrega un peso adicional al tiempo de carga de la página.
Asegúrate de que el compromiso en el tiempo de carga valga la pena evitar los duplicados.
Clerk.js proporciona dos formas simples de prevenir duplicados en múltiples deslizadores de recomendaciones en la misma página.
Una es usar la opción Excluir Duplicados en la sección de Inyectar Contenido, seleccionando el contenido de Clerk del que deseas excluir duplicados, ya sea eligiéndolo de la lista o especificando un selector CSS:
La otra opción es agregar el atributo data-exclude-from en el bloque de Clerk del que deseas eliminar los duplicados. El valor del atributo debe ser un selector CSS para el otro bloque del que prevenir duplicados.
En el ejemplo a continuación, el deslizador .clerk2 excluye cualquier producto que esté en el deslizador .clerk1, y el deslizador .clerk3 excluye cualquier producto que esté en los deslizadores .clerk1 o .clerk2.
<span class="clerk clerk1"
data-template="@clerk-banner-1">
</span>
<span class="clerk clerk2"
data-exclude-from=".clerk1"
data-template="@clerk-banner-2">
</span>
<span class="clerk clerk3"
data-exclude-from=".clerk1,.clerk2"
data-template="@clerk-banner-3">
</span>
También puedes limitar la exclusión para mostrar solo los primeros n productos (una buena estrategia si tienes un deslizador con 20 productos pero solo cuatro son visibles al mismo tiempo).
Esto se hace a través de la opción :limit(n) (donde n es el primer número de productos que deseas excluir).
Aquí está el mismo ejemplo de arriba, pero donde el ID de exclusión solo se refiere a los primeros cinco productos.
<span class="clerk clerk1"
id="clerk1"
data-template="@clerk-banner-1">
</span>
<span class="clerk clerk2"
id="clerk2"
data-exclude-from=".clerk1:limit(5)"
data-template="@clerk-banner-2">
</span>
<span class="clerk clerk3"
id="clerk3"
data-exclude-from=".clerk1:limit(5),.clerk2:limit(5)"
data-template="@clerk-banner-3">
</span>
Excluyendo productos específicos #
Para evitar mostrar ciertos productos, simplemente agrega el atributo data-exclude a un código de inserción existente.
Esto debería ser una lista de los ID de productos que no deseas que se muestren en el bloque.
Por ejemplo:
<span class="clerk"
data-template="@clerk-complementary"
data-exclude="[45654]">
</span>
Esta página ha sido traducida por una IA útil, por lo que puede contener errores de idioma. Muchas gracias por su comprensión.