Todo lo que necesita saber sobre Shopify 2.0 (y qué hacer)

Publicado: 2022-08-03

Si es propietario de un negocio o comercializador y está considerando usar Shopify para crear su tienda de comercio electrónico, querrá prestar mucha atención a este artículo.

Estamos a punto de contarte sobre Shopify 2.0, incluidas las novedades, por qué es bueno y qué debes hacer para aprovechar la actualización.

Entonces, ya sea que recién esté comenzando y esté investigando o ya sea un usuario de Shopify que esté considerando una actualización, siga leyendo para conocer todo lo que necesita saber.

Lo que se cubre en esta publicación:
  • Una breve descripción de la tienda Shopify
  • ¿Qué es Shopify 2.0 y cuáles son las nuevas características?
  • ¿Cuál es la nueva arquitectura del tema?
  • ¿Qué necesitan saber los desarrolladores?
  • Cómo configurar tu tienda en Shopify 2.0
  • ¿Qué debes hacer si tu tienda se creó en Shopify 1.0?
  • ¿Tienes que actualizar tu tienda Shopify a 2.0?

1. Una breve descripción de la tienda Shopify

Captura de pantalla de Shopify 2, anunciado como Shopify.

Fuente: Presentación de la Tienda en línea 2.0: lo que significa para los desarrolladores

Si estás aquí, ya tienes una tienda Shopify o estás pensando en conseguir una. Y si es lo último, es posible que se pregunte si una tienda en línea Shopify es la plataforma adecuada para usted.

Si este es el caso, quizás le interese leer nuestro artículo, "Shopify vs WooCommerce: cuál es el mejor para usted".

Imagen con el texto "Hubo 457 millones de compradores en Shopify en 2020.

Hubo 457 millones de compradores en Shopify en 2020, frente a los 218 millones en 2018 (Fuente: Shopify).

Aquí en Exposure Ninja, nos encanta trabajar con Shopify. Es la opción adecuada para usted si tiene una empresa de comercio electrónico que busca una tienda en línea que sea fácil de usar y con mucho soporte.

Sus excelentes funciones le permiten realizar un seguimiento de las ventas, crear informes de ingresos y generar órdenes de compra.

La tienda Shopify original vino cargada con 70 temas personalizados plug-and-play, lo que facilita que cualquier persona configure su tienda en línea en tan solo 15 minutos.

Editar temas y crear páginas personalizadas no siempre fue sencillo, pero la tienda en línea Shopify 2.0 espera cambiar eso. Los comerciantes de Shopify ahora pueden esperar una tienda en línea mucho más flexible con un editor de temas y extensiones de aplicaciones de temas incluidas.

2. ¿Qué es Shopify 2.0 y cuáles son las nuevas funciones?

La tienda en línea Shopify 2.0 es una actualización importante de la plataforma de la tienda en línea de Shopify.

Lanzada en junio de 2021, la tienda en línea actualizada 2.0 ha visto un cambio significativo para Shopify en un espacio más personalizable y que muchos desarrolladores pueden agradecer.

Con un ojo en la experiencia del usuario, Shopify no se ha olvidado de los muchos usuarios que usan la plataforma, gracias a su facilidad de uso. Los cambios, aseguran, son “más fáciles y flexibles”.

Entonces, ¿cuáles son las nuevas características clave?

  • Las "secciones" ahora están disponibles en todas las páginas, no solo en la página de inicio
  • Han introducido extensiones de aplicaciones de temas.
  • Los bloques de aplicaciones ahora están disponibles a través de la interfaz del editor de temas.
  • Agregue activos a las extensiones de su aplicación de tema
  • Mejoras en los metacampos
  • El selector de archivos admite archivos de imagen
  • Una nueva API de archivos
  • Mejoras en el editor de temas
  • Ajuste de entrada de líquido.

La actualización incluye un nuevo tema de referencia llamado " Amanecer " que es un 35 % más rápido que el tema predeterminado anterior, Debut. La tienda en línea Shopify 2.0 también está abierta a las presentaciones de temas de los desarrolladores y tiene opciones de personalización y soporte mejorados.

Si está mirando la lista de nuevas funciones y se pregunta qué significa todo esto, quédese con nosotros. Te estaremos guiando a través de todo lo que necesitas saber sobre la tienda en línea 2.0.

No contrate una agencia de diseño web hasta que haya leído este libro electrónico

Descarga este libro electrónico
Portada de 21 cosas que debe saber antes de elegir una agencia de diseño web

3. ¿Qué es la nueva arquitectura temática?

