URL Encurtada no Final do Post para Divulgalção

Visitando alguns blogs vi no final dos posts a opção de URLs encurtadas facilitando para o leitor divulgar o post caso ele goste do que leu.
Então procurei uma alternativa para ensinar aqui como fazer para você colocar a opção do link do seu artigo encurtada no final do seu post de forma automática.
Já ativei esta opção aqui no TPV. Veja no final deste post:

O hack que encontrei é específico para o blogger e possui 3 alternativas de encurtar o link do seu artigo.
Utilizando estes 3 sites:

(goo.gl)

(mcaf.ee)

(cli.gs)

Não Se Esqueça:
» Essas configurações demandam algum conhecimento em códigos HTML e CSS. Portanto:
♥ Sempre tente antes num blogue de testes.
♥ Salve o seu template antes de começar, clicando em: Fazer backup/Restaurar
♥ Leia o tutorial até o fim e tenha certeza de ter entendido.
Vamos lá:

1º Colocando o Código da URL Encurtada

»Vá em Modelo » Editar HTML

Procure por (post-footer-line-3)

ou

É importante que o código fique dentro da área dos posts.
Se seu blog não tiver post-footer-line-3 cole abaixo da line-2
Cole este código abaixo da linha »
//
// Shorten Blogger post URLs using urltinyfy javascript API, by MS-potilas 2012 // Updated new shortener by Vinay Prajapati, Tech Prevue Labs 2013 // //
Links do Artigo: goo.gl, mcaf.ee, cli.gs
♦ Clique em Visualizar para se certificar que está indo tudo certo.

♦ Clique em Salvar modelo.

Observações Importantes:

Se a linha estiver desta forma→ />

Você deve tirar a / e fechar com no final do código que colou acima.

Resultado:

Quando você clicar sobre um dos links para encurtar a URL do post irá aparecer uma caixinha pop-up para você copiar o link e divulgá-lo da forma que achar melhor.

2º Configure o Link Encurtado do seu Post

Você pode configurar o CSS do link encurtado para se destacar ou não no final do seu post
Para isso copie este código e cole logo acima da linha ))>:
/*---ShortURLs---*/ .shorturls { text-align: left; float: left; width: auto; height: auto; text-shadow: 1px 1px 1px #ccc; margin: 0px 10px 0px 0px; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border: 1px solid #ccc; padding: 5px 5px 3px 3px; display: block; vertical-align: middle; } .shorturls a { text-transform: uppercase; } .shorturls img { padding: 0px; position: relative; } Ficará desta forma:

O encurtador de URL é uma maneira muito legal de distribuir os links do seu blog/site na internet.

Você pode usar o link encurtado no Twitter, Facebook, Google e em todos as redes sociais que fizer parte. Divulgando os artigos que acha legal. Aproveite e divulgue este artigo do TPV para que outras pessoas possam instalar este encurtador de URL nos seus blogs.
Fonte:
Tradução e adaptação do artigo: ♦Automatic Google (goo.gl) url shortener for Blogger blogs
©2009 Templates para Você Aproveite que você assina o nosso Feed e me acompanhe no Twitter ;)