Sello de Mercadolibre para tu tienda de Shopify.
Copia y pega este código a continuación en una sección de liquid personalizado en tu tienda de Shopify tal y como se explicó en el video:
<!--INICIO SELLO MERCADO LIBRE-->
<style>
.mp_platinum {
min-width: 290px;
max-width: 100%;
margin: 20px auto 0;
padding: 10px;
border: 0px solid #0000001a;
border-radius: 10px;
box-shadow: 0px 8px 4px -4px /*#e5e5e5*/ #fff;
}
.mp_platinum li {
list-style: none;
}
.mp_platinum p {
margin: 5px;
}
.ui-box-component-pdp__visible--desktop {
width: 100%;
border-radius: 8px;
border: 1px solid rgba(0,0,0,.1);
margin: 24px 0;
padding: 32px 16px 24px;
}
.ui-seller-info__status-info {
display: -webkit-flex;
display: flex;
margin-bottom: 20px;
}
.ui-seller-info__status-info__icon {
margin: 2px 10px 0 0;
width: 20px;
text-align: center;
}
.ui-pdp-color--GREEN.ui-pdp-icon {
fill: #00a650;
}
.ui-pdp-seller__status-title {
font-size: 16px;
font-weight: 600;
color: #00a650;
padding: 0;
margin: 2px 0 -12px 0 !important;
}
.ui-seller-info__status-info__subtitle {
font-size: 14px;
color: rgba(0,0,0,.55);
margin: 5px 0 0 0 !important;
}
.ui-thermometer {
width: 100%;
height: auto;
margin: 0;
padding: 0;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
overflow: hidden;
display: block;
-moz-box-sizing: border-box;
box-sizing: border-box;
vertical-align: baseline;
}
.ui-thermometer__level {
width: 20%;
height: 8px;
margin-top: 2px;
-moz-box-sizing: border-box;
box-sizing: border-box;
float: left;
border-left: 6px solid #fff;
}
.ui-thermometer__level--1 {
background: #fddbdb;
}
.ui-thermometer__level--2 {
background: #ffe0b8;
}
.ui-thermometer__level--3 {
background: #fff8a5;
}
.ui-thermometer__level--4 {
background: #ccff5d;
}
.ui-thermometer[value="5"] .ui-thermometer__level--5 {
height: 12px;
margin: 0;
background: linear-gradient(to top,#09a149, #19c461);
}
.ui-pdp-seller__reputation-info {
margin-top: 16px;
}
.ui-pdp-seller__list-description {
display: -webkit-flex;
display: flex;
justify-content: center;
margin: 0;
padding: 0;
}
.ui-pdp-seller__item-description {
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-align-items: center;
align-items: center;
text-align: center;
font-size: 12px;
position: relative;
line-height: 1;
padding: 8px 5px;
}
.ui-pdp-seller__sales-description {
font-size: 24px;
color: #000;
line-height: 1.2;
font-weight: 400;
display: block;
}
.ui-pdp-seller__text-description {
margin-top: 8px;
line-height: 1;
}
.ui-pdp-seller__item-description:after {
background: #ddd;
content: "";
height: 91%;
position: absolute;
right: 0;
top: 8%;
width: 1px;
}
.ui-pdp-seller__item-description:last-of-type:after {
display: none;
}
.ui-pdp-seller__icon-description {
display: inline-block;
width: 28px;
padding-top: 3px;
vertical-align: top;
}
.ui-pdp-icon, .ui-pdp-icon--shipping {
fill: rgba(0,0,0,.25);
}</style>
<div class="mp_platinum">
<div class="ui-seller-info">
<!-- Inicio del termometro -->
<ul aria-hidden="true" class="ui-thermometer" value="5">
<li class="ui-thermometer__level ui-thermometer__level--1"></li>
<li class="ui-thermometer__level ui-thermometer__level--2"></li>
<li class="ui-thermometer__level ui-thermometer__level--3"></li>
<li class="ui-thermometer__level ui-thermometer__level--4"></li>
<li class="ui-thermometer__level ui-thermometer__level--5"></li>
</ul>
<!-- Final del termometro -->
<div class="ui-pdp-seller__reputation-info">
<ul class="ui-pdp-seller__list-description">
<li class="ui-pdp-seller__item-description">
<!-- Inicio cantidades de ventas -->
<strong class="ui-pdp-seller__sales-description">5.249</strong>
<!-- Final cantidades de ventas -->
<p class="ui-pdp-seller__text-description">Pedidos entregados en los últimos 60 días</p>
</li>
<li class="ui-pdp-seller__item-description">
<strong aria-hidden="true" class="ui-pdp-seller__icon-description">
<svg class="ui-pdp-icon ui-pdp-icon--message-positive ui-pdp-color--REP_SELLER_ATTENTION_GOOD" viewBox="0 0 29 24" xmlns="http://www.w3.org/2000/svg">
<g fill-rule="evenodd" fill="none">
<path d="M6.747 21.511l4.538-3.518h8.238c1.032 0 1.868-.98 1.868-2.19V3.21c0-1.21-.836-2.19-1.868-2.19H3.173c-1.032 0-1.869.98-1.869 2.19v14.077c0 .39.316.706.706.706H5.61v2.96a.706.706 0 0 0 1.138.558z" stroke-width="1.5" stroke="#333"></path>
<g transform="translate(14 9)">
<circle cx="7.5" cy="7.5" r="7.5" fill="#39B54A"></circle>
<g stroke-linecap="round" stroke-width="1.059" stroke="#FFF"><path d="M3.75 7.5l2.445 2.445M6.25 9.89L11.14 5"></path></g>
</g>
</g>
</svg>
</strong>
<p class="ui-pdp-seller__text-description">Brinda buena atención</p>
</li>
<li class="ui-pdp-seller__item-description">
<strong aria-hidden="true" class="ui-pdp-seller__icon-description">
<svg class="ui-pdp-icon ui-pdp-icon--time-positive ui-pdp-color--REP_SELLER_DELIVERY_TIME_GOOD" viewBox="0 0 30 26" xmlns="http://www.w3.org/2000/svg">
<g fill-rule="evenodd" fill="none">
<g transform="translate(1 .02)" stroke="#333">
<ellipse cx="10.5" cy="13.714" rx="10.5" ry="10.286" stroke-width="1.286"></ellipse>
<path d="M19.107 13.714h-1.59M3.42 13.714H1.83M10.5 5.143v1.59M10.563 20.571v1.59M10.5.857v2.484M8.75.857h3.637M10.313 8.801v4.944H5.24" stroke-linecap="round" stroke-width="1.102"></path>
</g>
<g transform="translate(15 10.02)">
<circle cx="7.5" cy="7.5" r="7.5" fill="#39B54A"></circle>
<g stroke-linecap="round" stroke-width="1.059" stroke="#FFF"><path d="M3.75 7.5l2.445 2.445M6.25 9.89L11.14 5"></path></g>
</g>
</g>
</svg>
</strong>
<p class="ui-pdp-seller__text-description">Entrega sus productos a tiempo</p>
</li>
</ul>
</div>
</div>
</div>
<!--FINAL - SELLO DE MERCADO LIBRE-->¿Cómo conseguir más códigos para personalizar mi tienda 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 cnvertir más con tu tienda en línea.