Dicas Blogger

Home » All

Como colocar busca do Google no Blogger

<img align="right" alt="gtk_find_and_replace" border="0" height="128" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiraMEeXDBp-V1UorvL5l-vhdrlcn5c9oQG38DcbuhH059javgpZFSC_j0qA3dZMRr5DpJIPihGxNNpitHGUymgbpF5Q2R7eCJ6fpWyRMmazILnU0NtEv5qi8dqHE9fAO7oVLKtzok_a9Ch/?imgmax=800" style="background-image: none; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: inline; float: right; margin: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="gtk_find_and_replace" width="128" />Muitos usuários do Blogger vêm se queixando que a caixa de busca padrão – gadget “caixa de pesquisa” – não é eficiente, pois não mostra todas as postagens. Esse problema já é antigo e, infelizmente, ainda não foi resolvido. 
No lugar do gadget “caixa de pesquisa”, é possível usarmos outras opções de caixa de busca do Google: 
<ol>
<li>Caixa de busca do <a href="https://www.google.com/adsense/" target="_blank">Google Adsense</a>; </li>
<li><a href="http://www.google.com/cse/" target="_blank">Caixa de busca personalizada do Google</a>; </li>
</ol>
 
Como colocar a busca do Google AdSense 
<img alt="busca-adsense" border="0" height="100" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEireHj1C77y87DL9LTSz8ydEdLAOsvJdXuqTjULdaOMXvDMeDe5vanDc2SoSNuCu-3tzoqGbTD-nQsbFcBGaeT1ulo455BOf9-U18I0WnOnw5kZC50VReOTs1MKx_UFxOK4FY_THNSxYKDL/?imgmax=800" style="background-image: none; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: inline; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="Busca do AdSense" width="315" /> 
A caixa de busca do AdSense é, de longe, a mais eficiente e ainda pode render uma graninha. Para colocá-la em seu blog, é preciso ser um editor cadastrado.  
<ol>
<li>Clique na aba “configurações do AdSense” </li>
<li>Escolha a opção “AdSense para pesquisas” </li>
<li>Em “tipo de pesquisa”, escolha “apenas os sites que eu selecionar” </li>
<li>Em “sites selecionados”, digite o endereço do seu blog </li>
<li>Clique em “continuar” e configure o tamanho da caixa </li>
<li>Clique em “continuar” e copie o código </li>
<li>No Blogger, cole no gadget HTML/Javascript</li>
</ol>
Como colocar a busca personalizada do Google 
<img alt="image" border="0" height="89" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0jZT_Z1AssstBHZA5y8H0a8fbo_ru8nyaHH8tZPsvWSPUgoceifTc11PZH_jIPNhONYusGeWYE11NIT6wf8lOjAAgau9gAteN0O_-b-3ovhCGMOZUTYotXWBSJdkAJ6ZpQq1YGKfsWJ9F/?imgmax=800" style="background-image: none; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: inline; margin: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="image" width="332" /> 
A caixa de busca personalizada do Google também é muito boa. 
<ol>
<li>Acesse <a href="http://www.google.com/cse/" title="http://www.google.com/cse/">http://www.google.com/cse/</a> </li>
<li>Faça login com sua senha do Google </li>
<li>Clique em “criar mecanismo de busca personalizado” </li>
<li>Preencha todos os campos </li>
<li>Em “site a pesquisar”, digite o endereço do seu blog </li>
<li>Clique em avançar e escolha um modelo </li>
<li>Copie o código </li>
<li>No Blogger, cole no gadget HTML/Javascript </li>
</ol>

Como colocar busca do Google no Blogger

Muitos usuários do Blogger vêm se queixando que a caixa de busca padrão – gadget “caixa de pesquisa” – não é eficiente, pois não mostra toda...

Continue Lendo >>

16:34

Blogosfera Brasil–uma rede social para blogueiros

