Mostrando postagens com marcador botão. Mostrar todas as postagens
Mostrando postagens com marcador botão. Mostrar todas as postagens

botão voltar ao topo do blog, com "efeito-scroll" (deslizante)


 
 Botão "voltar  ao topo  do blog", com "efeito-scroll" (deslizante)


Tutorial:

Primeiro:

Logado no seu painel blogger;
Vá até o html dele.
E, procure por  ]]></b:skin>


Uma vez, encontrando-o,

acima de ]]></b:skin>
cole o código:



/* to top */
    #toTop {
    width:50px;  /* Largura do botão * /
    border:1px solid #000; /* Cor e tipo da borda */
    text-align:center; /* Alinhamento do texto */
    padding:5px; /* Distancia entre texto e borda */
    position:fixed; /* Posição que faz com que ele corra por toda a página*/
    bottom:5px; 
    right:5px;
    cursor:pointer;
    color:#ff0000; /* Cor da fonte do botão */
    text-decoration:none;
    font-weight:700;  /* Define o negrito da fonte */
    -moz-border-radius:5px;  /* Definições para o ângulo do botão */
    -khtml-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    }



Visualize!
Salve!


Agora,
acima de </body>

cole o código:


<a href='#' id='toTop'>Topo</a> 
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/> 
<script type='text/javascript'>    
/*-----------------------     
* jQuery Plugin: Scroll to Top     
* by Craig Wilson, Ph.Creative (http://www.ph-creative.com)     
*      
* Copyright (c) 2009 Ph.Creative Ltd.     
* Description: Adds an unobtrusive &quot;Scroll to Top&quot; link to your page with smooth scrolling.     
* For usage instructions and version updates to go http://blog.ph-creative.com/post/jquery-plugin-scroll-to-top.aspx     
*      
* Version: 1.0, 12/03/2009     
-----------------------*/ 
$(function(){$.fn.scrollToTop=function(){$(this).hide().removeAttr(&quot;href&quot;);if($(window).scrollTop()!=&quot;0&quot;){$(this).fadeIn(&quot;slow&quot;)}var   scrollDiv=$(this);$(window).scroll(function(){if($(window).scrollTop()==&quot;0&quot;){$(scrollDiv).fadeOut(&quot;slow&quot;)}else{$(scrollDiv).fadeIn(&quot;slow&quot;)}});$(this).click(function(){$(&quot;html,  body&quot;).animate({scrollTop:0},&quot;slow&quot;)})}}); 
  $(function() {    
                $(&quot;#toTop&quot;).scrollToTop();     
            });     
        </script>


Visualize!
Estando tudo certo,
Salve!


 Nota:

Caso prefira uma imagem,ao invez de escrito "topo"

troque
o código


<a href='#' id='toTop'>Topo</a> 

por este código a seguir:


<a href='#' id='toTop'><img src='Aqui você insere o ENDEREÇO DE SUA IMAGEM aonde a hospedou'>
 </img></a>

Caso você prefira, uma dica mais simples:


cole, em gadget, do lado de "html" (<>),
de seu "lay-out", do template blogger,
fazendo as alterações necessárias,
o código a seguir:
 

<div style="position:fixed; bottom:0px; right:0px;"><a href="#">
<img src="LINK DA IMAGEM" border="0" /></a></div>                 
 
 
 
 
 
 
 

Mensagem do formulário de comentário:
"comentários de anônimos, não serão publicados, e aqui... 
...não é local para desentendimentos e discórdias! 
Seja bastante educado! Frequenta qual escola, ou frequentou?
 ...ou a educação vem de berço?

Aprenda Como:..." colocar-botao-curtir-do-facebook"

"colocar-botao-curtir-do-facebook"


Aprenda Como:..."   colocar-botao-curtir-do-facebook"



pesquisa realizada em:                                    


 

Colocar Botão "  Curtir" Do Facebook no Blogger

..."J Miur do Vagabundia trouxe uma novidade bem interessante para divulgar postagens. O botão "Curtir" do Facebook que pode ser colocado nos posts ou direto na home do seu blog Blogger. Leia a matéria toda no Vagabundia."
"Trecho traduzido
 :"
"Para aqueles que usam o Facebook, estão aparecendo devagar os métodos de  integração fácil entre blogs e sites. A empresa está em uma luta aberta para "morder" uma fatia de mercado que o Google agora domina."

O código para o botão é o seguinte:
<iframe expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url+ &quot;&amp;layout=button_count&amp;show_faces=false&amp;width=450&amp;height=60&amp;action=like&amp;font=tahoma&amp;colorscheme=dark&quot;' allowTransparency='true' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:60px'/>
 Há algumas coisas que podemos personalizar:
&amp;layout=standard define otipo de botão, pode-se mudar por button-count para simplifica-lo
&amp;show-faces=true mostra o avatar do usuario e eliminar-se colocando false
&amp;action=like é o texto a mostrar e pode ser substituido  por recommend
&amp;colorscheme=light é o desenho geral, a outra opção é dark
&amp;font=arial é ol tipo da letra opcional e pode ser tahomaariallucida+grandesegoe+uitrebuchet+msverdana
&amp;width=530 é a largura total en pixeles (530 o 450)
&amp;height=60 es la altura total en pixeles

Se quiser exibi-lo no rodapé das postagens faça o seguinte:

Login no Blogger ► opção "layout"  ► Editar HTML 

Procure pelo trecho <div class='post-footer-line post-footer-line-1'>

Cole o código ABAIXO do trecho

Para exibir ao lado do título da postagem procure pelo trecho
<div class='post-header-line-1'/>

Cole o código ABAIXO do  trecho.

Se queremos exibi-lo em nossa página (pode-se  usá-lo em qualquer página), o código é o mesmo e apenas definir a URL correta, substituindo data:post.url pelo endereço do nosso blog e, neste caso, devemos mudar os símbolos //: (barra dois pontos)
por seus  equivalentes % 3A% 2F:

Exemplo ...


Fica assim: 
<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fblogger-dicasmamanunes.blogspot.com%2F&amp;layout=button_count&amp;show_faces=false&amp;width=450&amp;height=60&&action=like&amp;font=tahoma&amp;colorscheme=dark" allowTransparency="true" frameborder="0" scrolling="no" style="border:none; overflow:hidden; width:450px; height:60px"></iframe>


Referencia: VAGABUNDIA


Para quem usa o Facebook, estão aparecendo devagar os métodos de integração simples com blogs e outros sites da web como a empresa está em uma briga direta para controlar a quota de mercado que o Google agora é o único Senhor e Mestre. Até recentemente , a maioria dessas coisas foram bastante complexa, mas começaram a oferecer alguns códigos simples que podem ser vistos em suapágina do desenvolvedor . Talvez, o mais interessante são os plugins sociais e, entre eles, o famoso botão Likes permitindo aos usuários compartilhar conteúdo entre o seu site e Facebook visitantes.



Tudo que você precisa adicioná-lo para o Blogger é copiar e colar o código que não é nada mais que um iframe :
<Iframe expr: src = '"http://www.facebook.com/plugins/like.php?href =" + dados: post.url + allowTransparency frameborder = 'true' = '0 'scrolling =' no 'style =' border: none; overflow: hidden, width: 450px, height: 60px "/>
O mais razoável seria a de colocá-lo em cada entrada, juntamente com o resto dos ícones sociais, por exemplo, no pós-footer das entradas. Embora este é o código padrão, há coisas que podem ser personalizadas que estes parâmetros são estão ligados à nossa entrada URL: & layout = normadefine o tipo de botão, pode ser alterado por contagem botão para simplificar e mostram-faces = true mostra o avatar do usuário e pode ser removido colocando falsa ação & = como é o texto a ser exibido e pode ser alterado para recomendar & colorscheme = luz é a concepção global, a outra opção é dark & font = arial fonte é opcional e pode ser tahoma , arial , lucida + grande , Segoe + uitrebuchet + ms , verdana & width = 530 é a largura total em pixels (530 ou 450) & height = 60 é a altura total em pixels se colocarmos em nossa casa (nada impede o uso em qualquer página) o código é o mesmo e apenas definir a URL correta, substituindo os dados: post.url pela direção do nosso blogue e, neste caso, devemos mudar os colonos e seus equivalentes bar 3A% e % 2F :


<Iframe allowTransparency = "true" frameborder = scrolling "0" = "no" style = "border: none; overflow: hidden, width: 450px, height: 60px"> </ iframe>

Seguir por e-mail

Topo