Barra Personalizada Com Redes Sociais e Botão Voltar ao Topo Fixada No Rodapé da Página - Versão #2 - DicasHot | Ver TV Ao Vivo e Entretenimento Masculino Grátis

Nesta postagem compartilho com vocês mais um item importante para colocar em seu blog. Barras fixadas como essa ajuda na divulgação de algo que você queria divulgar, pois, ficará visível a todo o tempo para o visitante, mesmo ele rolando a página.

Torne-se membro do site, basta clicar no botão abaixo e clicar em Seguir:

Para colocar no seu blog...

Entre em "Layout" - "Adicionar um Gadget" - "HTML/JavaScript" e cole o seguinte código

<!-- Início Código Barra de Ferramentas by DicasHot -->
<div style="background-color:#A9A9A9; border-top: 1px solid #708090; bottom: 0; left: 0px; margin: 0px 0 0 0; padding: 5px; position: fixed; text-align: center; width: 100%;">

<div id="barra-post">
<iframe src="//www.facebook.com/plugins/like.php?href=https%3A%2F%2Ffacebook.com%2Fdicashot&amp;width&amp;layout=button_count&amp;action=like&amp;show_faces=true&amp;share=true&amp;height=21&amp;appId=216502231893793" scrolling="no" frameborder="0" style="border:none; overflow:hidden; height:21px;" allowtransparency="true"></iframe>

<div class="g-plusone" data-size="medium"></div>

<a href="https://twitter.com/DicashotBlogger" class="twitter-follow-button" data-show-count="false" data-lang="pt" data-dnt="true">Seguir @DicashotBlogger</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>

<script type="text/javascript">var switchTo5x=true;</script>

<div style='float:right;'>
<a href="http://dicashot.blogspot.com.br/2014/07/barra-personalizada-com-redes-sociais-e.html" style="position: fixed; bottom: 0px; right: 95px;" target="_blank">
<img alt="ferramenta de instalação" border="0" src="http://www.radmin.com.br/products/radmin/online_help/files/icon_createchan.png" title="Quer Instalar essa Barra de Ferramentas?" heigth="26" width="26" /></a>
</div>

<div style='float:right;'>
<a href="#">
<img alt="seta icon" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEih3OrJVJTt_54taTrgP_8uspIYAP_vm3wrE45heJQhCjDmh4FB9kCbNCdYr1DaCvuxKIAg7j5a0ahiOX_Dge4I4hKTT-JqTI3PrKlxBbtWjBFhRqRc-ChIG7QP9nH3QD_PEWBbz8x-aL8/s1600/icon+to+top.png" style='position:fixed; bottom:4px; right:50px;' title="Subir ao topo do Blog" heigth="26" width="26" /></a></div>
<!-- Final Código Barra de Ferramentas by DicasHot --></div></div>

Tendo colado o código, faça as modificações apenas nas partes destacadas de azul e vermelho no código para que não ocorre nenhum erro.

As partes correspondentes a cor vermelha são as cores da sua barra.

Não tem ideia de qual cor colocar em sua barra? Veja nossa tabela de cores e escolha a cor que mais combina com o seu site!

Tabela de Cores