La arquitectura de temas puede sonar como una jerga, pero en términos simples, se refiere a cómo está estructurado el editor.

La tienda en línea Shopify 2.0 tiene un editor de temas actualizado, lo cual es una buena noticia por dos razones:

  1. Es más fácil para los que no son desarrolladores personalizar todas las páginas
  2. Es más fácil para los desarrolladores crear temas personalizados y crear integraciones.

Se han añadido siete nuevas funcionalidades a la tienda online 2.0. Aquí veremos cada uno con un poco más de detalle.

Las plantillas de página ahora tienen secciones

Las secciones son los componentes visuales de una página en su sitio web, por ejemplo, un banner, un bloque de imagen con texto o un botón.

En la versión anterior de Shopify, solo la página de inicio te permitía agregar nuevas secciones y arrastrarlas y soltarlas donde quisieras en tu página.

Era posible personalizar sus secciones en otras páginas, pero no sin la ayuda de un desarrollador.

Ahora los comerciantes pueden personalizar cualquier página de su sitio, incluidas las páginas de productos, para que su tienda en línea se sienta totalmente personalizada para su negocio.

¿Cómo trabajan?

  • Cada página ahora se puede representar usando archivos de plantilla JSON
  • Puede configurar varios archivos de plantilla que se asignan a diferentes productos
  • Los comerciantes pueden tener diferentes páginas de productos, páginas de colección y otras páginas en la misma tienda
  • Los comerciantes pueden definir las secciones y el orden en que las secciones deben aparecer de forma predeterminada cuando se instala el tema.
  • Ahora se pueden agregar secciones dinámicas a la página de inicio.

Extensiones de aplicaciones temáticas con bloques de aplicaciones

En la tienda en línea Shopify anterior, no había forma de que las aplicaciones se integraran con el editor de temas. Un comerciante habría tenido que contratar a un desarrollador para codificar la integración con los temas existentes. Esto podría provocar roturas en el código del tema, lo que dificultaría la realización de integraciones entre temas.

Con la tienda en línea 2.0, una extensión de aplicación temática permite a los desarrolladores agregar funciones y extensiones. Gracias a esto, ahora puedes agregar funcionalidades adicionales a tus tiendas Shopify.

Modularidad de la aplicación integrada

Los bloques de aplicaciones permiten a los desarrolladores crear componentes para agregar a un editor de temas sin codificar la integración.

¿Qué significa esto para usted como comerciante? En pocas palabras, si desea cambiar su tema pero llevar una aplicación integral con usted, esto es mucho más fácil y significa que un desarrollador no necesitará reconstruir toda la integración. También hace que sea mucho más fácil eliminar una aplicación, con todo el código fantasma eliminado en una desinstalación.

Cambios en los metacampos

Captura de pantalla de la actualización de metacampos de Shopify 2.0.

Un metacampo es el espacio para que agregue datos informativos sobre un activo en particular dentro de su sitio web. Puede ser una imagen, una lista, un gráfico o un archivo descargable.

Este nuevo editor de temas le permite agregar metacampos y propiedades sin usar API o código. Esto no es posible con la funcionalidad anterior en las herramientas de edición nativas de Shopify.

Los metacampos se han rediseñado desde cero para que sean más flexibles e intuitivos. Ahora, puede crear campos personalizados para satisfacer sus necesidades en minutos con el sistema de tipo avanzado de la tienda en línea 2.0. Se han introducido metacampos estándar para que todos los temas funcionen de forma inmediata en las tiendas de diferentes mercados verticales, sin necesidad de codificación adicional o instalación de complementos.

selector de archivos

El selector de archivos de metacampo facilita la carga y selección de medios en las páginas de productos. Todas sus imágenes guardadas en la sección Configuración/Archivos están inmediatamente disponibles para su uso con esta nueva función.

Los metacampos funcionan con muchas fuentes de medios, como imágenes o archivos PDF.

Por ejemplo, en lugar de codificar tipos de archivos particulares para el área de contenido del generador de páginas de cada tema, los metacampos le permiten cargar el elemento seleccionado desde su teléfono y hacer que aparezca inmediatamente en las páginas del producto, sin necesidad de volver a la configuración.

API de archivo

La actualización de la tienda en línea 2.0 de File API brinda a los comerciantes una nueva funcionalidad y una interfaz optimizada para cargar archivos.

Con este lanzamiento, los desarrolladores pueden crear, elegir y cargar medios en sus tiendas Shopify a través de una consola GraphQL fácil de usar dentro del panel de administración de Shopify.

Además, la API ahora permite el acceso desde múltiples aplicaciones para usar el espacio para archivos que no están directamente relacionados con un producto en particular.

