Narrative

Narrative es un tema boutique diseñado para la narración visual. Lo que hace que Narrative sea único es que se centra en las imágenes para contar una historia. La página de inicio está predeterminada para mostrar diapositivas en tamaño original, una imagen con texto y un video. Este diseño tiene un fuerte impacto visual y te permite contar la historia de tu marca sin tener que utilizar mucho texto.

Ejemplo de tienda online que usa Narrative

El tema Narrative es ideal si quieres:

  • Usar imágenes y videos para contar la historia de tu marca.
  • Enviar un mensaje claro sobre la visión, la misión o los valores de tu tienda.
  • Resaltar el diseño único de un solo producto o de unas pocas existencias.

Editor de temas

Utiliza el editor de tema para personalizar tu tema. La barra de herramientas del editor de temas está dividida en Secciones y Configuraciones de tema.

La barra de herramientas del editor de temas muestra las Secciones y la Configuración de temas

Puedes usar secciones para modificar el contenido y el diseño de las diferentes páginas en tu tienda. Puedes usar la configuración del tema para personalizar las fuentes y colores de tu tienda y hacer cambios en tus enlaces a redes sociales y configuraciones de pago.

Las secciones son bloques de contenido personalizables que determinan el diseño de las diferentes páginas en tu tienda online.

  • Cada tipo de página tiene sus propias secciones. Por ejemplo, la secciones de las páginas de productos determinan el diseño de cada página de producto en tu tienda online.

  • Las secciones de inicio incluyen funciones, como una presentación de diapositivas o el registro a un boletín, que puedes agregar, reorganizar o eliminar. Puedes tener hasta 25 secciones en tu página de inicio.

  • Las secciones de página están siempre en lugares específicos en tu tienda online. Puedes personalizarlas, pero no puede reorganizarlas o eliminarlas.

  • Cada tema incluye secciones fijas, como el encabezado y el pie de página que se muestran en cada página de tu tienda online.

Puedes aprender sobre la selección única de secciones de y cómo personalizarlas para que se adapten a tu negocio.

Narrative incluye las siguientes secciones estáticas:

  • Encabezado 

  • Diapositivas
  • Pie de página
  • Páginas de productos
  • Páginas de colección
  • Página de lista de colecciones
  • Blog
  • Publicaciones
  • Página de carrito

Secciones dinámicas

Puedes agregar, reorganizar y eliminar secciones dinámicas para personalizar el diseño de tu página de inicio. Cada tema tiene un conjunto exclusivo de secciones dinámicas para elegir.

Narrative incluye las siguientes secciones dinámicas:

  • Entradas de blog

  • Lista de colecciones
  • colección destacada
  • galería
  • Resaltar
  • Imagen con texto
  • Imagen con superposición de texto
  • Producto destacado
  • Boletín
  • Mapa
  • Texto enriquecido
  • Testimonios
  • Video
  • Contenido personalizado
  • Carrusel de imágenes destacadas

Encabezado

La sección del encabezado incluye el contenido que aparece en la parte superior de cada página de tu tienda. Narrative te permite seleccionar dos menús de navegación a los que lo clientes pueden acceder haciendo clic en un icono de navegación:

Asimismo, puedes cambiar la apariencia del encabezado de tu tienda haciéndolo transparente, lo que significa que usaría el mismo fondo que la sección que está debajo de él.

Para personalizar la sección del encabezado:

  1. Haz clic en la pestaña Secciones.

  2. Haz clic en la sección del Encabezado.

  3. En el área del Logotipo, haz clic en Seleccionar imagen y luego realiza una de las siguientes acciones:

- Para seleccionar una imagen que ya has subido a tu panel de control de Shopify, haz clic en la pestaña Biblioteca. - Para seleccionar una imagen de la Colección de imágenes de Burst de Shopify, haz clic en la pestaña Imágenes gratuitas. Desde aquí puede introducir un término de búsqueda o explorar las categorías de imágenes. - Para seleccionar una imagen desde tu computadora, haz clic en la pestaña Biblioteca, y luego haz clic en el botón del signo "más".

  1. En el campo Altura del logotipo personalizado, inserta la altura de tu logotipo en pixeles.

  2. A partir de la lista de Iconos de carritos de compra, escoge si deseas mostrar un logotipo de bolsa o de carrito en tu encabezado.

  3. Si deseas que el encabezado de tu tienda sea transparente, sigue las siguientes indicaciones:

    1. Haz clic en Habilitar encabezado transparente en la página de inicio.
    2. Selecciona una imagen para mostrar encima del fondo transparente. Quizás debas seleccionar un logotipo diferente al que seleccionaste para tu página de encabezado. Por ejemplo, quizás necesites mostrar un logotipo blanco encima de un fondo más oscuro.
    3. Haz clic en la paleta de Colores de iconos de encabezado transparente para seleccionar un color para el logotipo y los iconos de navegación y de carrito.
  4. En la lista de Navegación primaria, selecciona el menú principal que se mostrará cuando un cliente haz clic en el icono de navegación:

  5. En la lista de Navegación secundaria, selecciona el menú secundario:

  6. Haz clic en Guardar.

Diapositivas