<img align="left" alt="logo" border="0" height="110" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8gzhg78SkktzN5-cf8KVjS19rOed5vxLlgyi1HIQ4ukQeX4VnOS5Og0VWWrri1XuaoU4nlnAinRDxriK9I8NlHHUUCr0JvotQCrFqpBt2h5-1OpmUKvD3lRWeq9stCuq1gsKYfK30JFDK/?imgmax=800" style="background-image: none; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: inline; float: left; margin: 3px 15px 0px 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="logo" width="96" />Seguindo a tendência das redes sociais focadas em nichos específicos, a <a href="http://www.blogosferabrasil.com/">Blogosfera Brasil</a> tem como público principal os blogueiros, iniciantes ou veteranos. A rede também está aberta àqueles que ainda não têm um blog, mas que se interessam pelo assunto e pretendem criar um futuramente. 
O objetivo é que a Blogosfera Brasil seja um espaço para compartilhamento de ideias e de divulgação de novos trabalhos, além de servir também para que os membros possam fazer novas amizades e contatos profissionais. 
O lançamento oficial da Blogosfera Brasil está previsto para o dia 15 de março de 2011. Até lá alguns ajustes ainda serão feitos e novas ferramentas serão implementadas e testadas. É importante que os membros colaborem enviando sugestões e reportando bugs. 
As novidades da Blogosfera Brasil podem ser acompanhadas pelo <a href="http://www.twitter.com/blogosferabr">Twitter</a>, <a href="http://www.facebook.com/BlogosferaBrasil">Facebook</a> e também pelo <a href="http://www.blogosferabrasil.com/groups/blogosfera-brasil/">grupo oficial</a> da própria rede. Quem quiser colaborar com o projeto, poderá participar como apoiador da Blogosfera Brasil e ficar em destaque na página "Apoiadores". (<a href="http://www.blogosferabrasil.com/blog/divulgacao/saiba-como-ser-um-apoiador-da-blogosfera-brasil">saiba como</a>) 
Mesmo em fase beta, a Blogosfera Brasil está funcionando normalmente e os membros já contam com algumas ferramentas para poderem participar da rede enviando seus conteúdos e interagindo com outros membros. Nela já é possível, por exemplo, criar e participar de grupos e fóruns, inserir links, divulgar eventos, criar blogs, adicionar amigos, seguir outros membros, ou seja, tudo aquilo que encontramos normalmente numa rede social e, como eu já mencionei, outros recursos serão implementados. O registro na Blogosfera Brasil é bastante simples, rápido e, o mais importante, gratuito. 
A rede tem como base de funcionamento a plataforma WordPress em conjunto com o BuddyPress, além outros plugins que oferecem os recursos adicionais. Esta combinação faz com que a Blogosfera Brasil seja bastante versátil quanto aos recursos e relativamente simples de ser administrada. 
Então, convido os leitores do Dicas Blogger para conhecerem, compartilharem suas ideias e fazerem novos contatos nesta nova rede social, a Blogosfera Brasil! 
Agradeço a Juliana pelo espaço disponibilizado para a divulgação deste projeto. 
<hr />
<img align="left" alt="iv_blog" border="0" height="81" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3TSSrlfAqfRuBxV9uKa7_Fdr-PZBN16faJ9jm4c7XkiNVoexQwSxsRWwx2IDBBnB94hOAKZndqm8EsTr5kGh8xCgO4xnIozFh4h3JSr__M08FpxNyQJJ1zNB4YpeEDVGrLeKJvmg4Dq62/?imgmax=800" style="background-image: none; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: inline; float: left; margin: 0px 13px 0px 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="iv_blog" width="75" /> 
Este é um guest-post de Rodrigo Ribeiro Neto 
<a href="http://twitter.com/iv_blog">Twitter</a> | <a href="http://www.informacaovirtual.com/">Informação Virtual</a> | <a href="http://www.blogosferabrasil.com/">Blogosfera Brasil</a> 
Rodrigo é o criador da rede social Blogosfera Brasil 
<hr />

Blogosfera Brasil–uma rede social para blogueiros

Seguindo a tendência das redes sociais focadas em nichos específicos, a Blogosfera Brasil tem como público principal os blogueiros, inician...

Continue Lendo >>

19:59

35 novas fontes para o seu blog!

<img align="left" alt="fonts" border="0" height="114" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAf1h9Qn44WRLP7km0qvOvCA2xXwwknZDZLDxehgeU_EJygbnfjMSHtYtRSZKZmq7cj9qWLwNAEFsOJ2u6R7CNnKymjYJY0a4dBDHqhd4pvO_0LtEo9-bqLeFzKcI9TH8BbRp21Tmtytlw/?imgmax=800" style="background-image: none; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: inline; float: left; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="fonts" width="114" />No final do mês passado, a querida Camila Fitz – funcionária do Google - anunciou no fórum do Blogger a chegada de 35 novas fontes no designer do modelo. Fui conferir e posso garantir que são lindas! Têm fontes com estilos mais antigos (retrô) e outras super modernas, para todos os gostos e temas. 
<blockquote>
Há alguns meses atrás, introduzimos Fontes da Web para o Blogger in Draft. Hoje, temos o prazer em anunciar, não somente as Fontes da Webpara TODOS os usuários do Blogger, mas também que adicionamos 35 fontes novas com um total agora de 77! <a href="http://www.google.pl/support/forum/p/blogger/thread?tid=59322a2ea408b8c3&hl=pt-BR">Camila Fitz –funcionária do Google</a></blockquote>
Para acessá-las, é só clicar em design>designer do modelo e procurar pelas fontes: 
<img alt="blogger-fonts" border="0" height="286" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5A_kH3zC-Td5HyEH3ZlM2kD0zIQNFcgpylaEq3uKJ1Cz-OnquCdi_0NEKHv3X589Je7H0eH_F1Nv-B1NEMHijsPDpJNHlFt64nr4iT8St2IMaUMpFGJDRJZrb7vsWxJbOQi7ynt8O0bNI/?imgmax=800" style="background-image: none; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: block; float: none; margin: 0px auto; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="Novas fontes" width="550" />

35 novas fontes para o seu blog!

No final do mês passado, a querida Camila Fitz – funcionária do Google - anunciou no fórum do Blogger a chegada de 35 novas fontes no design...

Continue Lendo >>

09:37

3 programas poderosos para usar o Twitter