Configuración de entrada de líquido

La configuración de entrada de Liquid permite a los comerciantes agregar código Liquid personalizado a las páginas directamente desde el editor con una nueva configuración similar a la de HTML. Esto significa que tendrá acceso a variables globales y objetos específicos de la plantilla, lo que reduce la necesidad de cambiar el código del tema manualmente.

Este código líquido personalizado facilita que los comerciantes de Shopify trabajen con la nueva tienda en línea 2.0 sin interferir con el código de su tema ni involucrar demasiado a los desarrolladores de aplicaciones.

Portada de Cómo llegar a la cima de Google

Llegar a la cima de Google gratis

Descargue una copia gratuita de nuestro libro más vendido,
" Cómo llegar a la cima de Google "
Descargar mi copia gratuita

4. ¿Qué necesitan saber los desarrolladores?

Si eres un comerciante y solo buscas conocer las razones básicas por las que deberías cambiarte a Shopify 2.0, entonces el editor de temas actualizado debería ser razón suficiente.

Pero Shopify ha incluido algunas nuevas herramientas para desarrolladores como parte de la tienda en línea renovada. Vamos a repasar estos brevemente aquí.

Integración de GitHub

La integración de Shopify GitHub permite a los desarrolladores conectarse fácilmente a su cuenta de usuario de GitHub con solo unos pocos clics.

La integración entre temas y GitHub permitirá a los desarrolladores trabajar de manera más eficiente al realizar cambios. Los desarrolladores ahora pueden implementar flujos de trabajo donde necesitan aprobación antes de llenar los sitios en vivo con sus actualizaciones. Esto ahora funciona en una plataforma, ahorrando tiempo al completar un tema en vivo.

Herramienta CLI de Shopify

Previamente, los desarrolladores pueden haber usado la CLI para generar Node.js, aplicaciones Ruby on Rails y extensiones de aplicaciones. La tienda en línea Shopify 2.0 les permite usar la CLI para actualizar los temas de desarrollo.

Los temas de desarrollo están ocultos en la parte de administración de Shopify de la tienda, lo que permite a los desarrolladores trabajar en ellos. Estos temas de desarrollo no cuentan para el límite de temas, pero Shopify ‌los elimina automáticamente si ven inactividad en los temas de desarrollo después de siete días.

La nueva herramienta CLI le dará a usted o a su desarrollador control sobre el desarrollo del tema, la edición de temas y la apariencia de su nuevo tema. Dentro de su nuevo proyecto de tema, podrá ver cualquier cambio que ocurra en vivo, interactuar con ellos y personalizarlos usando el editor.

Comprobación de tema

Entre las nuevas herramientas para desarrolladores se encuentra Theme Check, un servidor de idiomas que se integra con un editor de texto para identificar problemas dentro del código para un desarrollo eficiente de nuevos temas.

Se incluye con la herramienta Shopify CLI, por lo que un desarrollador debe instalarlos juntos. Ha sido diseñado cuidadosamente, con mensajes de error que incluyen un enlace a la documentación de la verificación fallida.

Amanecer

Ejemplo de captura de pantalla del tema Dawn de Shopify 2.0.

Fuente: Presentación de la Tienda en línea 2.0: lo que significa para los desarrolladores

Dawn es el nuevo tema de referencia que viene de serie con la nueva tienda online Shopify 2.0. El tema predeterminado anterior era Debut, y Dawn es notablemente más rápido, más flexible y más optimizado que su predecesor, lo que hace que el proceso de desarrollo sea mucho más fluido.

Dawn ya tiene plantillas JSON para todas sus páginas, por lo que puede usarse como modelo al desbloquear secciones dentro de un nuevo tema.

Su velocidad se debe a que se creó con un Javascript mínimo, por lo que Shopify alienta a los desarrolladores a aprovechar la funcionalidad del navegador nativo para representar diseños HTML y CSS.

5. Cómo configurar tu tienda en Shopify 2.0

Ejemplo de captura de pantalla de la herramienta para agregar productos de Shopify en Shopify 2.0.