En la parte superior de la página de inicio de Narrative hay un carrusel en pantalla completa en el que tus clientes pueden hacer clic para navegar en una serie de imágenes y videos. Lo mejor es usar imágenes de gran tamaño. Por ejemplo, usa imágenes de 4000 x 2200 px o más grandes, siempre y cuando no excedas los límites de carga de Shopify. Puedes determinar cómo aparecerán los botones y el texto en el carrusel, y puedes agregar hasta 5 imágenes o videos para mostrar.

Narrative muestra botones en la parte inferior del carrusel, para persuadir a tus clientes para que hagan clic en el carrusel. Puedes proponer tu propia etiqueta en estos botones y un título para cada diapositiva.

Para agregar un carrusel:

  1. Haz clic en Secciones.

  2. Haz clic en Presentación.

  3. En el área Imagen, haz clic en Seleccionar imagen y luego realiza una de las siguientes acciones:

- Para seleccionar una imagen que ya has subido a tu panel de control de Shopify, haz clic en la pestaña Biblioteca. - Para seleccionar una imagen de la Colección de imágenes de Burst de Shopify, haz clic en la pestaña Imágenes gratuitas. Desde aquí puedes ingresar un término de búsqueda o explorar las categorías de imágenes. - Para seleccionar una imagen de tu ordenador, haz clic en la pestaña Biblioteca, y luego haz clic en Subir imagen.

  1. En el campo de Etiquetas de botones, inserta el texto que desees que aparezca en los botones del carrusel.

  2. Para mostrar una capa que aplique un filtro de color al carrusel, marca Mostrar capa.

  3. Selecciona un Color de capa y un Color de texto haciendo clic en la gama de colores.

  4. Selecciona a partir de la lista Opacidad el nivel de transparencia que deseas para la capa de color.

Para agregar una imagen de diapositiva:

  1. Haz clic en Agregar contenido en la sección de Contenido.

  2. Haz clic en Diapositiva de image.

  3. En el área Imagen, haz clic en Seleccionar imagen y luego realiza una de las siguientes acciones:

- Para seleccionar una imagen que ya has subido a tu panel de control de Shopify, haz clic en la pestaña Biblioteca. - Para seleccionar una imagen de la Colección de imágenes de Burst de Shopify, haz clic en la pestaña Imágenes gratuitas. Desde aquí puede introducir un término de búsqueda o explorar las categorías de imágenes. - Para seleccionar una imagen desde tu computador, haz clic en la pestaña Biblioteca y luego haz clic en el botón del signo "más".

  1. Escoge la manera como quieres alinear la imagen en el carrusel seleccionando una posición a partir de la lista Alineación de imagen.

  2. Introduce un nuevo título para esta diapositiva en el campo Encabezado. El título aparece sobre la imagen de la diapositiva.

  3. En el campo Título de diapositiva, inserta el texto para el título de la diapositiva que aparecerá en la parte inferior del carrusel.

  4. Para agregar un enlace al botón de tu diapositiva, realiza una de las siguientes acciones:

- Para vincularlo a una página en tu tienda, haz clic en el campo Enlace del botón y selecciona una página. - Para vincular el texto del encabezado a una URL, pega la URL en el campo Enlace del botón.

  1. Haz clic en Guardar.

Para agregar una diapositiva de video:

  1. Haz clic en Agregar contenido en la sección de Contenido.

  2. Selecciona Diapositiva de video.

  3. En el campo Enlace de video, inserta la dirección URL del video.

  4. Para subir una imagen que aparecerá en lugar del video si la reproducción automática no es compatible con un dispositivo móvil en el área Imagen, haz clic en Seleccionar imagen y luego realiza una de las siguientes acciones:

- Para seleccionar una imagen que ya has subido a tu panel de control de Shopify, haz clic en la pestaña Biblioteca. - Para seleccionar una imagen de la Colección de imágenes de Burst de Shopify, haz clic en la pestaña Imágenes gratuitas. Desde aquí puede introducir un término de búsqueda o explorar las categorías de imágenes. - Para seleccionar una imagen desde tu computadora, haz clic en la pestaña Biblioteca, y luego haz clic en el botón del signo "más".

  1. En el campo Encabezado, inserta el texto que desees que aparezca superpuesto al video. El encabezado se actualizará con el encabezado que propongas.

  2. En el campo Título de diapositiva, inserta el texto para el título de la diapositiva que aparecerá en la parte inferior del carrusel.

  3. Para agregar un enlace al botón de tu diapositiva, realiza una de las siguientes acciones:

- Para vincularlo a una página en tu tienda, haz clic en el campo Enlace del botón y selecciona una página. - Para vincular el texto del encabezado a una URL, pega la URL en el campo Enlace del botón. - Haz clic en Guardar.

Pie de página

En la sección del pie de página, puedes editar el contenido que aparece en la parte inferior de cada página de la tienda. Puedes agregar lo siguiente al pie de página:

La sección del pie de página de un sitio web que muestra un menú, la suscripción a un boletín, texto de derechos de autor e iconos de pago.

