Gadget de Rede Social + Brushes da banda Avenged Sevenfold
Oiiiiiiii!!!!!!
Hoje estou muito feliz pois duas leitoras fizeram pedidos para mim!!
O primeiro pedido foi difícil de encontrar, até porque eu mal conhecia a Banda...rs.
Bom Amanda ai está o link dos brushes da banda Avenged Sevenfold.
Link Para Baixar os Brushes
E são bastantess!!!!
Outro pedido foi da Marli, nossa amiga teve a curiosidade de saber como foi feita a parte da coluna "Faça Parte".
Então vou explicar passo a passo:
Sigam-me:
1 - No painel do seu blog na parte administrativa na coluna a direita, clique em Layout -> Adicionar um Gadget -> Escolha um JavaScript e cole o seguinte código:
______________________________________________________________________
<style> /* --- Redes Sociais --- */
.slide-up-boxes a {
display: block;
height: 130px;
margin: 15px 0 6px 0;
background: rgba(134, 214, 221, 0.62);
height: 60px;
overflow: hidden;
}
.slide-up-boxes h5 {
color: #333;
text-align: center;
margin-top: 0px;
font: italic 18px/65px Georgia, Serif;
opacity: 1;
-webkit-transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
}
.slide-up-boxes a:hover h5 {
margin-top: -70px;
opacity: 0;
}
.slide-up-boxes div {
margin-top: -30px;
position: relative;
color: white;
font: 12px/15px Georgia, Serif;
height: 45px;
padding: 10px;
opacity: 0;
-webkit-transform: rotate(6deg);
-webkit-transition: all 0.4s linear;
-moz-transform: rotate(6deg);
-moz-transition: all 0.4s linear;
-o-transform: rotate(6deg);
-o-transition: all 0.4s linear;
}
.slide-up-boxes a:hover div {
opacity: 1;
-webkit-transform: rotate(0);
-moz-transform: rotate(0);
-o-transform: rotate(0);
}
.slide-up-boxes a:nth-child(1) div {
background: #a8dceb url(http://icons.iconarchive.com/icons/yootheme/social-bookmark/48/social-twitter-box-blue-icon.png) 10px 9px no-repeat;
padding-left: 80px;
}
.slide-up-boxes a:nth-child(2) div {
background: #a8b5cf url(http://icons.iconarchive.com/icons/yootheme/social-bookmark/48/social-facebook-box-blue-icon.png) 10px 10px no-repeat;
padding-left: 80px;
}
.slide-up-boxes a:nth-child(3) div {
background: #f2b5a0 url(http://icons.iconarchive.com/icons/yootheme/social-bookmark/48/social-rss-box-orange-icon.png) 10px 9px no-repeat;
padding-left: 80px;
}
/* --- Fim Redes Sociais --- */
</style>
<div id="page-wrap">
<section class="slide-up-boxes">
<a href="LINK DO TWITTER" target="_blank">
<h5>Siga no Twitter</h5>
<div>TEXTO DO TWITTER</div>
</a>
<a href="LINK DO FACEBOOK" target="_blank">
<h5>Curta no Facebook</h5>
<div>TEXTO DO FACEBOOK</div>
</a>
<a href="LINK DO FEED" target="_blank">
<h5>Assine o Feed</h5>
<div>TEXTO DE ASSINANTE</div>
</a>
</section></div>
_______________________________________________________________________________
Aonde está em letra maiúscula você deve trocar conforme seu blog ou site.
Salve e pronto!
Espero que tenham gostadoooo!!! Qualquer coisa atualizo ou tiro dúvidas!! Não deixe de entrar em contato com a gente!! ;)
2 comentários
Muito bacana. É assim que vamos longe, um ajudando o outro...
ResponderExcluirhttp://coisasquegost.blogspot.com.br/p/sorteios.html
Obrigada!!!! Volte sempre!!! ;)
ResponderExcluirSeja espontâneo(a), porém educado(a)!