<img align="right" alt="gossip_birds" border="0" height="171" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJ54gT_PdxR34kU-jHZZO7ohIerQ02MrZdsuReF4h7p7MuFrwgAu3JGux1LpukvJJsO3qI4c-ARm-dAMQSmFygcGzOqU_h0xp7hYiFatqxe-ZWB6Hk_dy4Vjuj36sSr7eA1RdVCJZ5DkyZ/?imgmax=800" style="background-image: none; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: inline; float: right; margin: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="gossip_birds" width="128" />Não é de hoje que procuro o aplicativo twitter-client perfeito. Nessa minha incansável busca, acabei testando vários programas até encontrar um que atendesse às minhas necessidades <strike>de viciada</strike>. 
Sendo assim, vou descrever os prós e os contras dos que, na minha opinião, são os 3 melhores aplicativos para usar o Twitter. 
Pra mim, um bom twitter-cliente precisa ter, além das funções básicas, os seguintes recursos: 
<ul>
<li>Rt editável e nativo ( <a href="http://www.dicasblogger.com.br/2010/10/colocar-comentario-rt-twitter.html">Como enviar RT com comentário</a> ) </li>
<li>Filtros ( <a href="http://www.dicasblogger.com.br/2010/04/eliminar-tweets-rts-timeline-twitter.html">Elimine tweets e RTs indesejáveis da sua timeline</a> ) </li>
<li>Gerenciamento de perfil com follow, unfollow e block </li>
<li>Opções de temas </li>
<li>Fontes personalizáveis </li>
<li>Possibilidade de gerenciar várias contas </li>
<li>Opção de trabalhar ou não com colunas (à critério do usuário) </li>
<li>Recurso auto-completar (coloca-se @ e aparecem os usernames) </li>
<li>Busca integrada de tweets e de perfil </li>
<li>Escolha de serviços, tais como encurtadores de URL, foto e vídeo </li>
<li>Pré-visualização de URLs, fotos e vídeos </li>
<li>Visualização nas mentions, tanto dos Rts nativos quanto dos editáveis</li>
</ul>
TweetDeck - O TweetDeck é de longe um dos aplicativos mais completos e o preferido dos usuários avançados e power users. A meu meu ver, sua única limitação está na interface, com apenas 2 temas e fonte pequena, sem opção de mudança.<a href="http://www.tweetdeck.com/desktop/"><img alt="tweetdeck" border="0" height="314" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCmaum2Ew26gfQSUU1WjF8WwcSqYrkcotFz-Q03aHLSIGWVwiXOjR0DwCK0dVp-Ty8u_5wwoFc4Owhc2SCCCIwRn5xzMickOnRuISzb6lyMGxc4SOy3gwUFoUBizKymrzaPMPwaY4mhEfo/?imgmax=800" style="background-image: none; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: block; float: none; margin: 0px auto; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="tweetdeck" width="580" /></a> 
<table border="1" bordercolor="#cccccc" class="bordasimples" style="margin-left: auto; margin-right: auto; text-align: left; width: 541px;"> <tbody>
<tr> <td style="background-color: #eeeeee; font-weight: bold;" width="181">Características</td> <td style="background-color: #eeeeee; font-weight: bold;" width="224">Diferenciais</td> <td style="background-color: #eeeeee; font-weight: bold;" width="134">Contras</td></tr>
<tr> <td width="181">Roda em Adobe Air</td> <td width="224">trabalha com colunas</td> <td width="134">apenas 2 temas</td></tr>
<tr> <td width="181">Windows, Linux e Mac</td> <td width="224">permite agendar tweets</td> <td width="134">fonte pequena</td></tr>
<tr> <td width="181"><a href="http://www.tweetdeck.com/desktop/">Download</a></td> <td width="224">possui recurso auto-completar</td> <td width="134"></td></tr>
<tr> <td width="181"><a href="http://www.dicasblogger.com.br/2010/02/como-usar-e-configurar-o-tweetdeck.html">Tutorial</a></td> <td width="224">permite tweets longos</td> <td width="188"></td></tr>
<tr> <td width="181"><a href="http://www.tweetdeck.com/desktop/">Recursos</a></td> <td width="224">possui filtro</td> <td width="188"></td></tr>
</tbody></table>
 
Saezuri – O Saezuri foi o meu aplicativo preferido por um bom tempo, já que me permite mudar o tema e configurar as fontes, buscando um maior conforto visual. Por outro lado, não trabalha com colunas, não possui o recurso auto-completar e nem possibilita dar block. É ideal para usuários menos exigentes. 
<a href="http://www.adobe.com/cfusion/marketplace/index.cfm?event=marketplace.offering&offeringid=16720&marketplaceid=1"><img alt="saezuri" border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0P9b-H_JIdtz41f6LLgbTlgzJofyDdB_dxJNroV4igs_H7LYy0oiYy0612Af58-FQEL0vqc0TsG0sigMCYIU0b1Y6rCRl4FTy_P_qwJ_wFNW1_qVPXC4zN4svwlOHmSxMuDKSBLxtGNaf/?imgmax=800" style="background-image: none; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: block; float: none; margin: 0px auto; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="saezuri" width="580" /></a> 
<table border="1" bordercolor="#cccccc" class="bordasimples" style="margin-left: auto; margin-right: auto; text-align: left; width: 580px;"> <tbody>
<tr> <td style="background-color: #eeeeee; font-weight: bold;">Características</td> <td style="background-color: #eeeeee; font-weight: bold;">Diferenciais</td> <td style="background-color: #eeeeee; font-weight: bold;">Contras</td></tr>
<tr> <td>Roda em Adobe Air</td> <td>Interface agradável </td> <td>Não tem block</td></tr>
<tr> <td>Windows, Linux e Mac</td> <td>vários temas</td> <td>Não tem auto-completar</td></tr>
<tr> <td><a href="http://www.adobe.com/cfusion/marketplace/index.cfm?event=marketplace.offering&offeringid=16720&marketplaceid=1">Download</a></td> <td>fontes personalizáveis</td> <td>Não trabalha com colunas</td></tr>
<tr> <td><a href="http://www.playwell.co.jp/saezuri/">Página oficial</a></td> <td>possui filtro</td> <td>Suporte em japonês</td></tr>
</tbody></table>
 