Para personalizar la sección del pie de página:

  1. Ubica Narrative y haz clic en Personalizar.

  2. Haz clic en Secciones.

  3. Haz clic en Pie de página.

  4. Agrega iconos de redes sociales al pie de página; para ello, marca Mostrar iconos de redes sociales. Puedes enlazar los iconos con tus cuentas de redes sociales desde la configuración de Redes sociales.

  5. Puedes agregar iconos de pago, como el de Mastercard o PayPal, al pie de página si marcas Mostrar iconos de pago.

  6. Para agregar la opción de suscripción a un boletín al pie de página, realiza los siguientes pasos:

    1. Marca Mostrar suscripción al boletín.
    2. Introduce un título para la suscripción al boletín en el campo Título. El texto predeterminado es "Regístrate para recibir actualizaciones".
    3. Introduce un subtítulo para la suscripción al boletín en el campo Subtítulo. El texto predeterminado es "Promociones, nuevos productos y ventas. Directamente a tu bandeja de entrada".
  7. Para agregar un menú al pie de página, realiza los siguientes pasos:

    1. Haz clic en Agregar menú.
    2. Para editar el menú predeterminado, haz clic en Editar menú. Para cambiar a un menú diferente, haz clic en Cambiar y, luego, selecciona un menú existente o haz clic en Crear menú.
  8. Haz clic en Guardar.

Páginas de productos

En la sección Páginas de productos, puedes agregar o eliminar los elementos siguientes:

  • Selector de cantidad
  • Etiquetas de variantes
  • La marca del producto o el proveedor
  • Imágenes de variantes
  • Botón de pago dinámico
  • Botones de redes sociales

Para editar la configuración de las páginas de productos:

  1. En el menú desplegable de la barra superior, selecciona Páginas de productos.

  2. Haz clic en Secciones.

  3. Haz clic en Páginas de productos.

  4. Para mostrar un selector de cantidad, marca Mostrar selector de cantidad.

  5. Para mostrar etiquetas de variantes, como "Tamaño" y "Color", marca Mostrar etiquetas de variantes. Las etiquetas variantes que se muestran se basan en los nombres de opciones de las variantes del producto.

  6. Para mostrar la marca o el proveedor del producto, marca Mostrar proveedor del producto. Para que se muestre una marca o un proveedor, debes agregar un proveedor al producto.

  7. Para evitar que las imágenes de variantes se muestren en la galería en la parte inferior de la página, marca la casilla Ocultar imágenes de variantes en la galería. Al hacer esto, las únicas imágenes que se muestran son las que no están asociadas a una variante.

  8. Para mostrar un botón de pago dinámico, marca la casilla Mostrar botón de pago dinámico.

  9. Para mostrar los botones de redes sociales, marca la casilla Mostrar botones de redes sociales.

  10. Haz clic en Guardar.

Páginas de colección

Puedes configurar tus páginas de colección para permitir que tus clientes filtren y clasifiquen los productos de la colección. También puedes elegir cuántos productos mostrar.

Para establecer el diseño de tus páginas de colección:

  1. Navega a una página de colección en el editor de temas.

  2. Haz clic en la pestaña Secciones.

  3. Haz clic en Páginas de colección.

  4. En las listas, selecciona la cantidad de productos por fila y el número de filas por página.

  5. Si vendes productos de diferentes marcas o proveedores, marca Mostrar proveedor de productos para mostrar el nombre del proveedor debajo de la imagen del producto.

  6. Si quieres mostrar una imagen de la colección en la parte superior de la página, marca Mostrar imagen de colección.

  7. Marca Habilitar filtro de etiquetas para permitir que tus clientes filtren la colección por etiqueta de producto.

  8. Marca Habilitar clasificación de colecciones para mostrar un menú de clasificación.

  9. Haz clic en Guardar.

Página de carrito

Puedes permitir que los clientes agreguen una nota a su pedido. Los clientes pueden utilizar notas de carrito de compras para dar instrucciones especiales acerca de cómo preparar o enviar un pedido:

Un campo de texto con la etiqueta

Cuando un cliente escribe una nota, aparece en el área de Notas de su pedido en tu panel de control de Shopify.

Para agregar un campo de notas en la página del carrito, haz lo siguiente:

  1. Ubica Narrative y haz clic en Personalizar.

  2. En el menú desplegable de la barra superior, selecciona Carrito.

  3. Haz clic en Secciones.

  4. Haz clic en la Página de carrito.

  5. Marca Habilitar notas de carrito.

  6. Haz clic en Guardar.

colección destacada

Puedes exhibir una colección en tu página de inicio: Destacar colecciones puede ayudarte a promover ventas y nuevas colecciones.

Para agregar una colección destacada:

  1. Haz clic en la pestaña Secciones.

  2. Haz clic en Colección destacada.

  3. A partir de la lista Colección, selecciona la colección que desees mostrar.

  4. Marca Habilitar espaciado de imagen para aumentar el espacio entra las imágenes.

  5. En el campo Encabezado, inserta el texto que desees que aparezca en la parte superior de esta sección. El texto predeterminado es "Colección destacada".

  6. Si deseas mostrar el proveedor o la marca debajo de la foto de cada producto, marca Mostrar proveedores de productos.

  7. Si deseas que los clientes vean todos los productos de la colección, marca Mostrar botón "Ver todo". Cuando un cliente haz clic en este botón, la página de colección se abrirá mostrando todos los productos.

  8. Si deseas que el botón Ver todo sea transparente con un contorno intenso, marca Usar estilo de botón secundario.

  9. A partir de la lista Productos por fila, selecciona cuántos productos mostrar en cada fila.

  10. A partir de la lista Filas, selecciona cuántas líneas de productos mostrar.

  11. Haz clic en Guardar.

