► Mensagens Diversificadas |MD|: Blog

Pesquisar

Mostrando postagens com marcador Blog. Mostrar todas as postagens
Mostrando postagens com marcador Blog. Mostrar todas as postagens

aprenda como é feito: "Paginação Numerada para Blog"

Aqui neste espaço... 
Apenas divulgo e indico... 
Posts, notícias, dicas etc.

Com devidas fontes  e créditos deste presente postferramentasblog



..." para ajudar você a customizar seu template no Blogger, 
....agora, 
mudando os links de navegação de página 
padrões do Blogger, numerando cada página. "

"Tudo o que você puder fazer para facilitar a navegabilidade de seu blog é importante e uma dessas formas e permitir que o visitante percorra suas páginas uma por uma, passando pelo conteúdo que deseja."

..."o modelo "..."mostrar é como ilustra a imagem."



"... já mostramos outras formas de mudar o link de navegação das páginas"...

  • "Personalizar Links de Navegação do Blogger"

..." lembrar também que, antes de fazer qualquer modificação em seu blog principal, teste em um blog preparado para isso e faça um backup completo do seu blog original para não passar sustos e poder reverter as mudanças caso algo não saia como desejado."

"Inserindo paginação numerada no Blogger."

"O modelo "...
..."abaixo ...
..." no blog Blogger Widgets (em inglês). Veja o artigo original caso tenha alguma dúvida: Numbered Page Navigation For Blogger."

"Proceda da seguinte forma"

1. Abra o painel do Blogger em sua conta e clique no menu “Layout” ...

“Editar HTML”.

No código fonte de seu blog procure pela seguinte linha:

]]></b:skin>

2. Imediatamente ACIMA dela cole o seguinte código no  CSS (que determina as caracteríticas dos elementos que serão usados):


.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #cccccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #cccccc;
background-color:#cccccc;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #cccccc;
background: #cccccc;
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #cccccc;
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#333333;
}


..." Não altere nada aí e agora procure por </body> que estará bem no final do código-fonte. Também, imediatamente ACIMA dele, cole o trecho que segue:



<!-- Inicio do codigo de navegacao -->
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord =&#39;Anterior&#39;;
var downPageWord =&#39;Próximo&#39;;
</script>
<script src='http://blogergadgets.googlecode.com/files/blogger-page-navi.v1.js' type='text/javascript'/>
</b:if>
<!-- Final do codigo de navegacao -->


"Repare que o número na linha marcada de vermelho determina quantos artigos serão exibidos por página, então coloque o número adequado para o padrão do seu blog (já tratamos sobre a quantidade de artigos por página aqui: Quantidade e tamanho das Postagens na primeira página).
Já o número na linha rosa é a quantidade de números que aparecerá nos links de navegação."

"Escolha a quantidade de acordo com a estética e largura da área de postagem."

"...Salve e veja o resultado em seu blog."


OBS.:

Ao invez  do  do código indicado no
          item 2 (dois) , citado acima,
se preferir, 
pode-se usar o código a seguir:

/* PageNav
--------------------------- */
.showpageArea {
font-family:verdana,arial,helvetica;
color: #000;
font-size:11px;
margin:10px;  }

.showpageArea a {
color: #000;
text-shadow:0 1px 2px #fff;
font-weight: 700;
}
.showpageNum a {
padding: 3px 8px;
margin:0 4px;
text-decoration: none;
border:1px solid #999;
-webkit-border-radius:3px;-moz-border-radius:3px;
background: #ddd url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp1.jpg) 0 -50px repeat-x;
}
.showpageNum a:hover {
border:1px solid #888;
background: #ccc url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp1.jpg) 0 -25px repeat-x;
}
.showpageOf{
margin:0 8px 0 0;
}
.showpagePoint {
color:#fff;
text-shadow:0 1px 2px #333;
padding: 3px 8px;
margin: 2px;
font-weight: 700;
-webkit-border-radius:3px;-moz-border-radius:3px;
border:1px solid #999;
background: #666 url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp1.jpg) 0 0 repeat-x;
text-decoration: none;
}
.:.


Share:

