Barra horizontal com últimos posts deslizante




Olá amigos, Mult-focos, neste post vamos mostrar como adicionar uma barra horizontal deslizando com os últimos posts.
É muito fácil de adicionar e tem um visual muito bonito, além de ser uma ferramenta importante no sentido de dar ao seu leitor as manchetes dos últimos artigos escritos no seu blog, vamos ao gadget.
Clique na imagem

Personalize a barra de ferramentas da maneira que quiser :
 
DEMO
Alterar Url: Para o bar flutuante mostrar suas últimas postagens, mudar "http://mult-focos.blogspot.com.br/ "para a url do seu blog. >

Cor de fundo: Substituir ou mudar # 1D76A4 com código de cor ao seu gosto.

Cor do Link : Você também pode alterar a cor dos links (entradas) , substituindo # FFFFFF código com sua cor desejada.

Número de mensagens: Por padrão, a barra está configurada para exibir 15 entradas recentes. Pode alterar o número de posts recentes de 15 para o número de mensagens recentemente que deseja.

Direção: Para mudar o sentido que se move por padrão para a esquerda, ao invés de esquerda em sDirection var = left ", é só mudar para right direita.

Ok pessoal isto é tudo é só desfrutar de mais esta ferramenta, o código esta ai abaixo apenas modifique e adicione o seu gadget. Se não sabe adicionar é só aprender AQUI. Obrigado!
 

 <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script><script style="" src="https://ugwoke-charles-jsfiles.googlecode.com/svn/trunk/stickybar.js"></script><script src="https://ugwoke-charles-jsfiles.googlecode.com/svn/trunk/stickybar2.js"></script><style>#md-stickybar{background:#1D76A4 url('http://i1316.photobucket.com/albums/t609/Multfocos/etstickybar_zps5fc80316.png') repeat-x;width:100%;margin:0 auto;text-align:center;padding:0px 0;top:0px;color:#F40045;border-bottom:2px solid #000;/*box-shadow*/-webkit-box-shadow:#666666 0px 1px 3px;-moz-box-shadow:#666666 0px 1px 3px;box-shadow:#666666 0px 1px 3px;z-index:999;display:none;height:28px;position:absolute;line-height:1.85em;vertical-align:baseline;letter-spacing:1px;}#md-stickybar a{text-decoration:none;color:#FFFFFF;font-size:13px;font-weight:bold;font-family:arial,"Helvetica",sans-serif;line-height:24px;}#md-stickybar a:hover{text-decoration:underline;}#md-stickybar p{margin:0;list-style:none;}#md-stickybar img{vertical-align:middle;margin-right:6px;}#mdclose{padding:0px;float:right;cursor:hand;cursor:pointer;color:#ddd!important;}</style><div id='md-stickybar'><script>var nMaxPosts = 8;var nWidth = 95;var nScrollDelay = 175;var sDirection = "left";var sOpenLinkLocation = "N";var sBulletChar = ">>";</script><script style=""  src="http://mult-focos.blogspot.com.br/feeds/posts/default?alt=json-in-script&amp;callback=RecentPostsScrollerv2&amp;max-results=8 " ></script> <noscript><a href="http://mult-focos.blogspot.com.br/2014/05/barra-horizontal-com-ultimos-posts.html">+ Adquira este widget</a></noscript><a href="#" id="mdclose"  onclick="return false;"><img src="http://i1316.photobucket.com/albums/t609/Multfocos/Xdecancelar_zps865a6a69.png"/></a></div id='md-stickybar'>


Postado por Mairink Oemes

6 comentários:

  1. Não funciona =( Faz tempo to procurando um código assim, mas nunca funfa.

    ResponderExcluir
  2. @XGOZEXSalve, salve Angola.
    Meu nobre XGOZEX, algo estas fazendo errado pois como podes ver na DEMO o gadget funciona perfeitamente.
    Tente fazer todo procedimento com atenção e com certeza terás sucesso. Obrigado!

    ResponderExcluir
  3. @Clube FranquiaDesculpe, realmente o código estava sumindo, mas agora está ai

    ResponderExcluir
  4. Não funciona, o que aparece é uma tarja na guia superior e não a barra com posts.

    ResponderExcluir
  5. @Clube FranquiaFunciona sim amigo, entre neste endereço e veja-o funcionando com o endereço do seu blog, vou deixar por alguns dias até que constate ok!
    Aliás, já esta funcionando no seu blog, mas deixarei só para que outros vejam, obrigado.
    http://mult-demo.blogspot.com.br/

    ResponderExcluir

Todos comentários são lidos e moderados previamente.
São publicados apenas aqueles que respeitarem as regras abaixo:
-Ter relação com o assunto do post.
-Não conter propagandas de outro site ou blog.
-Não incluir links no conteúdo do comentário.
-Se quiser deixar sua URL, comente usando a opção OpenID;
Obrigado(a) por comentar!

free website hit counter