Melhores plug-ins de rolagem suave do WordPress gratuitos 2022
Publicados: 2021-11-09
Se você criou um site, mas o conteúdo do site é muito longo e difícil de entender nessa situação, você pode usar os plug-ins de rolagem suave do WordPress.
Os plugins de rolagem suave do WordPress ajudarão você a rolar o site para cima e para baixo com muita facilidade. Isso não apenas melhorará a experiência do usuário do seu site, mas também terá um grande efeito na taxa de conversão. Porque seu usuário ficará engajado em seu site por mais tempo.
Como adicionar uma rolagem suave ao efeito superior no WordPress usando jQuery?
Você quer saber por que vários outros sites têm um efeito de rolagem suave para o topo da página? É ideal para adicionar um efeito de rolagem suave na parte superior se você tiver uma página longa.
Isso ajuda a melhorar a experiência do usuário em sua página e, ao mesmo tempo, torna mais fácil para eles voltarem rapidamente ao topo.
Agora a questão é: como você adiciona uma rolagem suave ao efeito superior em seu site WordPress? Bem, você pode fazer isso facilmente usando jQuery. Aqui vamos falar sobre como você pode fazer isso facilmente usando jQuery. Leia:
O que é Smooth Scroll e quando usá-lo?
Caso uma página ou postagem tenha muito conteúdo, os usuários devem rolar para baixo para ler todos. À medida que os usuários começam a rolar para baixo, seus links de navegação começam a subir.
Quando o usuário termina de ler, ele precisa rolar para ver se resta alguma coisa para ele. Rolar até o botão superior permite que o leitor entre em operação rapidamente. Você pode optar por adicionar este link de texto sem a necessidade de usar jQuery.
<a href="#" title="Voltar ao início">^Início</a>
Ele vai enviar os leitores para o topo da página enquanto rola para cima em uma fração de segundo. Funciona como um funcional.
No entanto, a rolagem suave é o oposto disso. A rolagem suave ajuda o usuário a deslizar de volta para a área superior da página. Isso ajuda a melhorar a experiência dos usuários em seu site.
Adicionando rolagem suave ao efeito superior com jQuery no WordPress?
Se você quiser adicionar uma rolagem suave ao efeito superior, poderá usar jQuery. Simultaneamente, você precisará adicionar um pouco de CSS junto com uma única linha para o código HTML no tema do seu WordPress.
Para começar, primeiro você precisa abrir um editor de texto, como o Bloco de Notas. Agora você precisa criar um arquivo e salvá-lo como smoothscroll.js. Agora você precisa copiar e colar um código na área do arquivo:
jQuery(document).ready(function($){
$(janela).scroll(function(){
if ($(this).scrollTop() < 200) {
$('#smoothup') .fadeOut();
}
senão {
$('#smoothup') .fadeIn();
}
});
$('#smoothup').on('click', function(){
$('html, corpo').animate({scrollTop:0}, 'fast');
retorna falso;
});
});
Agora você precisa salvar o arquivo. Depois disso, você pode enviá-lo para a pasta /js / do diretório de temas do WordPress. Caso seu tema não tenha um diretório /js/, você deve começar criando um.
Depois disso, você pode fazer upload do smoothscroll.js para este diretório. Esse código é chamado de script jQuery, que adicionará um efeito de rolagem suave ao botão. Basicamente, vai ajudar o usuário a ir suavemente para o topo da página.
Depois disso, você precisa adicionar este smoothscroll.js à sua área de tema. Se você quiser fazer isso, você precisa adicionar um script no WordPress. Aqui está o script ou o cod que você precisa colar no arquivo functions.php do seu tema:
wp_enqueue_script('suavizar', get_template_directory_uri() . '/js/smoothscroll.js', array('jquery' ), ”, true );
Este código envia ao WordPress o comando do script. Ao mesmo tempo, também informa ao WordPress para carregar a biblioteca jQuery, pois o plug-in depende dela.
Ao terminar de adicionar a parte jQuery, agora você precisa adicionar o link real para o site do word press, que levará o usuário de volta à área superior. Você precisa colar um código HTML em qualquer lugar no arquivo footer.php do seu tema:
<a href="#top" title="Voltar ao início"></a>
Esta etapa inclui a adição do link ao arquivo, mas não está vinculado a nenhum texto. É assim, porque você precisa usar um ícone de imagem para a seta para cima, que permitirá que você exiba um botão de volta ao topo.
Veja como você pode adicionar um ícone de 40x40px à folha de estilo do seu tema:
#suavizar {
altura: 40px;
largura: 40px;
posição: fixo;
inferior:50px;
direita: 100px;
text-indent:-9999px;
Mostrar nenhum;
background: url("http://www.example.com/wp-content/uploads/2013/07/top_icon.png");
-webkit-transição-duração: 0,4s;
-moz-transição-duração: 0,4s; duração da transição: 0,4s;
}
#suavizar:passar {
-webkit-transform: girar(360deg) }
background: url('') sem repetição;
}
No CSS mencionado acima, você optou por congelar a posição do ícone da imagem. Também inclui o uso de um ícone de imagem como imagem de fundo. Agora você precisa fazer o upload do seu ícone de imagem com a ajuda do carregador de mídia do WordPress.
Então você pode obter o URL da imagem que você precisa colar como o URL de fundo. Como você adicionou uma animação CSS ao botão que continua girando o botão, o usuário mantém o ponteiro do mouse sobre o botão.
Agora você precisa rolar até o efeito superior, que permitirá que os usuários voltem à área superior e encontrem o que mais podem fazer em seu site.
Você também pode adicionar um rodapé flutuante de volta para fazer com que o conteúdo do recurso tenha uma exibição fácil. Caso você não queira que seus usuários rolem até a área superior para compartilhar o artigo, você pode usar o plug-in flutuante da barra de compartilhamento social para torná-lo muito mais gerenciável.
Plugins de rolagem suave de 2022 – muito leves e rápidos
Os plug-ins de rolagem suave do WordPress certamente funcionarão de maneira muito mais rápida e eficaz em todos os outros dispositivos e navegadores sem qualquer dificuldade.
Além disso, funciona muito bem com outros plugins como Yoast SEO, Contact Form 7, NextGen Gallery, Slider Revolution, WooCommerce, construtores de páginas SKT, Visual Composer e Elementor e muitos mais.
Sites de negócios de grande escala ou de pequena escala, como blog, site de portfólio, site de consultoria, site corporativo, site relacionado a comércio eletrônico, agência criativa, site imobiliário, CV pessoal, site de empresa de varejo, etc. aparência do site.
Muitos plugins gratuitos de rolagem do WordPress estão disponíveis, mas destacamos a maioria dos plugins de rolagem suave que todos os seus visitantes vão adorar. Por favor, verifique abaixo.
1. Role a página até o id :
O Page scroll to id é um software de código aberto totalmente caracterizado e fornecido com recursos e funcionalidades bem desenvolvidos. Dá-lhe um efeito de animação de rolagem suave.
O plug-in de rolagem da página para id é ajustável. Com a ajuda de id e offset mencionados, este plugin irá calcular o tamanho da página e configurá-lo automaticamente.
2. Menu Fixo (ou qualquer coisa!) em Scroll:
O menu fixo (ou qualquer coisa) no plugin de rolagem está disponível gratuitamente. ele ajuda você a fazer um menu ou qualquer elemento pegajoso. Depois de clicar em um elemento fixo, ele rolará diretamente para o topo da página. Você apenas exigiu alguns conhecimentos básicos de HTML/CSS para remover o elemento correto que deseja tornar fixo.
3. Rolagem infinita do WordPress – Ajax Carregar mais:
O Ajax Load more foi criado especialmente para um usuário do WordPress para que ele possa rolar o site sem problemas. Ajax load more ajuda a carregar posts preguiçosos, posts únicos, páginas e comentários. Esses plugins são mais conhecidos por plugins de comércio eletrônico como WooCommerce
4. Links fáceis de rolagem suave:
Você pode criar um recurso de baixo para cima por conta própria. porque SEasy Smooth Scroll Links é um plugin personalizável e muito leve.
Você só precisa escolher qualquer uma das imagens para definir os elementos de rolagem. Além disso, você pode ajustar a posição do elemento para a esquerda, centro, lado direito. Este plugin também é um software de código aberto.
5. Rolagem suave da roda do mouse:
O plugin MouseWheel Smooth Scroll é muito suave para rolar para todos os links de âncora. Geralmente é colocado no lado direito, que rolará a página de baixo para cima.
Portanto, este plugin suporta RTL e não cria itens de menu inúteis no painel do WordPress.
6. Rolagem suave por WPOS:
Como o plug-in Smooth Scroll by WPOS é leve, é possível personalizar facilmente a rolagem de cima para baixo em todas as páginas. Você não precisa escrever nem uma única linha de código.
Pode-se ajustar a velocidade da animação, tipo, altura, largura, etc. conforme sua necessidade. Este plugin funciona melhor com o construtor de páginas Elementor
7. Rolagem simples para o botão superior:
Pode-se adicionar um efeito de rolagem suave ao link âncora, mas na mesma página. Esses efeitos podem ser aplicados a postagens e páginas inteiras ou a postagens e páginas específicas. Você pode encontrar essa configuração na configuração do painel >> Simples Scroll to Top Button.
– Escolha para se inscrever em todos os posts e páginas
- Escolha apenas a página inicial
– Escolha apenas as páginas específicas
- Escolha apenas as postagens específicas
- Decida a velocidade da rolagem
8. NS Rolagem suave de volta ao topo:
O Surbma tem usuários mais ativos. Como este plugin também é uma rolagem suave. Você pode obter o efeito de cada link âncora em seu site. Um efeito de rolagem suave pode ser adicionado ao menu ou a qualquer parte de navegação.
Você nem precisa personalizá-lo porque não há opção fornecida para este plugin. Se você tiver conhecimento e experiência sobre a programação JavaScript e WordPress, poderá fazer algumas alterações conforme sua necessidade. Mas se você não tiver, sugiro que não toque nele. pois ele começará a funcionar imediatamente após a instalação.
9. Rolagem superior do WPFront:
Você pode rolar facilmente de baixo para cima usando o WPFront Scroll Top Plugin. É totalmente personalizável com diferentes opções para escolher. Com alguma animação, ele será rolado de volta para cima.
Você pode criar texto, imagens e botões por conta própria. também você pode filtrar páginas e posts.
10. Pegue o Pergaminho Infinito:
Catch Infinite Scroll ajudará você a aumentar o envolvimento do usuário em seu site. A principal razão por trás disso é um scroll infinito do Jetpack. Depois que seus plugins estiverem instalados e ativados, seu cliente e usuário poderão rolar a página do site.
Todos esses são os principais plug-ins de rolagem suave do WordPress gratuitos 2022.