Template Flowers

Lembram do Template Flowers? Então, esta é a nova versão dele, voltada especialmente para as meninas. Ele é todo …digamos… cuti-cuti:)
Antes de mais nada, gostaria de explicar porque eu nunca havia feito um layout assim. É que eu acho que quanto mais simples for um template, mas fácil também será usá-lo e modificá-lo. Meus templates sempre foram voltados aos iniciantes e com cores personalizáveis, para que o usuário possa soltar sua própria imaginação.
Agora resolvi inovar um pouco, colocando background personalizado dentro das postagens e no rodapé. Mas vale lembrar que imagens demais dentro de uma página web, deixa-a carregada e lenta para abrir, então eu inovei, pero no mucho :)

Demonstração – Download – Licença

Por favor, não retire os créditos

RECURSOS INSTALADOS Posts Relacionados Retirada da Navbar Hack Leia Mais e jump break Share Buttons oficial dentro do post Personalização dos ícones de navegação Favicon Avatar nos comentários Citação em bloco personalizada

CARACTERÍSTICAS DO TEMPLATE Cores e fontes personalizáveis Compatível com qualquer navegador que esteja devidamente atualizado. 4 colunas à direita 3 blocos de widgets no rodapé Diversos hacks instalados Nome do seu blog no rodapé (auto) CSS otimizado ícones para redes sociais Background nos posts e no rodapé

Modo de Usar

A seguir, explicarei como funciona cada ítem do template. Para um melhor aproveitamento, acesse os posts de referência.

Quando for necessário encontrar algum trecho dentro do template, vá até desing > editar html. Marque a caixa expandir modelos de widgets. Dê um Crtl+F em seu teclado e cole na caixa de busca do seu navegador o trecho que está buscando.

Instalando o template em seu blog

Baixe o arquivo .zip, clique com o botão direito do mouse e escolha abrir. Dentro da pasta, você vai encontrar um arquivo chamado Template Flowers.xml. Se você não sabe como trocar o template do seu blog, acesse:

• Como trocar o template do Blogger

Configurando a imagem do cabeçalho
Dentro da pasta que você baixou, tem a imagem do cabeçalho em formato .psd – própria para Photoshop – no tamanho 970 x 150 px. Basta fazer as modificações de acordo com suas necessidades. Se você não sabe usar o Photoshop:

• Imagem para o cabeçalho do Blogger com Photoshop

Usando o resumo de postagens
No Template Flowers, instalei o jump break do Blogger e o “hack leia mais” com corte manual, assim, quem já usava um dos dois não vai perder as configurações anteriores

• Dicas Blogger: Como colocar o hack “Leia Mais” no Blogger

Colocando links na linkbar
Para colocar links no menu linkbar - que fica embaixo do cabeçalho - acesse:

• Como inserir links na linkbar

Backup de Imagens
É altamente recomendável que você hosperede no Picasa a imagem do background:

• Como hospedar imagens no Picasa
• Backup no Picasa de imagens contidas nos templates

Alterando o favicon
Favicon é aquele pequeno ícone que aparece no navegador, ao lado do endereço do blog. O Template Flowers já vem com um favicon instalado. caso queira mudá-lo, procure pelo trecho abaixo e substitua o endereço da imagem (em azul)

]]></b:skin>

<link href='http://lh6.ggpht.com/_mcq01yDJ2uY/TFiN8jk3A2I/AAAAAAAACuQ/dkJLs3hEq2s/yelp_webtreats.png' rel='shortcut icon'/>

<link href='http://lh6.ggpht.com/_mcq01yDJ2uY/TFiN8jk3A2I/AAAAAAAACuQ/dkJLs3hEq2s/yelp_webtreats.png' rel='apple-touch-icon'/>

<link href='http://lh6.ggpht.com/_mcq01yDJ2uY/TFiN8jk3A2I/AAAAAAAACuQ/dkJLs3hEq2s/yelp_webtreats.png' rel='shortcut icon' type='image/x-icon'/>

