Aunque no es obligatorio usar la función de carrusel de BigCommerce, aporta mucho valor integrado a los sitios web de eCommerce y puede mejorar considerablemente la experiencia de usuario de tu diseño web de eCommerce.
Además, no es nada del otro mundo. El carrusel de BigCommerce es simplemente un sistema de imágenes que rotan, que pueden enlazar a otras páginas, y que se muestra en tu página de inicio, cambiando cada pocos segundos para que tus visitantes se hagan una idea de lo que hace u ofrece tu negocio. Entre otras cosas, tu carrusel de BigCommerce puede:
- Dirigir tráfico a páginas orientadas a la conversión.
- Simplificar la experiencia de navegación del usuario en tu sitio web.
- Impulsar conversiones en las categorías más vendidas.
- Presentar oportunidades de venta cruzada.
Es una gran oportunidad para poner frente a tus usuarios fotografías atractivas y originales de tus productos o de tu empresa, pero también puede ser una excelente vía para promocionar servicios u ofertas especiales. Y lo mejor de todo es que no es una función muy difícil de usar. Incluso sin un diseñador web de BigCommerce, puedes crear un carrusel básico.
Esto es lo que tienes que hacer:
1. Inicia sesión en el portal de administración de BigCommerce
En la imagen de abajo puedes ver el portal de administración de una tienda en BigCommerce. Esta tienda usa el tema Cornerstone Light, que en este caso es el predeterminado. El tema que uses puede influir en la presencia o la apariencia de tu carrusel, así que tenlo en cuenta. Además, si estás pensando en cambiar, actualizar o editar tu tema actual de BigCommerce, consulta nuestro blog sobre ese tema en el enlace anterior.
Hay más de una forma de hacer cambios y ajustes en tu carrusel de BigCommerce, pero para este tutorial te mostraremos una de las formas más fáciles de usar. Antes de cambiar el carrusel, puedes hacer clic en “View Store”, como se indica en la imagen de arriba. Así es como ven tu tienda los visitantes de tu tienda en línea. En este ejemplo predeterminado, el carrusel tiene dos diapositivas y muestra imágenes de archivo de productos de oficina. Como 1DigitalⓇ Agency es, bueno, una agencia de marketing digital y no vende lámparas, queremos cambiar nuestro carrusel para que esté más alineado con lo que ofrecemos.
2. Haz clic en “Storefront” y luego en “Home Page Carousel”
De vuelta en el portal de administración, en el menú de la izquierda verás “Storefont”. Haz clic en “Storefront” y verás varias opciones, como “Theme Marketplace”, “Logo” y “Homepage Carousel”, como se indica en la imagen de abajo. Por suerte, BigCommerce es bastante fácil de usar y te permite hacer una gran variedad de cambios, modificaciones y personalizaciones sin saber programar.
3. Sube imágenes a tu carrusel
Aunque puedes editar el carrusel de tu página de inicio en el orden que prefieras, vamos a empezar por las imágenes. Después podemos volver y editar el número de diapositivas, el encabezado, el texto, los botones, los enlaces y el texto alternativo, además del tiempo que se muestra cada diapositiva antes de rotar.
Primero, vamos a quitar las imágenes que vienen por defecto en este carrusel de ejemplo haciendo clic en las X rojas de la esquina, como se indica en la imagen de abajo.
Una vez que hayas quitado las imágenes, verás una sección que te pide arrastrar y soltar fotos o seleccionarlas desde tu computadora, como se ve en la imagen de abajo.
Como ves, tienes dos opciones para agregar imágenes a tu carrusel: arrastrarlas y soltarlas, o seleccionarlas desde los archivos de tu computadora. Para ilustrarlo, vamos a usar algunos gráficos que representan algunos de nuestros servicios principales: marketing digital para eCommerce, diseño y desarrollo. Vamos a usar tres, pero puedes seleccionar hasta cinco.
Así se verá la construcción del carrusel una vez que hayas subido las imágenes que quieres usar:
Notarás que hay algunas áreas importantes en blanco, como el encabezado, el texto, el texto alternativo y el texto de los botones. Tampoco hay enlaces, lo cual cambiaremos en un momento. Las diapositivas también vienen configuradas para rotar cada 5 segundos, algo que dejaremos así, pero que puedes cambiar si quieres. Antes de continuar, haz clic en guardar en la esquina inferior derecha.
4. Agrega encabezados, texto, texto de botones y enlaces
Para mejorar la apariencia de nuestra presentación, vamos a agregar encabezados y texto a cada imagen. Para nuestra diapositiva de marketing digital, elegiremos Digital Marketing como encabezado y agregaremos un CTA.
Primero, te mostraremos un ejemplo de cómo agregar un encabezado y algo de texto con la herramienta Home Page Carousel en el back-end, antes de hacer personalizaciones con el Page Builder.
Para la diapositiva que se muestra abajo, vamos a usar el encabezado “Digital Marketing” y el texto descriptivo “SEO, PPC, Social Media Management and Email Marketing”, ya que da un resumen bastante bueno de nuestros servicios. Escribe este texto en los dos campos indicados en la parte superior de la página.
Como ves en nuestro ejemplo, el texto no se ve bien en la diapositiva, ¡pero no te preocupes todavía! Te mostraremos cómo hacer algunos cambios menores adicionales con el Page Builder. Antes de llegar ahí, agreguemos un botón con un enlace a nuestra página principal de marketing digital usando una llamada a la acción clara.
¿Qué te parece “Grow Organic Traffic and Sales”? Usemos eso. Escríbelo en el campo de la parte superior de la imagen anterior donde dice “Button Text”. Luego escribe la URL de la página a la que quieres dirigir el tráfico. En nuestro caso, es nuestra página principal de marketing digital. Una vez que lo hagas, verás lo mismo que en la imagen anterior (ya lo escribimos).
Haz clic en guardar de nuevo (en la parte inferior derecha de la página, como se indica en la imagen). Ahora vamos a ver una vista previa de estos ajustes en el sitio web y a hacer ajustes finos con la herramienta Page Builder. A la izquierda del portal de administración, haz clic en “View Store”.
Como ves, el front-end se ve mucho mejor que el back-end: el extraño texto blanco desalineado fue reemplazado y la alineación se corrigió. Sin embargo, la presentación todavía es un poco simple. Para hacer ajustes finos al carrusel, haz clic en “Design this page in Page Builder”, que te mostrará esto:
Eso te llevará de vuelta a esta página:
Ahora te mostraremos cómo hacer algunos cambios en el color del texto que aparece aquí en el carrusel. Sin embargo, es importante tener en cuenta que el tema controla la fuente del texto, la posición del texto y el tamaño de la imagen, así que si no te gusta cómo se ve, tendrás que instalar un tema nuevo o trabajar con un desarrollador de BigCommerce para hacer cambios avanzados.
Mira la imagen de abajo y haz clic en “Theme Styles” (donde se indica, es una paleta) y luego en “Home Page”, donde puedes hacer algunos ajustes al color del texto del carrusel.
Aquí puedes ver que, si quieres, puedes hacer algunos ajustes menores al color del texto de tu carrusel. Solo asegúrate de hacer clic en “Save”, como se indica en la parte superior de la imagen, para no perder tus cambios.
Acabas de crear un carrusel de BigCommerce para tu tienda en línea, pero hay un detalle más que quizá quieras agregar antes de dar el trabajo por terminado: deberías agregar un texto alternativo adecuado a las imágenes de las diapositivas. Vuelve a la herramienta “Homepage Carousel” donde empezaste.
5. Extra: mejora tu SEO en BigCommerce agregando texto alternativo a tu carrusel
Mira la imagen de abajo, donde puedes ver el carrusel que acabamos de crear.
Si haces zoom en la zona indicada, verás que esta herramienta te permite agregar texto alternativo a tu carrusel.
Hay una razón principal para hacerlo antes de terminar: puede aumentar el valor SEO de tu sitio web. Se llama texto alternativo porque es un texto que puede mostrarse en lugar de una imagen como alternativa a lo visual. Para optimizar correctamente tu carrusel con texto alternativo, tendrás que hacer una investigación de palabras clave, pero en este caso, para nuestros servicios de marketing digital, podríamos escribir “digital marketing”, “SEO” o “marketing services”, solo como un ejemplo rápido.
¡Bien hecho! Acabas de crear tu primer carrusel de BigCommerce e incluso mejoraste un poco tu puntuación de SEO on-page con un texto alternativo bien pensado e investigado para las imágenes de tu carrusel. Vas por muy buen camino hacia una gran experiencia de compra y un sitio web de eCommerce que es la viva imagen de la optimización para motores de búsqueda.
Sin embargo, si te interesa hacer cambios avanzados en el diseño de tu sitio web de eCommerce y tienes en mente una imagen muy específica para tu marca, un partner de BigCommerce puede ayudarte a hacer los cambios que son difíciles de lograr con las herramientas de BigCommerce.
Ya sea que busques un diseñador de BigCommerce que lleve tu carrusel y toda tu UX al siguiente nivel, o una empresa de SEO para eCommerce que optimice las meta descripciones, los artículos del blog, los títulos de página y las páginas de producto de tu sitio web como parte de una estrategia de SEO brillante, 1DigitalⓇ Agency está aquí para ayudarte.
Solo mira nuestro portafolio de clientes de eCommerce para ver pruebas visuales del tipo de genialidad creativa que podemos lograr, y luego llámanos al 888-982-8269 para hacerlo realidad en tu sitio web.
Puede haber muchos diseñadores de BigCommerce, pero solo hay un 1DigitalⓇ.