Tombol Back to Top for Blogger new

Tombol Back to Top

Hoje vamos apresentar o Tombol back to top para Blogger isso é elegante e também tem faz toda a diferença uma vez que isso vai facilitar a navegação para os visitantes voltando rápidamente para o topo da página muito utilizado quando nós temos um menu com categorias o que vai ajudar seus visitantes para instalar isso no seu template siga os passos abaixo



Instalando tombol back to top no Blogger 

Faça login no blogger então va no menu tema Editar HTML/JavaScript com as teclas combinadas 
CTRL+F busque por ]]></b:skin> e adicione antes disso o seguinte código:

#myBtn {display:none;position: fixed;bottom: 20px;right:30px;z-index:99;border:none;outline:none;background-color:#357ae8;color: white;cursor: pointer;padding: 15px;border-radius: 10px;font-size:20px}
#myBtn:hover {background-color: #555;}


Então busque por </body> e antes disso copie e cole o seguinte código.

<script type='text/javascript'>
//<![CDATA[
window.onscroll = function() {scrollFunction()};
function scrollFunction() {
    if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
        document.getElementById("myBtn").style.display = "block";
    } else {
        document.getElementById("myBtn").style.display = "none";
    }
}
function topFunction() {
    document.body.scrollTop = 0; // For Chrome, Safari and Opera
    document.documentElement.scrollTop = 0; // For IE and Firefox
}
//]]>
</script>


Salve e pronto se desejar pode instalar uma fontawesome acima de </head> 

<link href='//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css' rel='stylesheet'/>

Salve e pronto 

Click to comment