Trouxe mais um layout, este se chama Layout Blue por ser azul.
Fiz este layout mais simples, nas cores azul e cinza, espero que apreciem.
Este layout contém:
Seguidores só com um botão
Sidebar personalizada
Postagens separadas
Blockquote
Menu para categorias
Menu na lateral do gadget welcome
Data personalizada
Tooltip personalizado
Seleção de texto
Caixa de pesquisa personalizada
Barra de rolagem colorida
Negrito, itálico, sublinhado, e
Links de navegação personalizado
Título da postagem personalizado
Marcadores, comentários e autor abaixo do título da postagem
COLOCANDO OS GADGETS
Seguidores com um botão
Coloque no gadget html/java script
<a href="http://www.blogger.com/follow-blog.g?blogID=SEU ID COLADO AQUI" title="O TITULO DO TOOLTIP" target="_blank"><img src="http://i765.photobucket.com/albums/xx293/Claudinenetto/Imagem%20para%20seguidores/botoseguidores4.png" border="0" /></a>
Onde tem SEU ID COLADO AQUI- coloque o id de seu blog
Onde tem O TITULO DO TOOLTIP- coloque o título que aparece quando clicado
O gadget welcome
Coloque no gadget html/java script
DESCRIÇÃO:
<img src="http://i765.photobucket.com/albums/xx293/Claudinenetto/Imagens%20Afiliados/imagemparaafiliados1.png" class="border" align="left"/> ESCREVA AQUI SUA BREVE DESCRIÇÃO-ESCREVA AQUI SUA BREVE DESCRIÇÃO-ESCREVA AQUI SUA BREVE DESCRIÇÃO-ESCREVA AQUI SUA BREVE DESCRIÇÃOMENU LATERAL:
<br />
<div style="position: absolute; margin-left:240px; margin-top: -85px;">CAIXA DE PESQUISA
<div class="menu">
<a href="URL"><p>♥</p></a>
<a href="URL"><p>♥</p></a>
<a href="URL"><p>♥</p></a>
<a href="URL"><p>♥</p></a>
<a href="URL"><p>♥</p></a>
<a href="URL"><p>♥</p></a>
</div></div>
<style>
#searchb {
float: left;
margin: 30px 0
}
#searchb input[type="text"], #searchb textarea {
background: none repeat scroll 0 0 #F9F9F9; /*cor de fundo onde digitamos a pesquisa*/
border: 0 none;
float: left;
height: 20px;
padding: 5px 10px;
width: 120px;
-webkit-border-radius: 2px 2px 2px 2px; /*grau de arredondamento da área onde digitamos*/
-moz-border-radius: 2px 2px 2px 2px; /*grau de arredondamento da área onde digitamos*/
border-radius: 2px 2px 2px 2px;/*grau de arredondamento da área onde digitamos*/
-webkit-box-shadow: 0 2px 2px #c0c0c0, 0 3px 10px rgba(0, 0, 0, 0.4) inset;
-moz-box-shadow: 0 2px 2px #c0c0c0, 0 3px 10px rgba(0, 0, 0, 0.4) inset;
box-shadow: 0 2px 2px #c0c0c0, 0 3px 10px rgba(0, 0, 0, 0.4) inset;
font-family: arial, helvetica, sans-serif; /*tipo de fonte*/
font-size: 15px; /*tamanho da fonte */
}
#searchb .go {
-webkit-border-radius: 2px 2px 2px 2px; /*grau de arredondamento do botão Buscar*/
-moz-border-radius: 2px 2px 2px 2px; /*grau de arredondamento do botão Buscar*/
border-radius: 2px 2px 2px 2px; /*grau de arredondamento do botão Buscar*/
-webkit-box-shadow: 0 2px 2px #c0c0c0, 0 -2px 10px rgba(0, 0, 0, 0.5) inset;
-moz-box-shadow: 0 2px 2px #c0c0c0, 0 -2px 10px rgba(0, 0, 0, 0.5) inset;
box-shadow: 0 2px 2px #c0c0c0, 0 -2px 10px rgba(0, 0, 0, 0.5) inset;
background: #98B6D0; /*cor normal do botão*/
border: 0 none;
font-size: 15px; /*tamanho da fonte do botão Buscar*/
font-family: arial, helvetica, sans-serif; /*tipo de fonte do botão Buscar*/
height: 30px;
margin: 0 10px;
padding-bottom: 3px;
text-shadow: 0 1px rgba(255, 255, 255, 0.35);
width: auto;
cursor: pointer
}
#searchb .go:hover {
background: #ccc; /*cor do botão Buscar em estado hover*/
}
</style>
<form id="searchb" action="ENDEREÇO COMPLETO DE SEU BLOG/search-results/" id="cse-search-box">
<div>
<input type="hidden" name="cx" value="ID DE SEU BLOG:yojsvasam2s" />
<input type="hidden" name="cof" value="FORID:11" />
<input type="hidden" name="ie" value="UTF-8" />
<input type="text" name="q" size="31" placeholder="Pesquise no site"/>
<input type="submit" name="sa" value="Buscar" class='go'/>
</div>
</form></div>
O menu você deve ajustar a posição se não ficar ao lado em
margin-left:240px; margin-top: -85px;
Para mudar o avatar procure por:
http://i765.photobucket.com/albums/xx293/Claudinenetto/Imagens%20Afiliados/imagemparaafiliados1.png
No botão de pesquisa você deve colocar o id de seu blog e o endereço
Gadget categorias
Coloque no gadget html/java script
<div style="float: left; width: 50%">
<a href="LINK"><div class="tags">Categoria</div></a>
<a href="LINK"><div class="tags">Categoria</div></a>
<a href="LINK"><div class="tags">Categoria</div></a>
</div>
<div style="float: left; width: 50%">
<a href="LINK"><div class="tags">Categoria</div></a>
<a href="LINK"><div class="tags">Categoria</div></a>
<a href="LINK"><div class="tags">Categoria</div></a>
</div>
<br />
Gadget créditos
Coloque no gadget html/java script
<cred><a href="http://princesstutoriais.blogspot.com.br">Princess Tutoriais</a> <img src="http://i122.photobucket.com/albums/o260/mhilka/minigifs/02lrty.gif" />Personalização </cred><br />
<cred><a href="http://www.b-cake.com/2013/01/menu-de-creditos.html">Birthday Cake</a> <img src="http://i122.photobucket.com/albums/o260/mhilka/minigifs/02lrty.gif" />Menu de créditos</cred><br />
<cred><a href="http://enjoythelittllethings.blogspot.com">Enjoi the Littlle Things</a> <img src="http://i122.photobucket.com/albums/o260/mhilka/minigifs/02lrty.gif" />Comentários</cred>
Para mudar o avatar do título das postagens siga este tutorial:
Como colocar avatares no título do post
PEÇO POR GENTILIZA COLOCAR OS CRÉDITOS DO LAYOUT
Nenhum comentário:
Postar um comentário