"como adicionar infinito efeito"... /..."pós rolagem para blogger"" Infinite Post Scrolling Effect"
???
Este tutorial/dica, é:
▼
...sobre :"como adicionar...
" infinito efeito"
"pós rolagem para blogger"
...caso você
não entenda o que é
"infinito efeito
pós desdobramento",
▼
...vá para a página : Facebook
e role a página...e
veja
...como, exemplo de
"infinit scroll":
poderá observar,
que a página
rolará infinitamente ...▼
que a página
rolará infinitamente ...▼
► lá no facebook, você verá "auto carregamento "(rolagem)...
...entradas mais antigas ...
► o efeito é chamado de: "rolagem infinita."
..."é um trabalho baseado em "jQuery"
Bem,
...depois de adicionar esse "script", de "infinit scroll"para o seu blog,...você notará ao rolar a página deos outros posts
..."post antigo"
...serão "mostrados automaticamente"
conforme este exemplo ...
acessando aqui e verá + demonstração do efeito em epígrafe...
...isto significa que você não precisa clicar em postagens antigas...
"O principal benefício "
...usando essa versão ,
verá que
você vai poder carregar a
"rolagem infinita "
em
cada página,
página de arquivo
e
página de busca,
enquantoqueo "script "
não irá carregar
em sua página item
e
páginas estáticas,
ou seja,
posts e páginas.
Significando, por conclusão, que seu blog serámais ágil e rápido.
Programa demonstrativo ►clica aqui◄
Agora,
vejamos
"Como adicionar "Infinito Mensagem Scrolling" Efeito Para Blogger?
Nota:
Este "script" só funciona em "modelos padrão do Blogger"
ou naqueles que
não são "modelo" ,
porém,
"altamente personalizado".
- Primeiro Passo:
Logado em seu painel do blogger ->
Ir para:
-> 1 - Modelo
-> 2 - Editar HTML
vide exemplo na imagem a seguir:
Clique em em
"Editar HTML " (caixa de seleção)
. Agora,
procure por </head> ,
no código html de seu template.
Assim:
...dê um clique com o botão direito do mouse ,
na tela do código de html de seu template, e verá aparecer um espaço em branco, na lateral direita/superior, e escreva ali:
</head>,
...em seguida dê um "ENTER", via teclado,
e encontrará a palavra buscada no html de seu template, no caso
aqui,
a palavra é </head>
...
Encontrando: </head> (palavra/código), buscada...
Copie e cole,
logo acima de </head>,
o código a seguir:
▼
<b:if cond='data:blog.pageType == "index"'> <script src='https://sites.google.com/site/scriptsedilenebds/ scripts/jquery.min...jQuery% 20v1.9.1.js'></script> <script src='https://sites.google.com/ site/scriptsedilenebds/ scripts/jquery.ias. minInfinito%20Scroll%20Ajax% 2C%20um%20plugin%20jQuery.js' type='text/javascript'></ script> <script type='text/javascript'> jQuery.ias({ container : '.blog-posts', item: '.post-outer', pagination: '#blog-pager', next: '#blog-pager-older-link a', loader: 'http://1.bp.blogspot.com/- kdPMrXPLEzk/UaB_PY7LxvI/ AAAAAAAASE4/vxjD_2pkTtI/s1600/ loading.gif'});</script></b: if>
Salve!
Pronto !
Atenção:
Remover no código
acima ,
a linha ,
caso o seu blog
já tenha
o plugin
"jQuery"
obs.:
..."originalmente ,
esse script foi criado
por Simplex design.
Bom,
espero ter ajudado!!!
Qualquer dúvida entre em contato!
:)
ou
escreva nos comentários
ou
via
