En este tutorial te enseño a agregar una sección de Bonus gratis en tu tienda de Shopify o WordPress/Woocommerce, sin necesidad de gastar dinero en aplicaciones ni programar códigos complejos.
Copia y pega este código a continuación en una sección de «liquid personalizado» en tu tienda de Shopify o en un bloque «HTML personalizado» en WordPress/Woocommerce tal y como se explica en el video más adelante:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
.bonus-banner {
background-color: #f0f7ff;
border: 1px solid #cce3ff;
border-radius: 4px;
padding: 12px 15px;
display: flex;
align-items: center;
gap: 12px;
margin: 20px 0;
max-width: 600px;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
}
.bonus-icon {
min-width: 24px;
width: 24px;
height: 24px;
}
.bonus-content {
flex-grow: 1;
}
.bonus-title {
color: #2c76e8;
font-weight: 600;
font-size: 14px;
margin: 0;
line-height: 1.4;
}
.bonus-description {
color: #333;
font-size: 14px;
margin: 0;
line-height: 1.4;
}
.bonus-value {
color: #666;
font-size: 12px;
margin: 0;
line-height: 1.4;
}
</style>
</head>
<body>
<div class="bonus-banner">
<div class="bonus-icon">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M20 12V22H4V12" stroke="#2c76e8" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M22 7H2V12H22V7Z" stroke="#2c76e8" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M12 22V7" stroke="#2c76e8" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M12 7H7.5C6.83696 7 6.20107 6.73661 5.73223 6.26777C5.26339 5.79893 5 5.16304 5 4.5C5 3.83696 5.26339 3.20107 5.73223 2.73223C6.20107 2.26339 6.83696 2 7.5 2C11 2 12 7 12 7Z" stroke="#2c76e8" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M12 7H16.5C17.163 7 17.7989 6.73661 18.2678 6.26777C18.7366 5.79893 19 5.16304 19 4.5C19 3.83696 18.7366 3.20107 18.2678 2.73223C17.7989 2.26339 17.163 2 16.5 2C13 2 12 7 12 7Z" stroke="#2c76e8" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</div>
<div class="bonus-content">
<p class="bonus-title">FREE BONUS:</p>
<p class="bonus-description">Made by Shopify Experts: E-Commerce Conversion Checklist</p>
<p class="bonus-value">(Value $47.00)</p>
</div>
</div>
</body>
</html>¿Cómo agrego esta sección de Bonus a mi tienda de Shopify?
¿Cómo agrego esta sección de Bonus a mi tienda de Shopify?
¿Cómo personalizo esta sección de Bonus Gratis en mi Ecommerce?
Para modificar el texto de esta sección, debes copiar todo el código y copiarlo en un archivo de word o una nota rápida. Luego debes identificar la siguiente línea de código:
<p class="bonus-title">FREE BONUS:</p>
<p class="bonus-description">Made by Shopify Experts: E-Commerce Conversion Checklist</p>
<p class="bonus-value">(Value $47.00)</p>Una vez ahí, debes escribír las características de tu propio bonus que entregaras de regalo por la compra de tus productos. Esto aumentará el FOMO de tus visitantes logrando aumentar su conversión. Si quieres entender más sobre el efecto del elemento BONUS dentro de tu oferta, te recominedo leer el libro Oferta de 100M de Alex Hormozi.
¿Cómo conseguir más códigos para personalizar mi tienda de Shopify?
Si te gustó este código y quieres conseguir más, puedes acceder al Pack +100 Códigos Liquid para Shopify con un tremendo descuento sólo por ser mi seguidor!
¿Qué es el Pack de +100 Códigos Liquid para Shopify?
Este exclusivo pack 100 códigos Shopify continen más de 100 códigos Liquid diseñados para mejorar la funcionalidad y apariencia de tu tienda Shopify. Totalmente personalizables, rápidos y compatibles con dispositivos móviles y cualquier tema, estos códigos te permitirán:
- Personalizar tu tienda: Ajusta cada detalle para reflejar tu marca única.
- Mejorar la experiencia del usuario (UX): Ofrece una navegación intuitiva y atractiva.
- Aumentar la tasa de conversión +3% (CRO): Convierte más visitantes en clientes satisfechos. 📈
🎁 BONUSES
BONUS 1
✅ Checklist Ecommerce para optimización de tasa de conversión ($17 USD) INCLUIDO: Lista de más de 120 puntos claves para que mejores y optimices la tasa de conversión de tu Ecommerce.
BONUS 2
✅ Video Turtorial Pack 100 Códigos Liquids para Shopify ($17 USD) INCLUIDO: Video para que aprendas a incluír los codigos liquid personalizados en tu pagina de producto de Shoppify.
BONUS 3
✅ Acceso a Curso de Conversión en Shopify ($37 USD) INCLUIDO: Casi 2 horas de video para que aprendas a convertir más con tu tienda en línea.