Terral — Documentación

Tema de Shopify para tiendas de café, té, matcha e infusiones de hierbas · Versión 1.0.0 · English version

Los nombres de ajustes en negrita son las etiquetas que ves en el editor de temas en español. Los textos entre «comillas» son los que ve el comprador.

Nota. Terral se ha desarrollado y probado en una vista previa local de temas de Shopify. La validación en una tienda Shopify real sigue pendiente. Cuando un comportamiento depende de los datos de tu tienda (metacampos, aplicaciones, ubicaciones de recogida), esta guía lo indica.

Contenido

1. Introducción
2. Instalación y elección del estilo
3. Configuración global
4. Secciones y bloques
5. Plantillas
6. Funciones del tema
7. Preguntas frecuentes y solución de problemas
8. Soporte
9. Registro de cambios

1. Introducción

Terral es un tema para tiendas que venden café, té, matcha, mezclas de hierbas y utensilios de preparación. Gira en torno a la información que importa en este sector: notas de cata, tueste, tipo de hoja, ingredientes y preparación. Incluye cinco estilos. Cada uno tiene su propia cabecera, tarjeta de producto, ficha, vista rápida, carrito y resultados de búsqueda; no es solo otra paleta.

Tipografía por estilo (encabezados / texto): Terral PT Serif / Chivo · Crema Josefin Sans / Rubik · Camellia Arapey / Nunito Sans · Chasen Space Grotesk / IBM Plex Sans · Infuse Raleway / Mulish (en el selector de fuentes de Shopify aparece como Muli).

El tema está traducido al español, inglés, francés, alemán, italiano y árabe (tienda y editor).

2. Instalación y elección del estilo

1. En el panel de Shopify, ve a Tienda online > Temas y añade Terral desde la Theme Store eligiendo el estilo que quieras.
2. Pulsa Personalizar para abrir el editor de temas. Pruébalo con tus propios productos antes de publicarlo.
3. Cuando estés conforme, publica el tema.

Qué instala cada estilo. Todos los estilos comparten el mismo código. Un estilo fija los ajustes de presentación (colores, fuentes, composición) y trae sus propias plantillas de portada, colección, producto, página de contraseña y tres plantillas de página adicionales (page.choose, page.experience, page.preparation):

Cambiar de estilo más adelante. En Configuración del tema > Diseño, Composición de inicio cambia entre Terral, Crema, Camellia, Chasen e Infuse. Esto cambia la cabecera, las tarjetas, la ficha de producto, la vista rápida, el carrito y la búsqueda de toda la tienda. No sustituye las secciones que ya tienes en tus plantillas; añádelas o quítalas en el editor.

Primeros pasos

• Crea tus menús en Contenido > Menús (por defecto, la cabecera usa main-menu y el pie usa footer).
• Elige un logotipo en la sección Cabecera.
• Revisa los cinco esquemas de color y la opción de modo oscuro (apartado 3.1).
• Añade los metacampos de producto que lee tu estilo (apartado 6.8) o déjalos vacíos: los bloques que dependen de ellos quedan ocultos.
• Sustituye los textos de demostración de cada sección de la portada por la información de tu tienda.

3. Configuración global

Abre Configuración del tema (el icono del engranaje del editor).

3.1 Colores, esquemas de color y modo oscuro

Configuración del tema > Colores

• Esquemas de color: se incluyen cinco (paper, alternate, accent, contrast, dark). Puedes editarlos o añadir más. Cada esquema tiene: Fondo, Degradado del fondo, Texto, Texto secundario, Superficie y tarjetas, Bordes y separadores, Enlaces, Acento, Texto sobre el acento, Botón principal, Texto del botón principal, Botón secundario, Texto del botón secundario, Insignia de oferta, Texto de la insignia de oferta, Contorno de foco, Fondo del campo y Texto del campo.
• Esquema de color de la página: el esquema base de la tienda.
• Modo de color: Claro, Oscuro o Según el dispositivo del visitante. En modo oscuro, todos los esquemas claros usan el Esquema de color del modo oscuro; los esquemas oscuros conservan sus colores.
• Esquema de color del modo oscuro: el esquema que se usa con el modo oscuro activo.
• Zonas: Tarjetas de producto, Carrito y vista rápida y Avisos y ventanas emergentes tienen cada una su esquema. Una zona con el esquema de la página conserva los colores de su sección.

La mayoría de las secciones tienen además su propio ajuste Esquema de color.

3.2 Tipografía

Configuración del tema > Tipografía: Encabezados y Texto de lectura, ambas de la biblioteca de fuentes de Shopify. Cada estilo trae su propia pareja (ver apartado 1).

