Bricks 1.4 Tutorial Botón Ir Arriba (scroll top Button)

Aprenderemos a incorporar un botón de Ir Arriba (scroll top Button) con el constructor visual Bricks 1.4 para WordPress, ya que hasta esta versión no incorpora ningún elemento que lo realice.

Se trata de incorporar un pequeño código JavaScript dentro de la plantilla del pie de página del sitio web, pues tiene que estar incluido dentro de un elemento que se visualice en todo el sitio y el pie de página es un lugar muy apropiado para ello.

En este vídeo te explico cómo se hace

Tal como comento en el tutorial del vídeo, aquí os pongo el código JavaScript y CSS que necesitáis para que funcione el botón de Ir arriba (scroll top Button)

Código para poner en el elemento Código de Bricks

<script type="text/javascript">
var scrollTopBtn = document.querySelector('#scroll-TOP');


window.onscroll = function() {scrollFunction()};

function scrollFunction() {
if (document.body.scrollTop > 600 || document.documentElement.scrollTop > 600) {
scrollTopBtn.style.display = "block";
} else {
scrollTopBtn.style.display = "none";
}
}

scrollTopBtn.addEventListener('click', function(){
window.scroll({top: 0, left: 0, behavior: 'smooth'});
});
</script>

CSS personalizado para incluir en el botón Ir Arriba

<style>
root{cursor:pointer;}
</style>

Si necesitas el Tema Bricks para tu página Web, puedes descargarlo a un precio competitivo y con 1 año de actualizaciones, desde La Caja de Experiencia.

Quiero Descargar Bricks

No olvides suscribirte a mi canal de Youtube