galería

La sección Galería es una serie de hasta 3 imágenes. Puedes seleccionar un icono a partir de una lista de 13 iconos personalizados para mostrar sobre cada imagen. Puedes eventualmente vincular cada imagen a una URL o a una página de tu tienda:

Sección Galería con tres imágenes contiguas de gatos.

  1. Haz clic en la pestaña Secciones.

  2. Haz clic en Galería.

  3. En el área de Contenido, haz clic en Imagen.

  4. Para agregar la imagen, haz clic en Seleccionar imagen en el área Imagen y luego realiza una de las siguientes acciones:

- Para seleccionar una imagen que ya has subido a tu panel de control de Shopify, haz clic en la pestaña Biblioteca. - Para seleccionar una imagen de la Colección de imágenes de Burst de Shopify, haz clic en la pestaña Imágenes gratuitas. Desde aquí puede introducir un término de búsqueda o explorar las categorías de imágenes. - Para seleccionar una imagen desde tu computadora, haz clic en la pestaña Biblioteca, y luego haz clic en el botón del signo "más".

  1. Selecciona la manera como quieres alinear la imagen a partir de la lista Alineación de imagen. Por ejemplo, seleccionar "Izquierdo superior" coloca la imagen en la parte superior izquierda del área de la sección.

  2. Selecciona un ícono a partir de la lista de Íconos para mostrar sobre la image.

  3. En el área de Texto, escribe el texto que desees que aparezca en cada imagen en el campo Leyenda.

  4. Si deseas que el texto de la leyenda se vincula a una página, realiza una de las siguientes acciones:

    1. Para vincular el texto a una página de tu tienda, haz clic en el campo Enlace y selecciona una página de tu tienda.
    2. Para vincular el texto a una página web, inserta la URL de la página en el campo Enlace.
  5. Haz clic en Guardar.

Imagen con texto

Narrativa incluye una sección Imagen con texto que te permite mostrar una imagen con un mensaje personalizado a tus clientes.

Puedes recortar la imagen en forma de círculo:

o de cuadrado:

También puedes optar por no recortar la imagen. En lugar de ello, puedes seleccionar una alineación de imagen para asegurarte de que las partes importantes de la imagen no queden recortadas cuando se visualice desde dispositivos móviles. Por ejemplo, si no quieres que la parte inferior de tu imagen se recorte porque muestra el producto que estás vendiendo, puedes seleccionar la alineación Bottom center para asegurarte de que esa parte de la imagen no se recorte.

  1. Haz clic en la pestaña Secciones.

  2. Haz clic en Imagen con texto.

  3. A partir de la lista Espaciado de sección, selecciona el tamaño de esta sección entre Pequeño, Mediano, Grande o Extra grande.

  4. Si deseas agregar un color de fondo, haz clic en la muestra de Color de fondo y selecciona un color en la paleta.

  5. Para agregar la imagen, haz clic en Seleccionar imagen en el área Imagen y luego realiza una de las siguientes acciones:

- Para seleccionar una imagen que ya has subido a tu panel de control de Shopify, haz clic en la pestaña Biblioteca. - Para seleccionar una imagen de la Colección de imágenes de Burst de Shopify, haz clic en la pestaña Imágenes gratuitas. Desde aquí puede introducir un término de búsqueda o explorar las categorías de imágenes. - Para seleccionar una imagen desde tu computadora, haz clic en la pestaña Biblioteca, y luego haz clic en el botón del signo "más".

  1. Si deseas recortar imágenes de una forma dada, selecciona Círculo o Cuadrado en la lista Recorte de imagen.

  2. Si no deseas recortar imágenes de una forma dada, sigue las siguientes indicaciones:

    1. Selecciona Ninguno en la lista Recorte de imagen.
    2. Selecciona la manera como quieres alinear la imagen a partir de la lista Alineación de imagen. Por ejemplo, seleccionar "Izquierdo superior" coloca la imagen en la parte superior izquierda del área de la sección.
  3. Para agregar el texto sigue las siguientes indicaciones:

    1. En el campo Encabezado, escribe el texto de encabezado que desees mostrar.
    2. En el campo Texto, escribe el texto que desees que aparezca debajo del encabezado.
    3. Si deseas mostrar el botón de manera transparente con un contorno intenso, marca Usar estilo de botón secundario.
    4. En el campo Texto del botón, inserta el texto que desees que aparezca en el botón.
    5. En el campo Enlace del botón, pega un enlace a una URL o haz clic en el campo para seleccionar una página de tu tienda.

Para personalizar el diseño:

  1. En el área Diseño, selecciona a partir de la Lista de diseño de escritorio el lugar donde quieres que aparezca la imagen, a la derecha o a la izquierda del texto, cuando sea vista desde un escritorio.

  2. A partir de la Lista de diseño de dispositivo móvil, selecciona el lugar donde quieres que aparezca la imagen, por encima o por debajo del texto, cuando sea vista desde un dispositivo móvil.

