. "como adicionar infinito efeito"... /..."pós rolagem para blogger"

. "como adicionar infinito efeito"... /..."pós rolagem para blogger"


"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  ...





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 de

..."post antigo"  

 ...serão  "mostrados automaticamente"
     os outros posts 
     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,  
enquanto que o "script "
não irá carregar  
em sua página item 

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

Postar um comentário

0 Comentários