Como manter um BLOCO ESPECÍFICO FIXO na tela

Para manter um bloco específico fixo na tela, enquanto os visitantes navegam pelo seu site, siga o tutorial abaixo:

Faça login na sua conta no GreatPages e acesse o editor de páginas;



Acesse o ícone de engrenagem no canto superior direito da tela, e acesse "Javascript & CSS";





Clique para Adicionar Código;



Dê um nome para ele, marque a opção "Funcionamento" e adicione no campo de texto todo o código abaixo;

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.js" integrity="sha512-OKuL2kpi8zfeXcqSXnGbL6tKc9JxWmppJY4mOSn1EsngRb7fx1N5+7wOTGqu2bI5OAYL3Og7/Beg7EsWG2OBKA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/waypoints/2.0.0/waypoints.js" integrity="sha512-xjWGTKsazDQnXiepigJTjsn8I3bBqsF4/RHgN0o6x1NcwHRx+E855W0Y3TkoSAgbGTlbVa2+aOBPg495xQLIqA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/waypoints/2.0.0/shortcuts/sticky-elements/waypoints-sticky.js" integrity="sha512-yYjfLAEXKNzVXBO9RGPJ8qV2NdO5LlQ0Y9IXg6rBMMpgCX/utB56Z3qK2vLzTa6ro8zm/RWqOOCv1hE2lGfUsw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script>
$(document).ready(function(){
$('#b_208024').waypoint('sticky');
});
</script>
<style>
.stuck{position:fixed; width:100%; top:0; z-index: 999999;}
</style>



A única coisa que você precisará editar neste código é o ID do bloco que ficará fixo na tela. Este "ID" fica localizado no local indicado abaixo.



Veja neste link como encontrar o ID do bloco na sua página -> https://ajuda.greatsoftwares.com.br/pt-br/article/como-identificar-o-id-de-um-bloco-no-greatpages-ylaft7/

Depois de configurar o ID do bloco, clique para Salvar!

Atualizado em: 12/04/2023