Os tutoriais e templates aqui apresentados são voltados para os Modelos de layout (lançados em 2006). A eficácia das dicas aqui apresentadas não foram testadas nos novos modelos de templates do Blogger (2010).

Colocando imagens em listas (marcadores)

Procure este trecho:

.sidebar ul {
list-style:none;
margin:0 0 0;
padding:0 0 0;
}

.sidebar li {
margin:0;
padding:0 0 .25em 15px;
text-indent:-15px;
line-height:1.5em;
}

E acrescente logo abaixo:

.sidebar ul li {
list-style: disc url(link da imagem);
vertical-align: top;
padding: 0;
margin-left: 15px;
}

Neste site, é possível escolher bullets e setas para as listas da sidebar. Hospede a imagem e coloque o link fornecido entre os parênteses. Se não desejar usar imagem, apague o trecho destacado e ficará um círculo sólido. A cor será a mesma do título na Sidebar.

Para que o marcador da lista seja um quadrado, basta colocar:
list-style: square;

Um círculo vazio:
list-style: circle;

Outros sites com bullets e setas:
SuperTráfego
AnimadosGifs
Leia Mais

Gerar Meta Tag

Para inserir Meta Tag no seu blog (o que facilita os sites de busca a te encontrarem), coloque no seu blog o seguinte código, logo depois de:

<title>Nome do Seu Blog</title>

Coloque este:

<meta content='COLOQUE AQUI O QUE QUER QUE APAREÇA SOB O TITULO DO SEU BLOG NOS MECANISMOS DE BUSCA' name='description'/>
<meta content='COLOQUE AQUI AS PALAVRAS CHAVES QUE DESCREVEM SEU BLOG SEPARADAS POR VIRGULAS SEM ESPAÇOS' name='keywords'/>
<meta content='index,follow' name='robots'/>


Depois de inserir o código, visualize e estando tudo ok, salve o template.
Leia Mais

Stock. xchng - Imagens para seu blog



Procurando imagens para seu blog? No excelente Stock.xchng você encontrará milhares, separadas por categorias, mais baixadas, mais comentadas, etc. A maioria das imagens é livre para uso não-comercial, mas vale sempre dar uma lida nos termos de licença.

Perfeito para encontrar imagens para ilustrar seus posts ou mesmo para o layout do seu blog.
Leia Mais

Paleta de Cores


Esta eu também achei legal: neste site você coloca o endereço de uma imagem e ele te dá uma paleta de cores retiradas desta imagem. Muito útil para quando for personalizar sua página; coloque lá a imagem escolhida para o topo (ou fundo de página) e acompanhe a escala cromática fornecida, evitando desarmonia no layout.
wink
Leia Mais

Gerador de Buttons e Logo

Neste site você criar seu Buttom ou Logo de maneira rápida e simples:



Leia Mais

Teste seu layout

O que é Browsershots?

Browsershots tira screenshots do seu layout em diferentes navegadores. Ele é um serviço livre de código-aberto criado por Johann C. Rocholl. Quando você enviar o endereço de seu site, ele será adicionado à fila de trabalhos. Um número de computadores distribuídos irá abrir seu website em seus navegadores. Então ele irá tirar screenshots e enviá-las para o servidor central.

Prá evitar que o seu blog seja lindo no Firefox e ao mesmo tempo pareça o trabalho de um bêbado que digita com os cotovelos no IE, faça uso deste site: http://browsershots.org/. Nele você digita a url do seu blog e vai fazer um lanche. Uns 20 minutos depois ele mostra o screenshot da sua página em 18 navegadores (ou versões) diferentes. Ele dá um prazo (na fila de espera) de 30 minutos que pode ser extendido.

É isso.
Leia Mais
Assinar: Postagens (Atom)