Janetter – é o programa que uso atualmente, já que possui a interface agradável do Saezuri, com vários dos recursos avançados do TweetDeck. 
<a href="http://janetter.net/"><img alt="janetter" border="0" height="289" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg34l2bqs5I8bRxf_hMwe9MZdxqaHFDwoot03tC7sUUCknLk6c4_Tc-sl-7f36vPzEqQpFptPFgHu9B8R7PBZLBJ7LQT51iuR7IP_qrLuZ5zI5brKD9WIU74Z-tZnN-zmARsJ3EbQSCceoX/?imgmax=800" style="background-image: none; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: block; float: none; margin: 0px auto; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="janetter" width="580" /></a> 
<table border="1" bordercolor="#cccccc" class="bordasimples" style="margin-left: auto; margin-right: auto; text-align: left; width: 580px;"> <tbody>
<tr> <td style="background-color: #eeeeee; font-weight: bold;" width="193">Características</td> <td style="background-color: #eeeeee; font-weight: bold;" width="205">Diferenciais</td> <td style="background-color: #eeeeee; font-weight: bold;" width="135">Contras</td></tr>
<tr> <td width="193">Não precisa de Adobe Air</td> <td width="205">Interface agradável</td> <td width="135">Não tem :)</td></tr>
<tr> <td width="193">Roda apenas no Windows</td> <td width="205">vários temas</td> <td width="135"></td></tr>
<tr> <td width="193"><a href="http://janetter.net/">Download</a></td> <td width="205">fontes personalizáveis</td> <td width="135"></td></tr>
<tr> <td width="193"><a href="http://janetter.net/features.html">Recursos</a></td> <td width="205">auto-completar</td> <td width="135"></td></tr>
<tr> <td width="193"><a href="http://twitter.com/janetter_jp">Twitter</a></td> <td width="205">trabalha com colunas ou sem</td> <td width="135"></td></tr>
<tr> <td width="193"><a href="http://www.dicasblogger.com.br/2011/02/como-configurar-e-usar-o-janetter.html">Tutorial</a></td> <td width="205">possui filtro</td> <td width="135"></td></tr>
</tbody></table>
 
 
<center> <table border="0" cellpadding="0" cellspacing="0" style="width: 581px;"> <tbody>
<tr> <td valign="top" width="193"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7JmBAh9l64D_7x4_3zBQHouqcdi-y7934meduyA26HIm_RgoTk6QuthfP6n_iZ4tulmCrFPqQ_YPRRgVsgBXu22uiEWiaNDn4BaohfoPR9Zo3LnDTs8zZLC2dJKPvOaFPdKDChgXvk8LE/s1600-h/janetter-interface%5B7%5D.png"><img alt="janetter-interface" border="0" height="130" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKJS7RoWjZHs0IgxLlW-MfGaNYvHFLtBuAva0rCrZlshjsW9Ro-a8A6sl3jhA8x-WFipRdDULefMNK7qMa2R9h23mBeMV6kfbevlZeVvzYd6ZN7YlSA9lm2SHEhdJU_is-oMSvCSUOCPzV/?imgmax=800" style="background-image: none; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: block; float: none; margin: 0px auto; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="janetter-interface" width="188" /></a></td> <td valign="top" width="193"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNW4e73XRj_QqWXsDU5wb3D_UN-8JFxw_vbUy4T7bwCzJix4q4JMyOcqNSTnDwHYW4lq0wtdrjUZVuQ4K9MYYcg6cfITXi3co35ul-kZQoEUk8gl5ACCbpSn7Vun2wibR-9sx9IbvFz49O/s1600-h/janetter-configuracoes%5B7%5D.png"><img alt="janetter-configuracoes" border="0" height="131" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJGKaipHY3HhSe730DhyphenhyphenMxI2cv__du0bum2l9MhyphenhyphenIaWWVoVxhg7gogtcEsR8g4mwI5g7ncSwoHpQWtjcFvdgsmEPoBHQ8A_xetCrxzR7j6J81chyphenhyphenEX6tfL8W-y2SzCu0TQi1VDxbWVsY5j/?imgmax=800" style="background-image: none; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: block; float: none; margin: 0px auto; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="janetter-configuracoes" width="197" /></a></td> <td valign="top" width="193"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTmeuraYOPnJGjNJhI1IE61V6I11OvzhADj73nUy2izJRWoxbFZI60oLqjhx10O-LAyXaXGbk7MhxeWsGpyGWjRDtdB2U7nqmq7A1P-5x3TbaaPZPZLhVHTg-dPhJnnLwn8QMdv_aZImDp/s1600-h/janetter-fonts%5B7%5D.png"><img alt="janetter-fonts" border="0" height="132" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieQYGursb83gJo3oyoy3a_-QixEJx_1ezonlWsLSGLef6UsR046PLLlxMf6TZyPpDNx9E37nNV799gLUdgUbXOB-IQGf9skLggy0VDOEKaQJOZOAg0xC4MBVaccadhtGt6TtJ9RX5eGaJL/?imgmax=800" style="background-image: none; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: block; float: none; margin: 0px auto; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="janetter-fontes" width="191" /></a></td></tr>
</tbody></table>
</center> 
Aproveite para conhecer outros aplicativos, acessando <a href="http://bloggingforincome.net/8-multi-column-twitter-clients/">8 Multi-Column Twitter Clients</a> 
<a href="http://twitter.com/dicas_blogger"><img alt="twitter-follow" border="0" height="111" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3SvnEdzy5uMUEMybvryXs2wPaMcYvxvWqPtYJ78m0G-L52XtxMEGxtKHa03E98PCmR6MZqFa75v-kImpI1bYveD06xNRAAu5DyOqtEXwTp_9GhJpF4krbYr0lQrfp844pM9wuc25xmCfC/?imgmax=800" style="background-image: none; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: block; float: none; margin-left: auto; margin-right: auto; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="Siga o Dicas Blogger!" width="224" /></a>