Imagen con superposición de texto

Puedes mostrar un mensaje personalizado a tus clientes en tu página de inicio. Tu mensaje podría describir un producto, hacer un anuncio o dar la bienvenida a tu tienda.

Para personalizar la Imagen con la sección de superposición de texto:

  1. Haz clic en la pestaña Secciones.

  2. Haz clic en Imagen con superposición de texto.

  3. A partir de la lista Espaciado de sección, selecciona el tamaño de esta sección entre Pequeño, Mediano, Grande o Extra grande.

Para agregar una imagen de fondo:

  1. En el área Imagen, haz clic en Seleccionar imagen y luego realiza una de las siguientes acciones:

- Para seleccionar una imagen que ya has subido a tu panel de control de Shopify, haz clic en la pestaña Biblioteca. - Para seleccionar una imagen de la Colección de imágenes de Burst de Shopify, haz clic en la pestaña Imágenes gratuitas. Desde aquí puede introducir un término de búsqueda o explorar las categorías de imágenes. - Para seleccionar una imagen desde tu computadora, haz clic en la pestaña Biblioteca, y luego haz clic en el botón del signo "más".

  1. Selecciona la manera como quieres alinear la imagen a partir de la lista Alineación de imagen. Por ejemplo, seleccionar "Izquierdo superior" coloca la imagen en la parte superior izquierda del área de la sección.

Para agregar el texto:

  1. En el área de Texto, inserta un título para esta sección en el campo Encabezado.

  2. En el campo Texto, inserta el texto que desees que aparezca en esta sección.

  3. A partir de la lista Tamaño de Texto, selecciona un tamaño para el texto, ya sea Mediano o Grande.

Para agregar un botón:

  1. Si deseas mostrar el botón de manera transparente con un contorno intenso, marca Usar estilo de botón secundario.

  2. En el campo Texto del botón, inserta el texto que desees que aparezca en el botón.

  3. En el campo Enlace del botón, pega un enlace a una URL o haz clic en el campo para seleccionar una página de tu tienda.

Para aplicar una superposición:

  1. En el área Superposición, marca Mostrar superposición.

  2. Haz clic en la muestra de Color de superposición para seleccionar un color para la superposición de la imagen.

  3. Haz clic en la muestra de Color de texto para seleccionar un color para el texto.