• Colocando favicon no blog

Como alterar a cor dos links do rodapé
Os links do rodapé estão na cor amarela. Para alterar a cor, encontre este trecho:

#creditleft a,.creditleft a:hover,.creditleft a:visited,#creditright a,.creditright a:hover,.creditright a:visited {
color: #ffff00;
text-decoration:none;
}

Mude a parte que está em vermelho. Veja uma tabela de cores neste link.
Alterando as fontes e as cores
Todas as fontes e todas cores do template podem ser alteradas através do painel do Blogger. Entre em designer do modelo e procure pela opção avançado

Ícones para redes sociais
Se você quiser usar os mesmos ícones que coloquei no alto da sidebar, cole o código abaixo em seu blog - no gadget HTML/javascript – colocando, respectivamente, as URLs (em vermelho) de cada um.
Exemplo:

<td><a href="http://twitter.com/dicas_blogger"><img
title="Siga-me!"
style="border: 0px solid ; width: 64px; height: 64px;"
alt="Twitter"
src="http://lh3.ggpht.com/_mcq01yDJ2uY/TFiLvFEuh4I/AAAAAAAACuA/sBwI7XqoTs8/twitter_webtreats.png" /></img
></a></td>

Código:

<table style="text-align: left; width: 100%;" border="0"
cellpadding="2" cellspacing="2">
<tbody>
<tr>
<td align="undefined" valign="undefined"><a
href="URL DO FEED"><img title="Rss/Feed"
style="border: 0px solid ; width: 64px; height: 64px;"
alt="Feeds"
src="http://lh4.ggpht.com/_mcq01yDJ2uY/TFiLvNjzzfI/AAAAAAAACt8/Wk20HBibniY/rss_cube_webtreats64.png" /></a
></td>
<td><a href="URL DO TWITTER"><img
title="Siga-me!"
style="border: 0px solid ; width: 64px; height: 64px;"
alt="Twitter"
src="http://lh3.ggpht.com/_mcq01yDJ2uY/TFiLvFEuh4I/AAAAAAAACuA/sBwI7XqoTs8/twitter_webtreats.png" /></img
></a></td>
<td align="undefined" valign="undefined"><a
href="URL DO FACEBOOK"><img title="Facebook"
style="border: 0px solid ; width: 64px; height: 64px;"
alt="Facebook"
src="http://lh5.ggpht.com/_mcq01yDJ2uY/TFiLu6hV_MI/AAAAAAAACtw/ECsp_yEeXEE/facebook_logo_webtreats.png" /></a
></td>
<td align="undefined" valign="undefined"><a
href="mailto:SEU EMAIL”<img title="Contato"
style="border: 0px solid ; width: 64px; height: 64px;"
alt="Contato"
src="http://lh3.ggpht.com/_mcq01yDJ2uY/TFiLu7SPsHI/AAAAAAAACt0/HzskHHbhHAU/mail_square_webtreats.png" /></a
></td>
<td align="undefined" valign="undefined"><a
href="URL DO SEU ORKUT"><img title="Orkut"
style="border: 0px solid ; width: 64px; height: 64px;"
alt="Orkut"
src="http://lh6.ggpht.com/_mcq01yDJ2uY/TFiLuyTCl-I/AAAAAAAACt4/wpskLKeP2DE/orkut_webtreats.png" /></a
></td>
</tr>
</tbody>
</table>

ATENÇÃO:
Se você estava usando um dos novos modelos do Blogger (designer do modelo), será necessário instalar antes o Template Mínima para retirar o gadget atribuition.

• Como voltar a usar os antigos templates do Blogger

Caso você queira realizar alterações na estrutura do template, tais como adicionar ou retirar sidebar ou mesmo instalar outros hacks, pesquise como fazer.
Saiba mais sobre a utilização de nossos templates gratuitos, acessando:

• Termos de Uso do Dicas Blogger

©Template by Dicas Blogger – alguns direitos reservados. Não retire os créditos.