3 programas poderosos para usar o Twitter

Não é de hoje que procuro o aplicativo twitter-client perfeito. Nessa minha incansável busca, acabei testando vários programas até encontra...

Continue Lendo >>

08:25

Otimizando seu blog com meta tags

<img align="right" alt="seo" border="0" height="181" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEge637HAQ7P0ginQWYvawvq_chIs63m2cpp9QdZIN6Quh9481OFoL-CsrVuGguP6oQ6MzRcDdycp1ccmKIriLc37LXYhod05fi7T_nUC8vZD9GPtHsahWWGEWQjTBsa9wAfP5GTGw0VmgAw/?imgmax=800" style="background-image: none; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: inline; float: right; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="seo" width="180" />Nunca foi segredo pra ninguém: não tenho muita paciência para estudar SEO. O DB sempre esteve bem posicionado no Google e isso me levou à uma certa acomodação e a acreditar que bastava algumas <a href="http://www.dicasblogger.com.br/2010/04/descricao-do-blog-mecanismos-de-busca.html" title="Descrição para os mecanismos de busca">configurações básicas</a> e um bom conteúdo que estava tudo resolvido. De certa forma eu não estava errada, mas  tal pensamento não se aplica a todos os blogs e só fui descobrir isso após trabalhar com encomendas de templates 
No caso do meu blog, o nome dele é um dos grandes diferenciais sendo responsável pela maior parte das visitas, mas nem sempre funciona assim. Em alguns blogs o nome pode não ajudar muito e, por padrão, o Blogger sempre mostra o nome do blog antes do título da postagem. Vejam: 
<img alt="busca-google" border="0" height="129" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgT6LK9JJek1eoD1hIna74FZuhQ84i5a3uuEouLjh4QPpwjX7Nj-h97DJoSJiWwdTB3wUSzC55ydNnUUbLYWBTLiAR-pfabLKwRBwYsPDto-QV0FN6p0nuh6vUavd4H1PbqJ4RYKCSjhO9F/?imgmax=800" style="background-image: none; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: block; float: none; margin: 0px auto; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="Busca feita no Google" width="452" /> 
No caso do DB isso não costuma ser um problema, mas em blogs cujo nome não está diretamente relacionado ao conteúdo pode acabar prejudicando o posicionamento nos motores de busca, que “enxergam” o que vem primeiro. 
Tenho um cliente que possui um blog muito bacana, sério e de ótima qualidade, mas que não tinha um bom posicionamento no Google. Isso não fazia sentido pra mim, pois ele tinha tudo que eu antes considerava eficiente para SEO. Onde estava o problema então? No nome do blog. Mudei a sequência e seu posicionamento melhorou muito. 
Pedi a ele que não enviasse links para agregadores durante 1 mês e fiz as modificações  para otimizar os títulos dos posts. Vejam os resultados iniciais: 
<img alt="comparativo" border="0" height="279" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgahsn8PJ5J_i_8OzoszToMK09ZfcDVO-aCGJUgEhiTUc8CpGncu4zoSQV2zda17LUSM4-QPnBfwmUP2367h409Bgcq9vPLrL_UA5pFWc7fLDSXUyrA9ZAYq6fP_6O3A15ZbTsvG4IkCxz7/?imgmax=800" style="background-image: none; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: block; float: none; margin: 0px auto; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="comparativo" width="502" /> 
<div align="center">
Aumento de quase 50% apenas mudando o título dos posts</div>
Agora vamos analisar um caso fictício, mas baseado no que acabei de descrever: 
<blockquote>
Nome do blog: LAR DOCE LAR 
Post: receita de brigadeiro 
Busca por: receita de brigadeiro 
Padrão do Blogger: LAR DOCE LAR (nome do blog)– receita de brigadeiro (post) 
Ideal para este blog : receita de brigadeiro – LAR DOCE LAR</blockquote>
Para resolver esse problema, é preciso mudar algumas meta-tags. Meta tags são linhas de código HTML, ou "etiquetas", que, entre outras coisas, descrevem o conteúdo do seu site para os buscadores. 
Entre no HTML do template e procure por (fica bem no começo): 
<blockquote>
<title><data:blog.pageTitle/></title></blockquote>
Substitua tudo por: 
<blockquote>
<b:if cond='data:blog.pageType == "index"'> 
<title>NOME DO SEU BLOG - PEQUENA DESCRIÇÃO</title> 
<b:else/> 
<title><data:blog.pageName/> - <data:blog.title/></title> 
</b:if></blockquote>
A parte assinalada em amarelo é que fará a inversão entre o nome do blog e o título dos posts. Na parte em vermelho, escreva o nome do blog e,a pós o hífen, coloque uma breve descrição que irá aparecer na página inicial do blog. 
Eu apliquei esta técnica na minha página de produtos e serviços. Na primeira imagem, vemos como o blog aparece nos motores de busca e na segunda, vemos o título do post vindo antes do nome do blog. 
<img alt="image" border="0" height="52" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7Se5mJTrlLC4aqPFnNltWb9uJijHE6dWq2ObiadChQSlzWGB-ODBGRO-xP2kpHmd7knNE9qnBoIquZkrB2JvhatlWeRU0M6HeYInhZfYXIsKOxLukH7DmW1pvvkXi6jFdeYwZ3-2MIzAy/?imgmax=800" style="background-image: none; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: block; float: none; margin: 0px auto; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="image" width="452" /> 
<img alt="seo" border="0" height="136" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhezwhQMxynzfuQKj5jzSKr5BhEqSP8pnntezNSPLja7qCjJQCmPLpUAkaqZyjYfySTViMldByV8FQENEJPN2k6lUBU3cHOv2NSZiRxgcUbvlSmC2Zn9ruYoW1qMYY7YuoBKJylaxsGyDow/?imgmax=800" style="background-image: none; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: block; float: none; margin: 0px auto; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="Post - Nome do blog" width="452" /> 
Para colocar uma descrição mais detalhada, como a que aparece embaixo do nome do blog, basta usar o código do post <a href="http://www.dicasblogger.com.br/2010/04/descricao-do-blog-mecanismos-de-busca.html">Descrição do blog para os mecanismos de busca.</a> 
O padrão do Blogger é: 
<blockquote>
<b:include data='blog' name='all-head-content'/> <title><data:blog.pageTitle/></title></blockquote>
Para colocar a descrição, as palavras-chave e mudar a sequência do nome do blog com o título dos posts, substitua: 
<blockquote>
<title><data:blog.pageTitle/></title></blockquote>
por: 
<blockquote>
<b:if cond='data:blog.homepageUrl == data:blog.url'> <meta content='Descrição' name='description'/> <meta content='Palavras-chave' name='keywords'/> </b:if> 
  