4. A partir de la lista **Opacidad**, selecciona un nivel de transparencia para la superposición de imágenes. ## Boletín Puedes agregar la suscripción a un boletín a la página de inicio. Esto te permite recopilar direcciones para las campañas de [marketing por correo electrónico](/manual/create-marketing/customer-emails). Puedes obtener más información sobre el marketing por correo electrónico en el [blog de Shopify](https://www.shopify.ca/blog/116351749-how-to-grow-your-ecommerce-business-with-email-marketing-a-detailed-guide). ![La sección del boletín en un sitio web. Hay un campo para que los clientes introduzcan una dirección de correo electrónico y un botón que dice "Suscribirse".](/themes/narrative-newsletter-section.png) Para agregar la opción de suscripción al boletín a la página de inicio: 1. Ubica **Narrative** y haz clic en **Personalizar**. 1. Haz clic en **Secciones**. 2. Haz clic en **Agregar sección** > **Boletín**. 3. Introduce un título para la suscripción al boletín en el campo **Título**. El título predeterminado es "Suscríbete a nuestro boletín". 4. Introduce un subtítulo para la suscripción al boletín en el campo **Subtítulo**. El texto predeterminado es "Promociones, nuevos productos y ventas. Directamente a tu bandeja de entrada". 5. Introduce un mensaje de confirmación en el campo **Mensaje de éxito**. Los clientes verán el mensaje de éxito después de que envían su dirección de correo electrónico. El mensaje de éxito predeterminado es "Gracias por suscribirte". 6. Define el color de fondo para la sección de suscripción al boletín haciendo clic en la paleta de **colores de fondo** para elegir uno. 7. Define el color de fondo para la sección de suscripción al boletín haciendo clic en la paleta de **colores de fondo** para elegir uno. 8. Haz clic en **Guardar**. ## Mapa Puedes incluir un mapa en tu página de inicio. Un mapa puede ayudarte a promocionar la ubicación de tu tienda y los horarios de apertura. Para agregar un mapa: 1. Haz clic en la pestaña **Secciones** y selecciona **Agregar sección**. 2. Haz clic en **Mapa**. 3. En el campo **Encabezado de superposición**, inserta el texto que desees que aparezca en la parte superior de esta sección. 4. En el campo **Texto dirección y horarios**, inserta la información comercial de tu empresa. 5. En el campo **Dirección en el mapa**, introduce la dirección de tu negocio. 6. En el campo **Clave API de Google Maps**, introduce una [clave API válida](/manual/using-themes/change-the-layout/theme-settings/map-section-api-key). 7. En el campo **Imagen**, carga o selecciona una imagen que aparecerá si hay un problema con la carga de una sección del mapa. ## Video Puedes agregar un video alojado en YouTube o Vimeo a la página de inicio. Los videos pueden atraer clientes y generar interés por tu negocio. Para agregar un video a la página de inicio: 1. Ubica **Narrative** y haz clic en **Personalizar**. 1. Haz clic en **Secciones**. 2. Haz clic en **Agregar sección** > **Video**. 3. Introduce un título para el video en el campo **Título**. El texto del título aparece en el video hasta que se hace clic en el botón de reproducción. 4. Introduce un enlace para compartir el video en el campo **Enlace de video**. Un enlace para compartir un video de YouTube tiene este formato: `https://youtu.be/OTJXAUZY9t0`. Puedes aprender cómo copiar el enlace para compartir un video de YouTube en [este artículo de ayuda de YouTube](https://support.google.com/youtube/answer/57741?hl=en&co=GENIE.Platform%3DDesktop). Un enlace para compartir un video de Vimeo tiene este formato: `https://vimeo.com/281332510`. Puedes aprender cómo copiar el enlace para compartir un video de Vimeo en [este artículo del Centro de ayuda de Vimeo](https://help.vimeo.com/hc/en-us/articles/115014756727-Publishing-to-social). 5. Opcional: Agrega una imagen de portada al video: 1. Haz clic en **Seleccionar imagen**. Para cargar una imagen desde tu computadora, haz clic en **Cargar**. Para usar una imagen de archivo gratuita de [Burst](https://burst.shopify.com/), haz clic en **Imágenes gratuitas**. 2. Elige cómo quieres alinear la imagen de portada seleccionando una posición del menú desplegable **Posición de la imagen**. Puedes usar la posición de la imagen para elegir qué parte de la imagen quieres mantener a la vista cuando se la recorte. 6. Opcional: Agrega una superposición al video: > Consejo: Una superposición es una capa de color entre el video y el texto del título. Facilita la lectura del texto que aparece sobre el video y se muestra hasta que se hace clic en el botón de reproducción. 1. Marca **Mostrar superposición**. 2. Define el color de la superposición haciendo clic en la paleta **Superposición** y eligiendo un color. 3. Define el color del texto haciendo clic en la paleta **Texto** y eligiendo un color. 4. Define la opacidad de la superposición seleccionando un porcentaje con el control deslizante **Opacidad**. 7. Haz clic en **Guardar**. ## Carrusel de imágenes destacadas El carrusel de imágenes destacadas te permite mostrar más información sobre los productos sin necesidad de que el cliente salga de la página de inicio:
Puedes mostrar las características del producto, una nueva colección o variantes de un producto. El carrusel funciona mejor con una pequeña cantidad de diapositivas en vista de que el deslizamiento de páginas se bloquea mientras se navega por el conjunto en el escritorio. Cuando el carrusel de imágenes es visualizado a partir de un dispositivo móvil, es necesario pellizcarlo o tocarlo para que se abra y muestre las imágenes. Para incitar a tus clientes móviles a que abran el carrusel de imágenes, usa una bella imagen de portada y escribe un texto que "induzca a la acción". Puedes agregar hasta 5 diapositivas al carrusel de imágenes destacadas. ### Para personalizar el carrusel de imágenes destacadas: 1. Haz clic en la pestaña **Secciones**. 2. Haz clic en **Carrusel de imágenes**. ### Para agregar una imagen de diapositiva: 1. En el área de **Contenido**, haz clic en **Diapositiva**. 2. Haz clic en la muestra de **Color de fondo** para seleccionar un color de fondo a partir de una paleta. 3. En el área **Imagen**, haz clic en **Seleccionar imagen** y luego realiza una de las siguientes acciones: - Para seleccionar una imagen que ya has subido a tu panel de control de Shopify, haz clic en la pestaña **Biblioteca**. - Para seleccionar una imagen de la [Colección de imágenes de Burst de Shopify](https://burst.shopify.com/), haz clic en la pestaña **Imágenes gratuitas**. Desde aquí puede introducir un término de búsqueda o explorar las categorías de imágenes. - Para seleccionar una imagen desde tu computadora, haz clic en la pestaña **Biblioteca**, y luego haz clic en el botón del signo "más". 4. En el campo **Encabezado**, escribe el texto que desees que aparezca sobre la diapositiva. 5. En el campo **Etiqueta de botón**, escribe el texto que desees que aparezca en el botón. 6. En el campo **Enlace del botón**, pega un enlace a una URL o haz clic en el campo para seleccionar una página de tu tienda. ### Para personalizar la configuración del carrusel de imágenes destacadas:
  1. Si deseas mostrar los botones de la diapositiva de manera transparente con un contorno intenso, marca Usar estilo de botón secundario.

  2. Si deseas modificar el color del texto, haz clic en la muestra de Color de encabezado de diapositiva y selecciona un color en la paleta.

  3. En el área de configuración de la portada, selecciona una imagen de portada para la sección del carrusel de imágenes haciendo clic en Seleccionar imagen y realizando una de las siguientes acciones:

- Para seleccionar una imagen que ya has subido a tu panel de control de Shopify, haz clic en la pestaña Biblioteca. - Para seleccionar una imagen de la Colección de imágenes de Burst de Shopify, haz clic en la pestaña Imágenes gratuitas. Desde aquí puede introducir un término de búsqueda o explorar las categorías de imágenes. - Para seleccionar una imagen desde tu computadora, haz clic en la pestaña Biblioteca, y luego haz clic en el botón del signo "más".

  1. A partir de la lista Encabezado, inserta el texto que desees que aparezca en la imagen de portada.

  2. A partir de la lista de Posición del encabezado, selecciona el lugar donde quieres que aparezca el texto del encabezado: a la izquierda o en el centro de la imagen de portada. Esta configuración solo se aplica a las vistas de escritorio.

  3. En el área Superposición, marca Mostrar superposición.

  4. Haz clic en la muestra de Color de superposición para seleccionar un color para la superposición de la imagen.

  5. Haz clic en la muestra de Color de texto para seleccionar un color para el texto.

  6. A partir de la lista Opacidad selecciona el nivel de transparencia para la capa de imágenes.

  7. Haz clic en Guardar.

Configuración del tema Puedes usar la configuración del tema para personalizar los colores y la tipografía en tu tienda online. También puedes configurar enlaces a tus cuentas de redes sociales, editar la configuración de tu carrito y agregar un favicon.

Narrative incluye la siguiente configuración de tema: 



  • Colores
  • Tipografía
  • Carrito en menú lateral
  • Social
  • favicon
  • Caja

Colores

Puedes elegir los colores de las distintas partes de tu tienda online.

Pasos

  1. Haz clic en Personalizar junto a ****.

  2. Haz clic en Configuración del tema.

  3. Haz clic en Colores.

  4. Para cada tipo de contenido, haz clic en la muestra de color para usar el seleccionador de color:

    El seleccionador de color en el editor de temas

- En el área Seleccionado recientemente se muestran los colores que has seleccionado recientemente para tu tema. - En el área En uso actualmente se muestran los colores que estás usando actualmente en otras partes de tu tema.

Para dejar en color en transparente, haz clic en Ninguno.

  1. Haz clic en Guardar.

Tipografía

Puedes elegir la tipografía del texto en tu tienda online.

Pasos

  1. Haz clic en Personalizar junto a ****.

  2. Haz clic en Configuración del tema.

  3. Haz clic en Tipografía.

  4. Para cada tipo de texto, haz clic Cambiar para usar el selector de fuente:

    El botón 'Cambiar' en el selector de fuente

  5. Explora las fuentes utilizando el campo de búsqueda o haciendo clic en Cargar más.

    Para ver todas las fuentes disponibles, consulta la biblioteca de fuentes de Shopify.

  6. Haz clic en el nombre de la fuente que deseas actualizar.

  7. Para cambiar la fuente a un estilo diferente, como negrita o cursiva, haz clic en Regular. A continuación, haz clic en el estilo que deseas usar y luego haz clic en Seleccionar:

    Una selección de grosores de fuente disponible en el selector de fuente

  8. Haz clic en Guardar.

Carrito en menú lateral

Puedes personalizar la configuración del carrito lateral para tu tienda online según lo siguiente:

  • Configura el estilo de tu carrito como carrito lateral. Un carrito lateral aparece desde el lado derecho de la página, así los clientes pueden agregar productos al carrito sin salir de la página del producto.
  • Permite que los clientes agreguen una nota a su pedido. Los clientes pueden utilizar notas de carrito de compras para dar instrucciones especiales acerca de cómo preparar o enviar un pedido:

Un campo de texto con la etiqueta

Para personalizar la configuración del carrito lateral, haz lo siguiente:

  1. Ubica Narrative y haz clic en Personalizar.

  2. Haz clic en Configuración del tema.

  3. Haz clic en Carrito lateral.

  4. Configura tu carrito al estilo carrito lateral activando Mostrar carrito lateral. Si no activas esta casilla, utilizarás el carrito de página completa.

  5. Agrega un campo de notas a tu carrito lateral activando Mostrar nota de carrito

  6. Haz clic en Guardar.

Social

Puedes agregar botones de redes sociales para tus productos y publicaciones de blog, y enlaces a tus redes sociales.

Para personalizar la configuración de redes sociales:

  1. Ubica Narrative y haz clic en Personalizar.

  2. Haz clic en Configuración del tema.

  3. Haz clic en Social.

  4. Para cargar una imagen para compartir en redes sociales, en el área Imagen para compartir en redes sociales, haz clic en Seleccionar imagen o Explorar imágenes gratuitas.

  5. Para agregar botones de redes sociales a tus productos y entradas en blog, en el área Compartir en redes sociales, marca cualquiera o todas las casillas.

    Puedes agregar los siguientes botones para compartir:

- Compartir en Facebook - Tuitear en Twitter - Publicar en Pinterest (no disponible para compartir en entradas de blogs)

  1. Para agregar enlaces a tus redes sociales, en el área Cuentas, introduce los enlaces a tus cuentas en los campos correspondientes. Introduce enlaces completos, como https://instagram.com/shopify, o https://twitter.com/shopify.

    Los enlaces a tus cuentas de redes sociales aparecen en el pie de página de tu tienda online.

  2. Haz clic en Guardar.

favicon

Puedes cargar un icono de favoritos, o "favicon", que puede ayudar con el branding de tu tienda virtual mostrando tu logotipo en las siguientes sucursales:

  • la pestaña de tu navegador web
  • el historial de tu navegador web
  • iconos en tu escritorio
  • al lado del nombre de tu tienda online cuando esté marcado como favorito.