3.3 Diseño y movimiento

Configuración del tema > Diseño

• Composición de inicio: el estilo (ver apartado 2).
• Activar movimiento: activa o desactiva las animaciones del estilo. El tema respeta además la preferencia de movimiento reducido del sistema del visitante.
• Mostrar proveedor: muestra el proveedor del producto.
• Mostrar una segunda foto del producto: usa otra imagen del mismo producto en la tarjeta, con un control manual en pantallas táctiles.
• Mostrar enlace flotante para volver arriba: aparece al desplazarse, cuando puede evitar el contenido y los controles de compra.

3.4 Cabecera y menú

Sección Cabecera (grupo de cabecera):

• Logotipo y Ancho del logotipo.
• Menú (por defecto main-menu) y Menú de cuenta.
• Mantener visible la cabecera: cabecera fija.
• Mostrar volver arriba.
• Mostrar la búsqueda en la cabecera: abre la búsqueda predictiva (apartado 6.3).
• Mostrar inicio de sesión oficial de Shop: se muestra cuando las cuentas de cliente están activadas.
• Bloque Promoción del menú: un producto o una imagen con Título, Texto de apoyo y Destino, dentro del elemento de menú indicado en Posición del menú (posición de primer nivel, empezando en 1; revísala si reordenas el menú).

Cada estilo presenta el menú a su manera: Terral como índice de libro, Crema como pizarra con pestañas detrás de una barra de pedido fija, Camellia como estante horizontal de tarjetas que avanza tarjeta a tarjeta, Chasen como bandeja a pantalla completa con mosaicos grandes, e Infuse con un índice de la A a la Z que filtra los enlaces.

3.5 Pie de página

Sección Pie de página (grupo del pie): Esquema de color, Menú (por defecto footer), Texto, Mostrar boletín y Mostrar medios de pago activados. Los selectores de idioma y país aparecen solos cuando tu tienda tiene más de un idioma o país.

Configuración del tema > Redes sociales: pega la dirección completa de cada perfil (Instagram, Facebook, Pinterest, TikTok, YouTube, X (Twitter), Vimeo, Tumblr, Snapchat). Los campos vacíos no muestran icono en el pie.

3.6 Carrito

Configuración del tema > Preferencias del carrito

• Mostrar nota del pedido.
• Ofrecer envoltorio de regalo sin coste adicional: la solicitud se guarda como atributo del pedido; no añade un producto de pago. Actívalo solo si puedes envolver sin cobrar.
• Mostrar botones de pago acelerado en el carrito (activo por defecto; los botones con marca los proporciona Shopify y conservan sus colores).
• Mostrar barra de envío gratis en el carrito e Importe para el envío gratis: indica el importe en la moneda principal de la tienda, el mismo de tu tarifa de envío gratis. La barra solo aparece cuando el cliente compra en esa moneda.

La sección de la página Carrito tiene el ajuste Esquema de color. Los colores del panel del carrito salen de la zona Carrito y vista rápida (apartado 3.1).

3.7 Búsqueda

La sección de la plantilla Búsqueda tiene Resultados por página, Mostrar filtros nativos y Carga del catálogo (ver apartado 6.4). La búsqueda de la cabecera se controla con Mostrar la búsqueda en la cabecera.

3.8 Información del producto, reservas y recogida

Configuración del tema > Información del producto

• Mostrar muestras de color nativas (activo por defecto). En el apartado 7 se explica cómo añadir muestras.
• Mostrar existencias de la variante.
• Mostrar etiquetas nativas y editoriales de producto.
• Mostrar precios por cantidad nativos.

Configuración del tema > Reservas de producto: Mostrar información de reserva y Texto de condiciones de reserva. El texto solo aparece en variantes disponibles con inventario gestionado a cero o menos y ventas continuadas.

Configuración del tema > Horarios de recogida: hasta cuatro parejas de ID de ubicación de Shopify y Horario de apertura. El horario solo aparece en la ubicación de recogida correspondiente.

4. Secciones y bloques

Secciones que puedes añadir con Añadir sección, agrupadas por uso. Casi todas incluyen Esquema de color, Encabezado y Texto; aquí solo se citan los ajustes clave.

4.1 Secciones propias de cada estilo

Se diseñaron para un estilo concreto, pero pueden añadirse en cualquiera.

4.2 Compra y descubrimiento

4.3 Contenido editorial

4.4 Secciones de toda la tienda

Forman parte del diseño general del tema y se muestran en todas las páginas cuando están activadas.

Cambia el Identificador de campaña cuando cambien el mensaje o la edad mínima, para que los visitantes vuelvan a verlo.

4.5 Bloques de la ficha de producto