<b:if cond='data:blog.pageType == "index"'> 
<title>NOME DO SEU BLOG - PEQUENA DESCRIÇÃO</title> 
<b:else/> 
<title><data:blog.pageName/> - <data:blog.title/></title> 
</b:if> </blockquote>
O código final ficaria assim: 
<blockquote>
<b:include data='blog' name='all-head-content'/>  (padrão blogger) 
<b:if cond='data:blog.homepageUrl == data:blog.url'> <!—descrição e palavras-chaves--><meta content='Descrição' name='description'/> <meta content='Palavras-chave' name='keywords'/> </b:if> 
  
<b:if cond='data:blog.pageType == "index"'>  <!—parte que se refere aos títulos--> 
<title>NOME DO SEU BLOG - PEQUENA DESCRIÇÃO</title> 
<b:else/> 
<title><data:blog.pageName/> - <data:blog.title/></title> 
</b:if> 
<b:skin><![CDATA[  (padrão blogger)</blockquote>
Os códigos devem ser inseridos entre as duas partes amarelas. 
No painel do Blogger>configurações> básico – deixe apenas o nome do blog em título. 
No blog da Clau – Mundo Blogger – tem uma outra forma ainda mais completa de colocar as meta-tags de descrição e 2 sites excelentes para vocês fazerem testes: 
<ul>
<li><a href="http://www.mundoblogger.com.br/2010/12/como-inserir-meta-tags-no-blogger.html">Como Inserir Meta Tags no Blogger</a></li>
</ul>
Como saber se seu blog precisa ou não destas mudanças? Testando. O que pode ser bom para um, pode não ser bom para outro. 
Sempre que você for mudar as meta-tags, guarde as anteriores, coloque data e as  estatísticas de acesso e vá fazendo comparativos. 
Atualização em 22/02/2011 
Vejam como anda o blog do meu cliente: 
<img alt="analytics" border="0" height="162" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvM9cNzvHi1-9WdPgZFKu99tV32m9_-KnR-epW9lfWzlDrTsbPxNUrlcdlHp67IgVJIhjhuxgJIkVnOwYfft-H4EvyQBlEl3AC0Tsv7cZMXwN-MsYgDjS3SZtmT-NaedCIFSBF4OgEaGaX/?imgmax=800" style="background-image: none; border-bottom: 0px; border-left: 0px; border-right: 0px; border-top: 0px; display: block; float: none; margin: 0px auto; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="analytics" width="502" /> 
<div align="center">
Aumento de mais de 80%</div>

Otimizando seu blog com meta tags

Nunca foi segredo pra ninguém: não tenho muita paciência para estudar SEO. O DB sempre esteve bem posicionado no Google e isso me levou à um...

Continue Lendo >>

15:39

Widgets com ícones para redes sociais

<img align="right" alt="image" border="0" height="112" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuez0oiPIJCl9UT0XXNLG_PpNgTNoRt91Q02lvIZy97EKTnfx-_w0L3ctcfSDjYTZEVkevfuZ1JL7-_YZiZV7_3Gj6e75_E_3BFIWxs_4R0ao_esGlVP-j3MhJux1B-XHmcjrYbxGyr9N_/?imgmax=800" style="background-image: none; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: inline; float: right; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="Redes Sociais" width="147" />A última moda em blogs, são os ícones para as redes sociais. O principal objetivo é incentivar os visitantes a seguirem no Twitter, Orkut, Facebook e a assinarem os feeds do blog.  
Pra ajudá-los, criei dois gadgets baseados em CSS, super simples de serem implementados no Blogger. 
Recomendo fortemente que as imagens dos ícones sejam enviadas para a conta do Picasa de vocês e que as URLs dessas imagens sejam substituídas. 
<ul>
<li><a href="http://www.dicasblogger.com.br/2010/07/como-hospedar-imagens-no-picasa.html">Como hospedar imagens no Picasa</a> </li>
<li><a href="http://www.dicasblogger.com.br/2008/09/backup-no-picasa-de-imagens-contidas.html">Backup no Picasa de imagens contidas nos templates</a></li>
</ul>
Widget 1 – Twitter, Feeds e Facebook 
<img alt="socialmedia-icons" border="0" height="211" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGCATXGaNc68VsdancpnWlHyVY2dlw4qavP1Iah6zEgjYGPjf834_ttUhPRi_4KbCmiU5KhkRT-495diMoBkP5EEQr92KydpuT9S73Zs2QdOU_6FJAbeCyl7BjgW0Jayg798iJFhXWCq5x/?imgmax=800" style="align: center; background-image: none; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: block; float: none; margin: 0px 0px 0px 55px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="Icones para redes sociais" width="340" /> 
Vá no HTML do template, dê um Crtl+F com o teclado e procure por ]]></b:skin> . 
Cole antes dessa tag o seguinte código: 
<blockquote>
/* SOCIAL MEDIA 
----------------------------------------------- */ 
#socialmedia{background:#F6F8F8;border:1px solid #DBE2E0;padding:10px 5px 15px 10px; margin: 5px;} 
#socialmedia:hover{border:1px solid #90C2D7;} 
#socialmedia a{color:#666666;text-decoration:none;font-weight:bold;font-family:Arial,Helvetica,Sans-serif} 
#socialmedia a:hover{color:#3c88b2;text-decoration:underline} 
#socialmedia img{vertical-align:middle;margin-right:5px;}</blockquote>
Salve o template. Vá nos elementos de página e clique em adicionar gadget. Escolha HTML/javascript e cole este outro código: 
<blockquote>
<div id='socialmedia'><img alt='' src='<a href="https://lh3.googleusercontent.com/_mcq01yDJ2uY/TW_BEKq7aTI/AAAAAAAAEUw/Lb9JMwUAiZ8/socialconnecttwitter.png">https://lh3.googleusercontent.com/_mcq01yDJ2uY/TW_BEKq7aTI/AAAAAAAAEUw/Lb9JMwUAiZ8/socialconnecttwitter.png</a>' style='width: 32px; height: 32px; float:left;'/> 
<a href='URL DO TWITTER'>Siga no Twitter</a> 
</div> 
<div id='socialmedia'><img alt='' src='<a href="https://lh5.googleusercontent.com/_mcq01yDJ2uY/TW630L9WcaI/AAAAAAAAEUM/iLypEEa1b5Y/socialconnectrss.png">https://lh5.googleusercontent.com/_mcq01yDJ2uY/TW630L9WcaI/AAAAAAAAEUM/iLypEEa1b5Y/socialconnectrss.png</a>' style='width: 32px; height: 32px; float:left;'/> 
<a href='URL DOS FEEDS'>Assine os feeds</a> 
</div> 
<div id='socialmedia'><img alt='' src='<a href="https://lh3.googleusercontent.com/_mcq01yDJ2uY/TW_BI34MoHI/AAAAAAAAEU0/GuFjmmcm87w/socialconnectfacebook.png">https://lh3.googleusercontent.com/_mcq01yDJ2uY/TW_BI34MoHI/AAAAAAAAEU0/GuFjmmcm87w/socialconnectfacebook.png</a>' style='width: 32px; height: 32px; float:left;'/> 
<a href='URL DO FACEBOOK'>Curta no Facebook</a> 
</div></blockquote>
<ul>
<li>Em URL DO TWITTER, escreva o endereço do seu Twitter </li>
<li>Em URL DO FEED, coloque o endereço dos feeds do blog </li>
<li>Em URL DO FACEBOOK, coloque o endereço do seu perfil ou da página de fãs</li>
</ul>
Widegt 2 - Feeds, Twitter, YouTube, Orkut e Facebook 
    <img alt="socialmedia icons" border="0" height="72" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQ5V990KP6YeqjEkZvruxptTRheAbW4-SAwGCFq-mNE8LVY-XodDpT4UzvuIncfweCCVtUlfL57yY5La4M_v5gr1sYcG9DQwHi-EcvJvZcyS37-mhNH3MKQK8rla5koPGUR3qgGMOjoPVD/?imgmax=800" style="background-image: none; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: block; float: none; margin: 0px 0px 0px 82px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="Icones para redes sociais" width="293" /> 