El mejor tamaño de imagen para el icono de favorito para Narrative es 32 x 32 px.

Para cargar un favicon:

  1. Haz clic en Personalizar.

  2. Haz clic en la pestaña Configuración del tema.

  3. Haz clic en Favicon.

  4. En el área de la imagen de Favicon, haz clic en Seleccionar imagen y luego realiza una de las siguientes acciones:

- Para seleccionar una imagen que ya has subido a tu panel de control de Shopify, haz clic en la pestaña Biblioteca. - Para seleccionar una imagen desde tu computadora, haz clic en la pestaña Biblioteca, y luego haz clic en el botón del signo "más".

  1. Haz clic en Guardar.

Caja

Puedes personalizar tu pantalla de pago para incluir lo siguiente:

  • Un banner con imagen personalizado en la parte superior de la página.
  • El logotipo de tu tienda.
  • Una imagen de fondo o color en el área de contenido principal.
  • Fuentes de texto y colores personalizados.

Para ver los cambios a medida que los aplicas, ve a tu pantalla de pagos en el editor de temas.

Para acceder a la configuración de la pantalla de pagos:

  1. Haz clic en Personalizar.

  2. Haz clic en la pestaña Configuración del tema.

  3. Haz clic en Pantalla de pagos.

Agregar una imagen de banner:

  • En el área Banner, haz clic en Seleccionar imagen y luego realiza una de las siguientes acciones: - Para seleccionar una imagen que ya has subido a tu panel de control de Shopify, haz clic en la pestaña Biblioteca.
    • Para seleccionar una imagen de la Colección de imágenes de Burst de Shopify, haz clic en la pestaña Imágenes gratuitas. Desde aquí puede introducir un término de búsqueda o explorar las categorías de imágenes.
    • Para seleccionar una imagen desde tu computadora, haz clic en la pestaña Biblioteca, y luego haz clic en el botón del signo "más".

Para agregar un logotipo:

  1. En el área Logotipo, haz clic en Seleccionar imagen y luego realiza una de las siguientes acciones:

- Para seleccionar una imagen que ya has subido a tu panel de control de Shopify, haz clic en la pestaña Biblioteca. - Para seleccionar una imagen desde tu computadora, haz clic en la pestaña Biblioteca, y luego haz clic en el botón del signo "más".

  1. En la lista Posición, selecciona dónde quieres que aparezca la imagen, ya sea a la derecha, a la izquierda o en el centro.

  2. En la lista Tamaño del logotipo, selecciona un tamaño de logotipo.

Para cambiar el fondo de la pantalla de pagos:

Puedes mostrar una imagen de fondo en la pantalla de pagos o puedes elegir un color de fondo. Para las imágenes de fondo, la imagen se mostrará en un patrón de cuadrícula.

  1. En el Área de contenido principal, haz clic en Seleccionar imagen y luego realiza una de las siguientes acciones:

- Para seleccionar una imagen que ya has subido a tu panel de control de Shopify, haz clic en la pestaña Biblioteca. - Para seleccionar una imagen de la Colección de imágenes de Burst de Shopify, haz clic en la pestaña Imágenes gratuitas. Desde aquí puede introducir un término de búsqueda o explorar las categorías de imágenes. - Para seleccionar una imagen desde tu computadora, haz clic en la pestaña Biblioteca, y luego haz clic en el botón del signo "más". - Haz clic en la muestra de Color de fondo para seleccionar un color nuevo a partir de una paleta.

  1. En la lista Campos de formulario, selecciona si los campos serán blancos o transparentes.

Para cambiar el fondo de la página Resumen del pedido:

  1. En el área de Resumen del pedido, haz clic en Seleccionar imagen y luego realiza una de las siguientes acciones: - Para seleccionar una imagen que ya has subido a tu panel de control de Shopify, haz clic en la pestaña Biblioteca.
    • Para seleccionar una imagen de la Colección de imágenes de Burst de Shopify, haz clic en la pestaña Imágenes gratuitas. Desde aquí puede introducir un término de búsqueda o explorar las categorías de imágenes.
    • Para seleccionar una imagen desde tu computadora, haz clic en la pestaña Biblioteca, y luego haz clic en el botón del signo "más".
    • Haz clic en la muestra de Color de fondo para seleccionar un color nuevo a partir de una paleta.

Para configurar las opciones de fuente:

  • En el área de Tipografía, selecciona la fuente que se usará para el encabezado y el cuerpo de texto de las listas.

Para establecer las opciones de color:

  • En el área de Colores, haz clic en la muestra de color Acentos, Botones o Errores para elegir un nuevo color a partir de una paleta.

Cambiar el estilo del tema

Puedes restablecer la configuración general de tu tema a sus valores predeterminados. Si restableces el estilo de tu tema, se perderán los cambios que hayas realizado en la pestaña Configuración general, pero no se perderá el contenido como texto e imágenes.

  1. Haz clic en la pestaña Configuración general.

  2. Haz clic en Cambiar el estilo del tema.

  3. Haz clic en el siguiente botón Cambiar el estilo del tema. El nombre de este botón es generalmente el nombre del tema.

  4. Haz clic en Cambiar estilo.

¿Estas listo(a) para comenzar a vender con Shopify?

Pruébala gratis