La sección Producto (plantilla de producto) tiene Mostrar pago acelerado, Mostrar información en pestañas, Mostrar recogida de la variante y Mostrar compra persistente después de la ficha. Bloques:

La mayoría de los bloques editoriales tienen el campo Producto asociado: el bloque solo se muestra en la ficha de ese producto, así que una única plantilla de producto sirve para todo el catálogo. Déjalo vacío para ocultar el bloque.

5. Plantillas

Encabezados de grupo (Terral y Crema) separa los productos por tipo cuando la colección está ordenada por tipo o los grupos son largos; si un grupo tiene menos productos que Productos mínimos por grupo, o un tipo vuelve a aparecer más abajo, la página se muestra sin encabezados.

6. Funciones del tema

6.1 Vista rápida

Las tarjetas de producto abren una vista rápida con opciones, precio y el formulario nativo de añadir al carrito. Cada estilo tiene la suya:

• Terral: una hoja de cata que se despliega en línea bajo la fila de la tarjeta.
• Crema: una comanda en una ventana anclada a la tarjeta.
• Camellia: una lámina a pantalla completa con una banda de compra sobre la foto.
• Chasen: la tarjeta se voltea y el reverso lleva las opciones y el botón de añadir.
• Infuse: una hoja de media altura que cae desde la cabecera.

Sus colores siguen la zona Carrito y vista rápida (apartado 3.1).

6.2 Estudio de selección (elector y comparador de productos)

La sección Estudio de selección guía al comprador con dos preguntas (Primera pregunta y Segunda pregunta, cada una con respuestas A y B). Cada bloque Producto fija Coincidencia de primera respuesta y Coincidencia de segunda respuesta (Cualquier respuesta, Respuesta A, Respuesta B), además de Perfil editorial, Método de preparación, Descripción de formato, Compatibilidad documentada y un Accesorio asociado opcional.

El comprador puede comparar hasta tres productos en una tabla y añadir varios a la vez, cada uno con su variante elegida. Si rellenas Nombre del campo de mensaje, se añade a la línea del pedido un mensaje personal opcional. Sin JavaScript, la sección muestra todos los productos para elegirlos uno a uno.

6.3 Búsqueda predictiva

Al escribir en el buscador de la cabecera aparecen sugerencias de productos, artículos y páginas, con navegación por teclado. Cada estilo organiza los resultados a su manera (por ejemplo, Terral en dos columnas de lotes y guías de preparación, e Infuse en mezclas, plantas y notas).

6.4 Filtros, orden y carga del catálogo

Las páginas de colección y de búsqueda usan los filtros y el orden nativos de Shopify (Mostrar filtros nativos). Configura los filtros con la aplicación Search & Discovery de Shopify. Carga del catálogo ofrece Enlaces de página nativos, Continuación manual (un botón «Más resultados») o Continuación automática acotada (carga hasta dos páginas más de forma automática y después muestra el botón). Los enlaces de página siguen disponibles en todos los modos.

6.5 Laboratorio de preparación

Cada bloque Preparación lleva Producto, Producto por porción (g), Agua por porción (ml), Temperatura del agua (°C) y Preparación (segundos). El comprador elige el número de porciones y ve las cantidades. Si indicas Peso del envase (g) (y, en productos con varias variantes, el Nombre exacto de la variante), se muestra el coste por porción; con cero, el coste se omite.

6.6 Vídeo comprable

Sube un Vídeo de Shopify y añade bloques Capítulo y producto con Inicio del capítulo (segundos) y un Producto. Los productos pueden añadirse desde los capítulos del vídeo. Añade una Descripción y transcripción del vídeo por accesibilidad.

6.7 Carrito por estilo

Todos los carritos admiten la nota del pedido, la solicitud de envoltorio de regalo, la barra de envío gratis y el pago acelerado según los ajustes de Preferencias del carrito. Las fichas de producto admiten productos con suscripción (planes de venta) y los datos del destinatario de tarjetas regalo.

6.8 Metacampos de producto que lee el tema

Todos son opcionales. Si un metacampo está vacío, el elemento relacionado se oculta o el tema usa el tipo de producto.

6.9 Otras funciones

• Medios del producto: imágenes, vídeos de Shopify, vídeos externos y modelos 3D, con zoom de foto.
• Disponibilidad de recogida por variante, con horario opcional (apartado 3.8).
• Títulos largos de producto: se recortan en tarjetas y menús (el título completo aparece al pasar el ratón y para lectores de pantalla) y se muestran enteros en la vista rápida y en la ficha.
• Árabe: traducción con composición de derecha a izquierda.

7. Preguntas frecuentes y solución de problemas

