Muitas pessoas me perguntam como fazer para que o um site WordPress carregue as imagens apenas depois de o usuário rolar a página, ou seja, apenas quando a imagem em questão se tornar visível, assim como acontece aqui no Escola Sites. Hoje resolvi ensinar a todos com um manual bem prático e fácil. Com o efeito fade você faz um retoque bem interessante para o site e ainda deixa o carregamento do site mais rápido.
O plugin Lazy Load é um plugin feito em javascript que usa jQuery para funcionar, com este plugin instalado as imagens serão carregadas apenas quando se tornarem visíveis para os leitores do blog. Em muitos blogs alguns artigos se tornam grandes e o uso de imagem é alto, fazendo com que esta página se torne pesada e demore para carregar, com este plugin o carregamento se torna mais rápido, pois as imagens são carregadas apenas se o usuário necessitar da mesma, caso contrário o download da imagem não é feito.
Como utilizar o JQuery Lazy Load
Para inserir o plugin Jquery em seu blog, seria necessário ter algum conhecimento de Javascript, abrir o seu template e incluir alguns códigos. Como sei que nem todos possuem, e nem precisam ter, conhecimentos de programação, existe um plugin fantástico do WordPress que faz todo o trabalho sujo pelo usuário, com isso você precisa apenas saber instalar um plugin JQuery, o que já ensinamos por aqui, consulte o artigo Como instalar plugins no WordPress.
Na tela de pesquisa de plugins, pesquise por Lazy Load, o primeiro plugin nos resultados é justamente o plugin que iremos usar. Ele tratará de incluir em seu tempalate, os arquivos necessários e a chamada, caso você deseje pode editar o plugin de uma maneira bem fácil de maneira que ele não atue em certas posições de seu template, como sidebar, onde estão as publicidades e devem sempre estar visíveis.
Problemas com o JQuery Lazy Load
Alguns leitores e amigos já me questionaram com relação a algumas incompatibilidades com alguns templates, fazendo com que o plugin não funcione, caso tenha algum problema relacionado a isso não hesite em deixar sua dúvida nos comentários.
E você gostou do plugin?
Jair Rebello
Editor-chefe do Escola Sites. Analista de Sistemas, empreendedor e blogueiro que dedica parte de seu tempo para a partilha de material de grande qualidade relacionados a Wordpress, SEO, Tableless, JQuery, PHP e outras tecnologias Web.
16 de agosto de 2012 - 11:19
Boa dica, Jair..isso vai ajudar a diminuir o tempo de carregamento do site..valeu!!
20 de agosto de 2012 - 13:07
Ueritom, certamente além de dar uma beleza a mais para o site ou blog, o plugin também ajuda a fazer com que o site carregue mais rápido.
Abraços,
16 de agosto de 2012 - 17:43
Concordo com ueritom! Vou ate testar em um site novo!
20 de agosto de 2012 - 13:08
Almy, assim que acabar os seus testes, queira nos dar o feedback quanto ao uso do plugin seria bem legal que os leitores pudessem ter mais um testemunho de que o plugin é ótimo.
Abraços,
16 de agosto de 2012 - 23:32
Obrigado pela Dica!!!
tenho certeza que ajudou muita gente com a dica! ;D
http://yourtrick.com.br
20 de agosto de 2012 - 13:09
Marcos, espero que muita gente tenha lido e gostado do que publicamos por aqui
20 de agosto de 2012 - 1:22
Pessoal, não achei as opções do plugin…
vou analisar com mais calma amanhã, 02:22 da madruga, muito cansado…
Abraços!
Anderson Ferro
20 de agosto de 2012 - 13:13
Anderson, o plugin não apresenta opções, é apenas instalar e correr pro abraço, se não funcionou é porque deu conflito com alguma biblioteca.
20 de agosto de 2012 - 1:38
(y) Antes de ir deitar, não resisti e fui testar outro Plugin e testei este: “BJ Lazy Load” e ai sim conseguir as opções e deu certo, imagens sendo carregadas conforme aparece.
Confira no meu blog:
http://blog.andersonferro.com.br
Abração e sucesso a todos!
Anderson Ferro
20 de agosto de 2012 - 13:14
Anderson, que bom que conseguiu de um jeito ou de outro, creio que não tenha funcionado por conflito com jQuery’s que já estão no seu website.
21 de agosto de 2012 - 16:00
ola, pessoal gostaria se vcs puder me dar uma força aqui com a questão de blostar fotos no blogger. eu trabalho em uma escola e gostaria de aprender como faço uma galeria de fotos para disponibilizar no blog, pois sou iniciante nesta area. no mais obrigada
23 de agosto de 2012 - 10:04
Lucimar, pedimos desculpas imensas mas estamos sem editores especializados em blogger, acesse o blogando com facilidade, lá existe muito conteúdo para blogger e deve ter o que você precisa.
Abraços,
26 de agosto de 2012 - 9:30
Sem dúvida um excelente plugin para quem utiliza WordPress e se preocupa com a otimização, já utilizado no Emprego Dinheiro e com o efeito desejado.
27 de agosto de 2012 - 8:21
ED, que bom que consegue usar o template sem maiores problemas. Afinal, alguns blogueiros sofrem dificuldade por ter alguns conflitos com outros plugins.
Abraços,
27 de agosto de 2012 - 14:56
Muito bom, eu gostei
28 de agosto de 2012 - 8:09
Criação, que bom que gostou.
Abraços,
5 de outubro de 2012 - 23:06
Olá, não consegui dar o efeito fade que vocês dão aqui. Obrigado
15 de outubro de 2012 - 16:14
Rafael, deve estar havendo algum conflito com outro código Jquery, verifique.
Abraços,
22 de outubro de 2012 - 13:39
Olá, o plugin é muito bom, obrigado. Diminuiu o carregamento co meu site em 30% mais as otimizações de imagens que eu fiz no site inteiro, o carregamento caiu em +- 55% valeu pela dica, estava mesmo precisando deste plugin, é rapido e bem leve!