No painel do Blogger, clique em design > adicionar gadget>HTML/javascript. 
Cole o código abaixo, fazendo as respectivas alterações (em vermelho) 
<blockquote>
<div style="margin: 5px; padding: 10px;"><a href="ENDEREÇO DO FEED"><img style="border: 0px solid ; width: 48px; height: 48px; float: left;" alt="" src="<a href="http://lh5.ggpht.com/_dAGEULh1_1g/THwD-xP5n9I/AAAAAAAAEBk/1DE1CA0UtCA/rss.png%22">http://lh5.ggpht.com/_dAGEULh1_1g/THwD-xP5n9I/AAAAAAAAEBk/1DE1CA0UtCA/rss.png"</a>></a><a href="ENDEREÇO DO TWITTER"><img style="border: 0px solid ; padding-left: 5px; width: 48px; height: 48px;" alt="" src="<a href="http://lh4.ggpht.com/_dAGEULh1_1g/THwD-5SoTTI/AAAAAAAAEBo/Yh2jRrtkOeo/twitter.png%22">http://lh4.ggpht.com/_dAGEULh1_1g/THwD-5SoTTI/AAAAAAAAEBo/Yh2jRrtkOeo/twitter.png"</a>></a><a href="ENDEREÇO DO YOUTUBE"><img style="border: 0px solid ; width: 48px; height: 48px; padding-left: 5px;" alt="" src="<a href="http://lh3.ggpht.com/_dAGEULh1_1g/THwD-4XjHKI/AAAAAAAAEBs/waG0ImvEsQI/youtube.png%22">http://lh3.ggpht.com/_dAGEULh1_1g/THwD-4XjHKI/AAAAAAAAEBs/waG0ImvEsQI/youtube.png"</a>></a><a href="ENDEREÇO DO ORKUT"><img style="border: 0px solid ; width: 48px; height: 48px; padding-left: 5px;" alt="" src="<a href="http://lh4.ggpht.com/_dAGEULh1_1g/THwD-3vEZVI/AAAAAAAAEBg/jq-RSB5gXBc/orkut.png%22">http://lh4.ggpht.com/_dAGEULh1_1g/THwD-3vEZVI/AAAAAAAAEBg/jq-RSB5gXBc/orkut.png"</a>></a><a href="ENDEREÇO DO FACEBOOK"><img style="border: 0px solid ; width: 48px; height: 48px; padding-left: 5px;" alt="" src="<a href="http://lh6.ggpht.com/_dAGEULh1_1g/THwD-vZ7bDI/AAAAAAAAEBc/4fHoPnWmq8M/facebook.png%22">http://lh6.ggpht.com/_dAGEULh1_1g/THwD-vZ7bDI/AAAAAAAAEBc/4fHoPnWmq8M/facebook.png"</a>></a> </div>  </blockquote>
Neste template de testes, é possível ver os dois gadgets em ação. Clique para ampliar. 
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6-RBX42hKZTNIYlVmaLikAHI8U1usGMFzKHCS0wFQE8VNSB6_2pUhfRt1HqfyoH8xzadXSFoxIcHQ4kqYiYrF6SA9yKErAfD4RGCpzPSFDfzG7-fUJPnD-TRiRtaNXUeZacMpqpYnty6D/s1600-h/image%5B77%5D.png"><img alt="image" border="0" height="251" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuAN-HyuOQGKF2kamAX6FcP_dbFSIj2QAxSvGW6xRbZoi5-zJwhJgoU9vrPYVnpABrcHH0EDKV_OI0vBDBTsM7iUyAfktndA6ojT6j4ypfUCkqQmYgmKqIGBSzK1wi39t41audJfshRBkY/?imgmax=800" style="background-image: none; border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: block; float: none; margin: 0px auto; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="Teste" width="452" /></a> 
Atualização em 03/03/2011 
Tem coisas no Blogger que são simplesmente inexplicáveis. Até outro dia, bastava colar a URL da imagem no local indicado e pronto. Atualmente, notei que as imagens hospedadas no Picasa Web não estavam aparecendo mais. Depois de muita investigação, descobri que – sabe-se lá porque – o Blogger estava mudando as URLs por conta própria. A solução é ainda mais bizarra rs Depois de colar o código no gadget HTML/Javascrip, é preciso clicar em “Formato Rich Text” para que as imagens funcionem. Prefiro nem comentar.

Widgets com ícones para redes sociais

A última moda em blogs, são os ícones para as redes sociais. O principal objetivo é incentivar os visitantes a seguirem no Twitter, Orkut, F...

Continue Lendo >>

19:47