Agrega las suscripciones a tu tienda en línea y a productos específicos para que los visitantes conozcan esta opción de compra mientras navegan. Conoce cómo puedes hacerlo tu mismo en esta guía.

Copiar código del producto que se va a agregar:

  1. Ingresa al administrador de Treli y entra al producto que quieres agregar en tu página web

  2. Haz click en el botón de 'Compartir' y luego en la opción de 'Agregar a mi página web'

  3. Escoge cómo quieres visualizar la suscripción en tu página web:

    1. Plan: Se muestra el nombre, detalle, precio e imagen del producto. Ideal para agregar en páginas de inicio, tienda u otras

    2. Botón: Se visualiza el precio y botón del producto. Ideal para agregar dentro de productos específicos

      1. Conoce este como BananaBread ofrece las suscripciones dentro de sus productos: BB Tradicional

  4. Ahora copia el código que se genera, que será pegado en los próximos pasos.

Pegar el código en tu página web:

Para Wordpress / Woocommerce:

  1. Ingresa al administrador de tu página web o tienda en línea

  2. Accede a la sección donde quieres agregar la suscripción. Puede ser una página o un producto especifico

  3. Busca el espacio de HTML donde quieres agregar el botón y pega el código. Wordpress permite agregar códigos de Iframe en la descripción de los productos y en páginas informativas

  4. Guarda los cambios y visualiza la suscripción en tu página web

Para Shopify:

  1. Ingresa al administrador de tu tienda en línea

  2. Accede a la sección donde quieres agregar la suscripción. Puede ser una página o un producto especifico

  3. Busca el espacio de HTML donde quieres agregar el botón y pega el código. Shopify permite agregar códigos de Iframe en la descripción de los productos y en páginas informativas. Recuerda hacer click en la opción de 'Mostrar Editor' para que el pegado sea cómo código y no cómo texto

  4. Guarda los cambios y visualiza la suscripción en tu tienda en línea

Agrega un metacampo para mostrar las suscripciones en secciones personalizadas

Esta integración incluye pasos más técnicos. Asegúrate de contactar a tu equipo de desarrollo.

  1. Ingresar a la sección de 'Configuración' > 'Metacampos' en el administrador de Shopify

  2. Escoger la sección donde se quiere agregar el metacampo. Para agregarlo en una sección personalizada de la página de producto, escoger la opción de 'Producto'

  3. Hacer click en el botón de 'Agregar definición' en la parte superior derecha.

    1. Agregar el 'Nombre' del metacampo y copiar el campo de 'Espacio de nombres y clave'

    2. Hacer click en el botón de 'Seleccionar tipo de contenido' y escoger la opción de 'Texto'. Dejar la opción de 'Texto de una sola línea'.

    3. Finalmente, hacer click en el botón de 'Guardar'.

4. Ahora se debe ingresar al código del tema de Shopify, para agregar el metacampo a la sección personalizada de la tienda en línea. Para esto se ingresa a la sección de 'Tienda en línea' > 'Acciones' > 'Editar código'

5. Abrir el archivo del 'Template' donde se quiere incluir la suscripción e inlcuir el siguiente código en la sección deseada. Se debe cambiar el texto posterior a 'product.metafields.' al copiado en los pasos anteriores.

{{ product.metafields.my_fields.treli }}

6. Ahora se podrá agregar en cada producto el código embeed asociado a la suscripción de Treli. En los productos de Shopify se podrá encontrar la sección de 'Metacampos' y el espacio para agregar el código. Finalmente se guardan los cambios.

7. Al visualizar el producto, se vera reflejada la suscripción en la sección donde se agrego el metacampo.

Para otros portales y desarrollos web:

  1. Ingresa al administrador de tu tienda en línea

  2. Accede a la sección donde quieres agregar la suscripción. Puede ser una página o un producto especifico

  3. Busca el espacio de HTML donde quieres agregar el botón y pega el código de iFrame

  4. Guarda los cambios y visualiza la suscripción en tu tienda en línea

Después de que la suscripción se visualice en su página web, pueden hacerle ediciones de estilo con CSS para una personalización más detallada.

Si tienes alguna pregunta sobre este proceso, no dudes en contactarnos en nuestro chat, Whatsapp o enviando un correo a soporte@treli.co.

Sigamos creando valor juntos con Treli :)

¿Encontró su respuesta?