Agregar opción de “Leer más”

caraf

Beta
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Usuario con pocos negocios!
Desde
23 Jun 2015
Mensajes
68
Buenas!

Tengo una tienda en Shopify, y me gustaria agregar la opción de “Leer más”/“Read more” luego de las 100 palabras en las descripciones de mis productos.

Algo así como esto:

32.jpg

Que código deberia agregar (y donde)?

Muchas gracias
 
Última edición:

Jhertz

Beta
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Usuario con pocos negocios!
Desde
27 Ago 2020
Mensajes
70
Deberías utilizar Javascript, puedes agregar este fragmento al final de tu product-template.liquid:


HTML:
<script type="text/javascript">
(function() {
    function truncarDescripcion(num_words = 100) {
        let selector = document.querySelectorAll('.product-single__description')[0];
        let description = selector.innerText;
        if (description.split(" ").length > num_words) {
            selector.innerText = description.split(" ").splice(0, num_words).join(" ") + '...';
            selector.insertAdjacentHTML('afterend', `<div class="text-center">
                <a href="#" class="btn">Leer más</a>
            </div>`);
        }
    }
    truncarDescripcion(100);
})();
</script>
 

caraf

Beta
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Usuario con pocos negocios!
Desde
23 Jun 2015
Mensajes
68
Deberías utilizar Javascript, puedes agregar este fragmento al final de tu product-template.liquid:


HTML:
<script type="text/javascript">
(function() {
    function truncarDescripcion(num_words = 100) {
        let selector = document.querySelectorAll('.product-single__description')[0];
        let description = selector.innerText;
        if (description.split(" ").length > num_words) {
            selector.innerText = description.split(" ").splice(0, num_words).join(" ") + '...';
            selector.insertAdjacentHTML('afterend', `<div class="text-center">
                <a href="#" class="btn">Leer más</a>
            </div>`);
        }
    }
    truncarDescripcion(100);
})();
</script>

Gracias compañero! Pero lo probé y no funcionó. Alguna otra sugerencia?
 

Crea una cuenta o accede para comentar

Debes ser un miembro para poder comentar

Crear cuenta

Crea una cuenta en nuestra comunidad

Acceder

¿Ya tienes una cuenta? Accede aquí


Arriba