uma prévia do AMP'ed resulta em Pesquisa...AMP seu conteúdo












fonte desta postagem: webmasters.googleblog 



AMPseu conteúdo - uma prévia do AMP'ed resulta em Pesquisa

"É 2016 e é difícil acreditar que a navegação na web sobre um telefone móvel ainda pode sentir tão lento com os usuários abandonando sites que simplesmente não carregam rapidamente. "Para nós - e muitos na indústria - ficou claro que algo precisava mudar.""Foi por isso que "começamos a trabalhar " com o "Pages Projeto móvel acelerada" , uma iniciativa de código aberto para melhorar a experiência de web móvel para todos."Menos de seis meses atrás , começamos a enviar as pessoas para páginas AMP na seção "Melhores histórias" da página de resultados de pesquisa do Google em telefones móveis. ''"Desde então, temos visto adoção global incrível de AMP que tem ido além da indústria de notícias para incluir e-commerceentretenimento, viagens, sites de receitas e assim por diante."
 "Até o momento, temos mais de 150 milhões de docs AMP em nosso índice, com mais de 4 milhões de novos que estão sendo adicionados a cada semana. Como resultado, hoje estamos compartilhando uma pré-visualização no início do nosso apoio AMP expandiu ao longo de toda resultados da pesquisa página --não apenas a seção "Melhores histórias".Para esclarecer, esta não é uma mudança de classificação parasites. Como resultado do crescimento da AMP além editores, queríamos tornar mais fácil para as pessoas a aceder a esta experiência mais rápida. A visualização mostra uma experiência em que os resultados da web que que têm versões AMP são marcados com O logotipo da AMPAo tocar nesses resultados, você será direcionado para a página de AMP correspondente dentro do visualizador AMP."





 
"AMP em Search Pré-Visualização"
"Experimentá-lo por si mesmo em seu dispositivo móvel ao navegar para g.co/ampdemo~~V . Uma vez que você está na demo, procurar algo como "receita rabanada" ou letras de música do seu artista favorito para experimentar como AMP pode fornecer uma experiência de leitura mais rápida na web móvel. O "Quem" página em AMPProject.org tem um sabor de alguns dos sites já criando conteúdo AMP.
Estamos começando com uma pré-visualização para obter feedback dos usuários, desenvolvedores e sites para que possamos criar uma melhor experiência de busca quando fazemos esse recurso de forma mais ampla disponível ainda este ano. Além disso, queremos dar a todos que possam estar interessados ​​em "amplificação up" seu tempo suficiente de conteúdo para aprender como implementar AMP e ver como o seu conteúdo aparece na demo. E além de desenvolvimento de páginas AMP, convidamos todos a se envolver e contribuir para o Projeto AMP.
Nós não podemos esperar para ouvir de você, como nós trabalhar em conjunto para acelerar a web. E como sempre, se você tiver alguma dúvida, por favor, visite o nosso webmaster fóruns ."
fonte desta postagem: webmasters.googleblog 
fonte desta postagem: webmasters.googleblog 




Share:

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

Share:

blogs - aqui !!!

...............................................................................................................................
 
    blogs  aqui !!!

...............................................................................................................................

 _______________________________________________________________

  ▼anunciosso


anunciosso


 _______________________________________________________________
. bloguepedia

http://bloguepedia.blogspot.com.br/

_______________________________________________________________ 

chinelosmaislindosqvi


_______________________________________________________________

 _______________________________________________________________
▼mensagensdiversificadas.com.br

 
 _______________________________________________________________
mensagensdiversificadas.blogspot




 _______________________________________________________________
. muitacoisah


 _______________________________________________________________
▼ recadosonlinecom

 

 _______________________________________________________________

▼ winkseemoticons



  _______________________________________________________________

 ▼ eisaquestaooo


http://eisaquestaooo.blogspot.com.br/
 _______________________________________________________________


  experienciaaaaa
 _______________________________________________________________



Share:

... configure seu email...!...(aprenda como)