He cambiado de estilo, pero las secciones de la portada siguen igual. El ajuste Composición de inicio cambia el aspecto y el comportamiento de la tienda, no las secciones de tus plantillas. Añade, quita o reordena secciones en el editor.

La barra de envío gratis no aparece. Comprueba que Mostrar barra de envío gratis en el carrito está activado, que Importe para el envío gratis es mayor que cero y está en tu moneda principal, que el carrito no está vacío y que el comprador usa tu moneda principal.

¿Cómo añado muestras de color? Abre un producto en el panel de Shopify, vincula la opción de variante a un metacampo de categoría como Color y define un color o una imagen para cada valor en Contenido > Metaobjetos. Para los filtros, elige la visualización Muestra en la aplicación Search & Discovery. Desactiva Mostrar muestras de color nativas para mostrar solo el nombre de cada opción.

El Libro de lotes o la Escala de infusión no muestran nada. El Libro de lotes (por colección) con Mostrar solo productos con notas de cata activado necesita custom.tasting_notes. La Escala de infusión necesita los metacampos de preparación (apartado 6.8).

Las plantas del Glosario de plantas no enlazan con productos. El tema busca la Palabra que se busca de cada planta (o su Nombre) en el metacampo custom.ingredients de cada producto de la Colección elegida.

Las solicitudes de aviso de reposición no envían nada. El tema no envía avisos por sí mismo. El bloque Avisos de disponibilidad necesita un proveedor de avisos compatible: configura Conexión de avisos, Nombre del proveedor, Ruta de solicitud del proveedor (una ruta /apps/) y Enlace de privacidad del proveedor.

No aparece la cuenta atrás del Banner de campaña.Fecha y hora de cierre debe ser una fecha ISO 8601 completa con zona horaria, por ejemplo 2026-12-31T23:59:00-05:00.

La ventana de promoción o la declaración de edad no vuelven a mostrarse. Cambia su Identificador de campaña. Los visitantes que cerraron la anterior verán la nueva.

No se muestra el horario de recogida. El ID de ubicación de Shopify debe coincidir exactamente con una ubicación que tenga la recogida en tienda activada.

No veo un bloque que tiene Producto asociado. Los bloques con Producto asociado solo aparecen en la ficha de ese producto. Comprueba que has elegido el producto correcto.

Las animaciones distraen. Desactiva Activar movimiento. Los visitantes que prefieren movimiento reducido en su dispositivo ya reciben una versión más tranquila.

8. Soporte

Respondemos en un plazo de 24 horas. El soporte se mantiene mientras el tema esté a la venta.

La documentación y el soporte de Terral se publican en lizardassets.com. Para hacer una consulta o informar de un problema, usa la página de soporte: https://lizardassets.com/pages/soporte. Esta guía se publica en https://lizardassets.com/pages/terral-docs.

Para que podamos responder antes, incluye:

• la URL de tu tienda (y un enlace de vista previa del tema si no está publicado);
• el estilo que usas (Terral, Crema, Camellia, Chasen o Infuse) y la versión del tema;
• la página y la sección afectadas, los pasos para reproducir el problema y una captura;
• el dispositivo y el navegador.

El soporte cubre los ajustes, secciones, plantillas y funciones del tema descritos en esta guía, y los errores del tema. Los cambios que hagas en el código del tema y el comportamiento de aplicaciones de terceros quedan fuera del tema.

9. Registro de cambios

1.0.0

Primera versión pública.

• Cinco estilos: Terral, Crema, Camellia, Chasen e Infuse, cada uno con su propia cabecera y menú, tarjeta de producto, ficha, vista rápida, carrito y resultados de búsqueda.
• Esquemas de color con 17 funciones de color más un degradado de fondo opcional, modo oscuro (claro, oscuro o según el dispositivo del visitante) y esquemas propios para tarjetas de producto, carrito y vista rápida, y avisos.
• Búsqueda predictiva, filtros y orden nativos, y tres modos de carga del catálogo.
• Estudio de selección con preguntas guiadas, comparación de hasta tres productos y compra conjunta; laboratorio de preparación; vídeo comprable; lista de pedido rápido.
• Secciones propias para café, té, matcha e infusiones de hierbas.
• Opciones de carrito: nota del pedido, solicitud de envoltorio de regalo gratuito, barra de envío gratis y pago acelerado.
• Disponibilidad de recogida con horarios, información de reservas, avisos de disponibilidad mediante un proveedor compatible, suscripciones y destinatarios de tarjetas regalo.
• Traducciones: español, inglés, francés, alemán, italiano y árabe (de derecha a izquierda).
• Probado en una vista previa local; la validación en una tienda Shopify real está pendiente.