Configurar una tienda en Shopify 2.0 es lo mismo que en la versión anterior de Shopify. Es rápido y fácil de hacer, pero antes de comenzar, debería haber pensado en lo siguiente:

  • ¿Cual es el nombre de tu negocio? Se le preguntará el nombre de su tienda de inmediato y es imposible cambiarlo, así que asegúrese de elegir con cuidado. Sin embargo, podrá cambiar esto a un dominio elegido más adelante.
  • Colores de la marca, tipografías y logo. Seleccionarás un tema de la tienda de temas de Shopify, pero probablemente querrás reemplazar ciertos componentes del tema con tu marca.
  • Imágenes y descripciones de los productos que desea vender, incluidos UPC, variantes, detalles de envío y, por supuesto, el precio.
  • Cómo le gustaría que los usuarios hicieran los pagos.
    • Shopify permite la mayoría de las opciones, incluidas Paypal, Visa, Mastercard, AMEX, Apple Pay, Amazon Pay y Google Pay.
  • La estructura del sitio; qué páginas le gustaría incluir y la copia que le gustaría tener en ellas. Necesitará saber esto cuando venga a configurar su navegación y sus nuevas páginas.
  • Elementos adicionales como los metadatos y los elementos de SEO que le gustaría incluir en sus páginas.

Para obtener una guía completa sobre cómo configurar su tienda Shopify de una manera que tenga en cuenta el SEO, escuche nuestro podcast, Shopify SEO para principiantes o mire el video a continuación.

¿Qué debe hacer si su tienda se creó en Shopify 1.0?

Si ya tiene una tienda en línea Shopify y desea actualizar a Shopify 2.0, hay tres formas disponibles:

Visita la tienda de temas de Shopify y descarga uno de los nuevos temas de Shopify.

Compruebe si su tema existente ofrece una versión actualizada usando la tienda en línea 2.0.

Migre sus plantillas de temas actuales a la nueva arquitectura.

1. Descarga un nuevo tema

  1. Visita la tienda de temas de Shopify.
  2. Filtrar por “Arquitectura Temática”.
  3. Selecciona “Tienda Online 2.0”.
  4. Elija su tema preferido y presione "Probar tema".
  5. Solo debe pagar si publica el tema en su sitio de Shopify.

2. Actualiza tu tema actual

  1. Captura de pantalla de la opción de Shopify para actualizar al tema Dawn. Visite la tienda de temas de Shopify y filtre por "Tienda en línea 2.0" como se indicó anteriormente. Si su tema está disponible para una actualización, debería verlo allí.
  2. Alternativamente, deberías tener una notificación en tu Shopify Admin (debajo de donde indica tu tema).
  3. Haga clic en la notificación y "Agregar a la biblioteca de temas".
  4. Cualquier personalización realizada en su tema usando el Editor de temas se copia y se aplica al tema actualizado. Éstos incluyen:
  5. Ajustes de tema modificados
  6. Diseños de página modificados, como agregar, reordenar, eliminar u ocultar secciones o bloques
  7. Nuevas plantillas
  8. Configuraciones agregadas, eliminadas o modificadas de incrustaciones de aplicaciones o extensiones de aplicaciones.

3. Migra tu plantilla de tema

Este es un proceso largo y no lo recomendaríamos a menos que sea un desarrollador.

  1. Usa la herramienta CLI de Shopify o el editor de código. Es posible que deba instalar CLI.
  2. Asegúrese de haber iniciado sesión como colaborador o como "personal" de la cuenta en la que desea trabajar.
  3. Haz una copia de tu tema.
  4. Convierta su código de tema actual de una configuración de entrada Liquid en una plantilla JSON.
  5. Mueva cualquier código Liquid o HTML a las secciones que se utilizarán en su nueva plantilla JSON.
  6. Puedes leer el proceso completo aquí en Shopify.dev.

¿Tiene que actualizar su tienda Shopify a 2.0?

La respuesta corta a esto es no .

Shopify todavía ofrece muchos temas compatibles con la versión original.

Sin embargo, si usted es propietario de una tienda y busca personalización adicional, nuevas plantillas de página y páginas personalizadas, cambiar a 2.0 podría ser una buena opción para usted.

El último consejo de Shopify es que si planea usar aplicaciones, debe intentar usar extensiones de aplicaciones para integrarlas con su tienda en línea. Esto es cierto si está enviando una nueva aplicación porque deben usar extensiones de tema para integrarse. Shopify planea hacer de esto un requisito para todas las aplicaciones en el futuro.

¿Propietario de negocio de Shopify? Puede disfrutar leyendo nuestro blog sobre Cómo crear una estrategia de marketing ganadora de Shopify.

Qué leer a continuación

  • Las mejores plataformas de comercio electrónico para usar
  • Shopify vs WooCommerce: ¿cuál es el mejor para ti?
  • Cómo crear una estrategia de marketing ganadora de Shopify
  • Una guía de PPC para las tiendas de comercio electrónico de Shopify
  • 11 cosas que debes saber antes de elegir una agencia de diseño web
  • 6 formas de aumentar las ventas de su tienda de comercio electrónico