@ e mail




  • mail
  •  
    ... configure seu email, e cole aonde desejar, por exemplo na sidebar (barra lateral de seu blog) .


    Logado no painel blogger.
    Vá até o "Layout" de seu template.
    Adicionar "GadGet".
    Copiar e colar no lado de html , do "gadget"
    E,
    Salvar
    e
    Pronto!

    ... configure seu email, e cole aonde desejar, por exemplo na sidebar (barra lateral de seu blog) .
    Veja o código ,  e altere o que está na cor azul, para o seu email:


    <li class='mail' title='Mail'><a href='mailto:envialinks.noticias@gmail.com' target='_blank'>mail</a></li>
    Share:

    "seu negócio on-line local - no site necessário!"

    "seu negócio on-line local - no site necessário! "


     




    Official Google Webmaster Central Blog (Oficial Google Webmaster Central Blog)








      

    Link para o Google Webmaster Central Blog


    Traga o seu negócio on-line local - no 
    site necessário!
     ▲


    Webmaster Nível: Iniciante

    "Ei, como faço para que meu negócio na web?" Tendo trabalhado no Google por nove anos, se eu tivesse um centavo para cada vez que alguém me fez essa pergunta ... :) Para responder, hoje estamos lançando uma série de vídeos curtos (30 minutos no total!), compartilhando o mesmo conselho que daria aos nossos amigos e familiares. É o conselho que eu daria a minha irmã, Marnie, que é dono de uma loja de jóias, ou meu primo, Scott, que trabalha como corretor de imóveis. Alerta de spoiler vídeo: Você não vai precisar fazer um site, mas você definitivamente precisa de um caminho para o seu negócio local para chegar a potenciais clientes usando seus celulares, tablets ou computadores desktop.

    Série de vídeos para ajudar os empresários locais de todos os níveis técnicos para começar seu negócio encontrado na web. Centra-se sobre os benefícios da criação de uma página de negócios Yelp , Facebook page , Google+ página , etc

    A grande coisa sobre o vídeo é que você pode pausar a qualquer momento e trabalhar no seu próprio ritmo. Da próxima vez que você ouvir a pergunta: "Como faço para que meu negócio no Google?", Por favor, compartilhe o link e vamos negócios mais locais online!

    Série: Construir uma presença online para o seu negócio local

    Vídeo # 1: Introdução e temas quentes (3:22)

    Conheça a minha irmã, Marnie, dono de uma loja de jóias e meu primo, Scott, que trabalha como corretor de imóveis. Siga-os como falamos sobre as grandes mudanças na última década, como ter certeza que seu negócio pode atingir os clientes no trabalho, em casa ou on-the-go usando seus telefones celulares.
    Vídeo # 2: Determine o seu negócio "valor agregado e objetivo em linha (04:08)
    Com o exemplo de Scott, o corretor de imóveis, você vai aprender sobre o funil de marketing, definindo uma meta online, e destacando o que faz o seu negócio especial.
    Vídeo # 3. encontrar clientes potenciais (07:41)
    Marnie e Scott descobrir percursos mais comuns de seus clientes para alcançar seus negócios. Vamos usar o exemplo deles para discutir como você pode atingir clientes em sites de avaliação, através de motores de busca, mapas, aplicativos e sites de redes sociais e profissionais.
    Vídeo # 4: implementação básica e melhores práticas (5:23)
    Os fundamentos e as melhores práticas para ter o seu negócio de offline para online!
    Vídeo # 5: diferenciar a sua empresa da concorrência (05:09)
    Com o negócio de Scott como um corretor de imóveis, veja como a demonstrar que o seu negócio local é a melhor escolha para os clientes, adicionando fotos, vídeos, e recebendo críticas.
    Vídeo # 6: envolver os clientes com uma identidade on-line holística (04:51)
    Vamos terminar a série, mostrando como Scott garante sua presença on-line envia uma mensagem coesa aos clientes e responde a todas as suas perguntas comuns. :)
    Escrito por Maile Ohye , Developer Programas tecnologia chumbo


    Share:

    Seguir por e-mail

    Seguidores

    Google+ Followers

    arquivo

    Google+ Badge

    "Alô Negócios !!!…buscas populares"

    Alô Negócios !!!…buscas populares