Senin, 31 Maret 2008

Inserir codigos no rodape da postagem

Para inserir um código - de imagem, ou link - no rodapé da postagem, faça o seguinte:

Vá no HTML do seu template e clique em Expandir Modelo de Widget. Agora procure por este trecho:

<p class='post-footer-line post-footer-line-3'/>
(Coloque aqui o código que deseja que apareça no rodapé da sua postagem)
</div>

Depois de colocar o código, antes de </div>, visualize para ver se aparece corretemante e só então salve. Só isso.

Rabu, 05 Maret 2008

Modelo de Postagem

Várias pessoas já me perguntaram como fazer para que um determinado elemento se repita em todas as postagens, como uma imagem, por exemplo, ou uma frase (do tipo: 'clique aqui para fazer sua encomenda ou entrar em contato'). Para isso, basta ir em Configurações->Formatação e, no final da página você encontrará o campo Modelo de Postagem. Alí deve ser inserido o código do que se deseja que apareça em todas as suas postagens. No exemplo da imagem 1 inserí o código para que uma imagem apareça à esquerda (com o texto contornando), em o tamanho reduzido e com um espaçamento entre a imagem e o texto.




O resultado é que, ao clicar em Criar Postagem, a imagem já irá aparecer da maneira que foi pré-definida.

No caso, se você deseja inserir uma frase com o e-mail de contato, basta seguir o modelo:

<div style="text-align: center;"><span style="color: rgb(204, 0, 0);" >Clique aqui para fazer sua encomenda!</span>
<a href="mailto:templatesnovoblogger@gmail.com">Encomendas</a></div>

Resultado:

De qualquer maneira, formate primeiro o que deseja exibir no próprio editor de postagens do blog (depois copie o código, clicando em Editar Html) ou em qualquer outro editor html.

É isso.

Senin, 03 Maret 2008

Retirando os links: postagen antigas recentes e home

Muita gente me pergunta como retirar os links para postagens antigas, recentes e inicial, que aparece no final da página.



Para retirar estes links, vá em Modelo, Editar Html e antes de qualquer coisa, salve uma cópia do seu template antes de mexer no código (tenha este cotume pois, se der algo errado, seu template está salvo). Clique então em Expandir Modelo de Widget e procure este trecho do código do template :

<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
</span>
</b:if>

Apague o que estiver em negrito. Feito isso desaparecerá o link Postagens Recentes.

Agora procure por:

<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>

Novamente apague o que está em negrito. Assim, desaparecerá o link Postagen Antigas.

Por fim, procure por:

<b:if cond='data:newerPageUrl'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
</b:if>

Apague o que estiver em negrito e desaparecerá o link inicial ou home

Você pode não querer apagar, mas mostrar de maneira diferente estes links. Você pode colocar imagens nos links (icones) e para isso, basta apagar o que está em negrito e inserir este código no lugar do trecho apagado:

<img src="endereço da imagem">

A ordem que coloquei aqui é a que você ira encontrar no seu template:
1- Link das postagens recentes
2- Link das postagens antigas
3 - Link da página principal.


Obs: para encontrar com facilidade os códigos no template, copie o começo do código, clique Crlt+F e se abrirá na base da página um espaço para você inserir este trecho do código que procura. No Internet Explore, se não me engano, abre uma janelinha. É só colocar o trecho e clicar em próximo que ele faz a busca no código. Veja a imagem:


Como inserir marcadores e outras questões básicas

Tenho recebido muitos e-mails com questões sobre procedimentos que são muito simples e por isso julguei (erradamente) que não havia necessidade de criar tutoriais para estas questões. A verdade é que milhares de pessoas todos os dias criam blogs e ficam perdidas na hora de executar tarefas simples, como por marcadores nas postagens ou inserir códigos no template. Então, este é um tutorial bem básico para quem começou a mexer no Blogger agora.

Colocando marcadores nas postagens.

Os marcadores são um recurso muito interessante para separar os seus posts em categorias distintas. Para colocar marcadores nas suas postagens, crie um nome para a categoria em que o seu texto se enquadra, como mostra a imagem:


Depois de separar os seus posts em categorias (por ex: música, poemas, humor, etc), vá em Modelo e clique em Adicionar Elemento de Página e escolha a opção Marcadores:


Depois de clicar em Adicionar ao blog, os marcadores aparecerão na coluna lateral e você poderá movê-los de posição (assim como qualquer elemento de página adicionado) clicando com o botão esquerdo do mouse sobre o elemento e, sem soltar, arrastar o retângulo para onde deseja que apareça o elemento (no caso Marcadores) no seu template:



Colocando códigos no template

Para inserir códigos no template vá em Modelo e selecione a opção Html/JavaScript. Na janela que se abrirá, cole o código fornecido (contador, banner, relógio, imagem, o que for) e salve. O processo para definir onde o elemento do código aparecerá no template é o mesmo para Marcadores, basta arrastar o retângulo correspondente.

Mudar os títulos dos elemento de página

Sua lista de Marcadores não precisa ter necessariamente este título (que é o padrão do Blogger) nem o seu perfil o About Me. Você pode colocar o título que desejar em qualquer elemento de página, basta apagar o título que lá esteja e colocar o que quiser:



Colocando gifs nas postagens

Muitas pessoas me perguntam por que as gifs perdem o movimento quando inseridas nas postagens. Na verdade o movimento não se perde, só não pode ser visto enquanto o post não é publicado. Depois de publicar o post, clique em Visualizar e verá que a imagem movimenta-se normalmente. Porém, é verdade que a hospedagem de imagem do Blogger pode mesmo dar problema e para evitar que se perca o movimento, basta hospedar a imagem em algum outro site, por exemplo, no Tinypic. Para isso basta fazer o upload da imagem do seu computador e copiar o link que será fornecido:



Copie o último link fornecido (está em azul), como mostra a imagem:

De posse deste link (que é o endereço da imagem), coloque este código no seu post, onde deseja que a imagem apareça:

<img src="cole aqui o link">

Você pode colar este código tanto no post quanto na coluna lateral, bastando escolher o elemento de página Html/JavaScript e colando o código alí.

Para fazer desta imagem um link, basta coloca:

<a href="endereço do site"><img src="endereço da imagem"></a>

Pronto: ao clicarem na imagem os seus leitores serão levados para outra página ou outro site.

Edit: A leitora Sagesse levantou uma questão importante: como transformar em link uma imagem que se hospedou no Blogger mesmo?
Muito simples: depois de subir a imagem (fazer o upload) pelo blogger, quando a imagem já estiver na postagem, clique sobre ela, depois clique em inserir link e coloque o endereço que deseja e pronto! Explicação visual:




Por ora é o que me lembro que as pessoas tem me perguntado nos e-mails que recebo, mas se você tiver alguma dúvida e quiser ver aqui uma explicação, é só deixar nos comentários.

abraços!