Como criar uma página de fãs no Facebook

No post anterior ensinamos como colocar o botão do Facebook no Blogger e a importância de divulgar posts na rede social que mais cresce atualmente. Dentro de poucos meses o tráfego do Facebook irá superar o do Google, é vital para qualquer blog ter uma presença nesta rede, por isto vamos mostrar como criar uma página de fãs no Facebook. Centenas de outros blogs já abordaram este assunto, mas com algumas pequenas alterações em pormenores que poucos conhecem, é possível gerar um tráfego muito maior de visitas para o blog do que somente com a simples criação da página.

Uma dúvida muito frequente é o porque da utilização de uma página de fãs para integrar o blog e não o perfil no Facebook, e a resposta é bastante simples: o perfil é limitado à 5000 amigos, a página de fãs não tem limites. Além disto, é possível utilizar aplicativos que vão potencializar ainda mais a página, como vamos demonstrar à seguir.

Como criar a página de fãs
O processo de criação da página é bastante simples e intuitivo, basta ir à http://www.facebook.com/pages/create.php e preencher os dados necessários:


Como a página no exemplo é relacionada com um blog, optamos por escolher Marca e Site.
O passo seguinte é preencher as informações sobre o blog e colocar uma imagem:


A imagem utilizada não deve ser superior à 150px de altura e 150px de largura, para não ficar desajustada no widget do Facebook para blogs.
Após preencher alguns dados, estas sugestões na página inicial desaparecem.

Personalizar a URL
Após 25 usuários do Facebook tornarem-se fãs da página, o Facebook disponibiliza a opção de personalizar a URL: http://www.facebook.com/username. Este ponto é talvez o mais importante, os motores de busca atribuem um peso muito grande à URL, é comum ver páginas de fãs no Facebook nos primeiros resultados de buscas do Google. Tenha atenção que, uma vez escolhido o username, o Facebook não permite que seja alterado. Se a página for apagada o username fica indisponível para sempre (a não ser em caso de marcas registradas, que podem solicitar a utilização na central de apoio do Facebook).

Página de aterragem no Facebook
Página de aterragem é a página que os visitantes serão direcionados ao entrar pela primeira vez na página de fãs do blog no Facebook. Por norma, se não for feita nenhuma alteração, o visitante ao clicar no link que leva à página (vindos dos motores de busca, de widgets no blog ou de outro link qualquer) serão direcionados para o Mural, onde a probabilidade de clicar no botão gostar é MUITO menor do que se for direcionado para uma página convidando à tornar-se fã.

Veja como exemplo a página de boas vindas do Dicas Blogger no Facebook:



A tendência do visitante em clicar em "gosto" e tornar-se fã é muito superior à se fosse direcionado para o mural, onde o excesso de informações contido nesta parte da página pode acabar distraindo a atenção (como o feed do blog, comentários de outros visitantes, banners e imagens).

Como criar uma página de aterragem no Facebook
O processo de criação de uma página de boas vindas é bastante simples, para isto é necessário utilizar o aplicativo FBML. Esta aplicação abre uma (ou várias) guias onde podemos inserir qualquer código HTML. Para instalar o FBML basta ir em Editar página e, no final da página, clicar em FBML (ou em Mais aplicativos, caso não apareça o FBML):



Automaticamente aparece uma guia com o aplicativo na página de fãs. Para configurar, basta voltar à Editar página e clicar em Editar no FBML:



Nesta etapa vamos alterar o nome que vai aparecer na guia (sidebar) da página inicial. No caso do Dicas Blogger utilizamos “Bem Vindo!”. Na caixa embaixo é inserido o código HTML. Neste caso foi utilizado apenas uma imagem previamente salva no próprio Blogger:



Após salvar, é necessário um último passo para que o visitante que ainda não tornou-se fã da página (ou que não esteja logado no Facebook) seja direcionado para a página de aterragem. Para isto, voltamos à Editar página – Configuração do Mural e escolhemos a página que configuramos previamente (Bem Vindo!):



Como disse no início do post, é bastante fácil criar uma página de fãs no Facebook, mas estes detalhes de otimização vão fazer uma diferença muito grande no número de pessoas que vão tornar-se fã e, consequentemente, no número de visitas para o blog que isto irá gerar.

E você, já é fã do Dicas Blogger no Facebook?

(Post baseado na página de fãs do problogger.net)

Entendendo os códigos do Blogger

Agora que vocês já sabem a diferença entre layout e template e que é preciso entender HTML e CSS para modificar templates, vamos então começar a estudar os códigos usados nos templates criados para o Blogger/Blogspot.
Antes de mais nada, recomendo que vocês instalem o Template Mínima em um blog de testes. Não sabe como instalar o Mínima? Então acesse:

• Como voltar a usar os antigos templates do Blogger

Bom, os templates que funcionam no Blogger possuem a extensão .XML

O XML é um formato para a criação de documentos com dados organizados de forma hierárquica, como se vê, frequentemente, em documentos de texto formatados, imagens vetoriais ou bancos de dados. Entre linguagens baseadas em XML incluem-se XHTML (formato para páginas Web) Fonte: Wikipedia

Existem algumas regras para o uso de documentos em XML:

• Todo documento XML, tem que ter uma tag introdutória;
• XML  difere letras maiúsculas e minúsculas;
• Todo elemento XML deve ser iniciado e fechado;
• Comentários em XML são iguais ao HTML (<!--comentário-->) .

A tal tag introdutória pode ser vista no começo do Template Mínima:

O XML ou o seu derivado XHTML, a grosso modo, é um HTML melhorado. Ambos utilizam de comandos simples, chamados de tags, para definir as várias partes de uma página web. Veja, a seguir, alguns exemplos de tags HTML:
No site Truques e Dicas, encontrei uma lista com as tags HTML mais utilizadas e suas respectivas funções – Listas de tags comuns
Os templates do Blogger são feitos com XHTML. Sendo assim, aceitam tags HTML.
Basicamente, um template para Blogger/Blogspot é dividido em;

1. tag introdutória
2. variáveis
3. CSS
4. DIVs e Classes

Já expliquei sobre a tag introdutória. Quanto às variáveis,  são a parte que permite a edição das fontes e das cores diretamente pelo painel do Blogger:

O CSS é que vai ditar as regras de posicionamento de todos os elementos do layout, juntamente com as DIVs e classes. Detalhes? Somente no próximo post ;)

Conhecendo o layout do Blogger

Para dar continuidade à série “Como personalizar templates para Blogger/ Blogspot”, agora nós vamos conhecer os layouts utilizados no Blogger.
Antes de mais nada, é importante entender a diferença entre layout e template.
O layout, para fins de linguagem do Blogger, é aquela parte onde ficam os gadgets. É a estrutura do template, que compreende a disposição dos elementos de página.

Layout gráfico (em inglês: Page layout) é um esboço mostrando a distribuição física, tamanhos e pesos de elementos como texto, gráficos ou figuras num determinado espaço. Pode ser apenas formas rabiscadas numa folha para depois realizar o projeto ou pode ser o projeto em fase de desenvolvimento. Fonte: Wikipedia

Vejam como é o layout do famoso Template Mínima, criado por Douglas Bowman:

O layout do Blogger é dividido, basicamente, nos seguintes elementos:

1. navbar: barra de navegação
2. cabeçalho: é onde fica o título do blog (header, em inglês)
3. área dos posts
4. barra lateral: barra que pode ficar à direita ou à esquerda ( sidebar, em inglês)
5. rodapé: área final (footer, em inglês)

Já o template é a parte gráfica, o visual,  também chamado de tema ou modelo.

Vocês devem estar se perguntando, por que é que eu estou usando o Template Mínima para exemplificar a diferença entre layout e template, correto? Simples. Porque a maioria dos templates criados por usuários nasceram do Mínima.
Os templates do Designer do Modelo foram lançados há menos de 6 meses. Eles possuem um código diferente, nem todos os recursos (hacks) funcionam neles e a personalização pode ser feita, em partes, pelo próprio painel do Blogger.

Sendo assim, quando entrarmos nos posts sobre HTML e CSS, usarei sempre o código do Mínima e/ou dos meus templates para fornecer os exemplos.
Se você ainda não conhece todos os tipos de templates para o Blogger, acesse:

•  Opções de templates para Blogger

Além do layout padronizado pelo Mínima, podemos encontrar modelos com sidebar à direita ou dos dois lados, com menu horizontal (chamado também de linkbar), com o rodapé dividido em 2, 3 ou 4 partes e por aí vai. Opções é o que não faltam.
Na figura abaixo, vemos o atual layout do DB Templates, com o cabeçalho dividido em dois, a barra lateral dividida em 3 e o rodapé dividido em 4 partes.

Tudo isso foi feito única e exclusivamente aplicando técnicas de CSS. Legal, né?

Nova série: como personalizar templates do Blogger

Enquanto o JV inicia uma série de posts sobre o uso do Facebook para blogueiros, eu vou começar uma outra: “como personalizar templates para Blogger/ Blogspot”.
É muito comum me perguntarem se eu uso algum programa para criar meus templates. A resposta é não. O que eu uso é o próprio editor HTML do Blogger, onde vou personalizando o layout através do uso de HTML e CSS.
Primeiramente eu quero deixar claro que todo blogueiro que deseja personalizar seu próprio template, tem que saber HTML e CSS, que são as linguagens de programação utilizadas na criação e personalização de páginas web.

HTML (acrônimo para a expressão inglesa HyperText Markup Language, que significa Linguagem de Marcação de Hipertexto) é uma linguagem de marcação utilizada para produzir páginas na Web. Documentos HTML podem ser interpretados por navegadores. A tecnologia é fruto do "casamento" dos padrões HyTime e SGML. Fonte: Wikipedia

Cascading Style Sheets (ou simplesmente CSS) é uma linguagem de estilo utilizada para definir a apresentação de documentos escritos em uma linguagem de marcação, como HTML ou XML. Seu principal benefício é prover a separação entre o formato e o conteúdo de um documento. Fonte: Wikipedia

Existem sites e livros incríveis, que dão muitas dicas preciosas sobre HTML e CSS:

• CSS, Padrões Web e Acessibilidade – Maujor
• Dicas de CSS - Código Fonte
• CSS Tutorial - Table of contents - HTML.net
• CSS – O Manual que faltava – Editora Digerati

A maioria das páginas web foram construídas usando  HTML e CSS 2. Com o Blogger não tem sido diferente. Mas, de um tempo para cá, estamos nos deparando com a terceira versão do CSS - o CSS 3 - que, apesar de ser fantástico, ainda não é totalmente compatível com o Internet Explorer e nem com versões mais antigas dos demais navegadores: Firefox, Chrome, Opera e Safari.

• Dicas Blogger: Campanha “Atualize o seu navegador”
• Dicas de Informatica: O que é um navegador

Para ver a diferença de um template criado usando CSS 3, acesse este modelo customizado pelo Dicas Browser – Template Gradiente. Todo o degradê foi feito usando CSS 3 e não imagens, como era feito no CSS 2.
Conhecendo o básico de CSS, qualquer um consegue fazer modificações no template.
O diferencial entre os designers de templates, nem sempre está no conhecimento e sim na  criatividade. Notem que cada designer possui um estilo próprio – o que leva gente ignorante a achar que os modelos são todos parecidos.
Quem ganha com isso é você, usuário do Blogger, que na hora que quiser baixar um template gratuito ou encomendar um template exclusivo, vai poder escolher entre vários estilos e autores.
Esta série vai receber o marcador “dicas templates”. Um bom proveito para todos nós.

Como colocar o botão do Facebook no Blogger

Com a popularização de aplicativos como o Farmiville e outros jogos online, o Facebook obteve um crescimento explosivo no Brasil. Ficar de fora do Facebook é perder a oportunidade de receber milhares de visitas no seu blog ou site. Vou iniciar uma série de artigos ensinando como integrar um blog ao Facebook, e o primeiro é como colocar um botão do Facebook no Blogger:

A vantagem de utilizar o botão "Gosto" (ou "Like", em inglês e "Curtir", em português de Portugal) é que sempre que alguém clica no botão será feita uma atualização do status no mural do perfil no Facebook com o link do post em questão. Os amigos deste perfil também irão receber esta atualização. Para colocar este botão, tal como o botão do Twitter, não é necessário ter conta no Facebook.

Integrando o botão do Facebook no Blogger:
O botão "Gosto" pode ser inserido em qualquer parte. Recomendo que seja colocado no final do post, é o local onde o leitor irá realizar a próxima ação após a leitura, mas isto não é uma regra. Antes de fazer esta alteração, faça um backup completo do template do blog.

Entre no painel do Blogger, clique em design e, depois, em editar HTML. Marque a caixa expandir modelos de widgets e procure por:

<data:post.body/>

Copie e cole logo abaixo do código anterior:

<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:40px;'/>

Se deseja que o botão do Facebook apareça na parte superior do post, ao lado do título, coloque o código logo abaixo desta linha:

<div class='post-header-line-1'/>

Otimizar o botão do Facebook:
Para que o botão não apareça na página inicial, somente nos posts, deve inserir o código em verde:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:40px;'/>
</b:if>

Para que apareça as fotos dos utilizadores que gostaram, deve alterar o false para true, e o tamanho do widget de 40px para 80px:

<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=true&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:80px;'/>

Outra coisa que pode ser feita é alteração de "Gosto" para "Recomendar", bastando para isto alterar o like (em vermelho, no código acima), por recommend.

A fonte das letras também pode ser alterada, por default vem em Arial, mas é possível utilizar outras fontes.

Salve e veja se ficou tudo correto.

Gostou? Seja fã do Dicas Blogger no Facebook!

Erro 503 no Blogger - Service Unavailable

Há cerca de 10 dias, o Blogger começou a apresentar a mensagem Service Unavailable – Error 503 e o problema só vem aumentando.
Os erros 503 aparecem em diversas situações em que estamos usando o Blogger; seja na hora de colocar um gadget, postar, mudar o template, acessar o blog e etc.
Segundo informações do nosso amigo Cidão, trata-se de sobrecarga nos servidores:

• Bugs ao inserir imagens e os infinitos erros 503 no Blogger

Pesquisando na web sobre o Erro 503, encontrei a seguinte definição:

O servidor Web (que faz o website funcionar) não consegue no momento lidar com o pedido de HTTP devido a uma sobrecarga temporária ou manutenção do servidor. A implicação é que esta é uma condição temporária que será resolvida depois de algum atraso. Alguns servidores nesta condição também podem simplesmente recusar conexão de soquete, e neste caso um erro diferente pode ser gerado por que a criação do soquete devido ao tempo esgotado de criação de soquete. Fonte: CheckupDown

Quando os erros 503 aparecem pra você, basta atualizar a página, clicando em “atualizar (refresh)” no navegador ou apertando a tecla F5 do teclado.

Blogger no iPhone - Como escrever e publicar posts

Até há pouco tempo escrever posts no iPhone para serem publicados no Blogger era um exercício de paciência: ou escrevia-se o HTML na unha e enviava-se por email para ser automaticamente publicado, ou recorria-se à aplicações muito incompletas, sem grande possibilidade de otimização.

Um dos programas que sempre utilizei foi o BlogPress, mas era bastante limitado em relação à outra coisa que não fosse escrever os posts, colocar fotos, categorias e publicar. Para inserir um link no texto era um martírio, com vários passos: publicar o post, abrir o Blogger no browser e editar o HTML. Usei durante muito tempo para fazer posts pequenos e rápidos, mas com as últimas atualizações da aplicação estou utilizando cada vez mais.

Como escrever e publicar um post no Blogger com o iPhone
Quando se inicia a aplicação BlogPress a primeira coisa que se deve fazer é o login com o username da conta do Google. Automaticamente todos os blogs desta conta serão sincronizados com a aplicação. A seguir, podemos começar a escrever o post:

Título e Categorias:
Após inserir o título do post, podemos escolher a categoria do post (clicando no i após o título), ou mesmo criar novas categorias. Pode-se também escolher entre publicar ou salvar o rascunho no Blogger:

    

Inserir imagens no post:
As imagens podem ser inseridas através da livraria do iPhone ou tiradas na hora com a camera, bastando para isto clicar no ícone da camera no canto superior direito. Serão automaticamente enviadas para a conta definida pelo utilizador: Picasa ou Flickr. Também há possibilidade de ajustar o tamanho da imagem e o posicionamento no post:

     

Inserir links e outros códigos HTML:
O que tornou o BlogPress muito mais útil para publicar posts no iPhone foi a possibilidade de edição em HTML direto na aplicação, permitindo a inserção de links e outros códigos, como mostra a imagem a seguir:

      

Concluindo…
A informação na internet circula cada vez mais rápido, os mecanismos de pesquisa estão cada vez mais aprimorados e indexando e mostrando resultados em tempo real (Google Caffeine, Google instant), as aplicações do iPhone e outros dispositivos móveis que possibilitam produzir posts em blogs podem acabar por deixar de ser uma simples curiosidade e se tornarem em ferramentas poderosas.
Eu já utilizo diariamente, e vocês, já publicaram posts através do iPhone ou de outro telefone celular?

Link para Apple Store: BlogPress (2,39€)

Vírus no Orkut – Cuidado!

Desde ontem, um script malicioso está contaminando inúmeras contas no Orkut.
A recomendação é que ninguém acesse o Orkut até que o problema seja solucionado.
Para obter maiores informaçõe, acesse:

• “Vírus do orkut” gera caos na rede social
• Brecha de segurança no Orkut: não acesse a rede social

E siga estas contas no Twitter: @googlediscovery, @meio_bit e @tecnoblog
O vírus só afeta os usuários que estão usando o novo Orkut.
ATUALIZAÇÃO em 26/09: O problema já foi corrigido

• Google corrige erro que atingiu 180 mil usuários no Orkut
• Bug no Orkut afeta milhares de usuários [atualizado]

Como denunciar plágio ao Blogger

Em junho do ano passado, publiquei um guest-post do Compulsivo, onde ele ensinava como como denunciar os ladrões de conteúdo.
De lá para cá, o formulário de denúncias do Blogger mudou e passou a ser em português. Sendo assim, resolvi explicar novamente como fazer este tipo de denúncia.
O formulário de denúncias do Blogger é extremanente eficiente. Das vezes que precisei usar ( e não foram poucas), os artigos clonados do meu blog foram retirados do ar em menos de 48 horas, incluindo as cópias de templates :)
Vou tentar explicar como usar esse formulário usando imagens (screenshots), portanto clique sobre elas para ampliá-las.
Primeiramente, acesse o formulário de denúncias através deste link:

• Lei de Direitos Autorais do Milênio Digital – Blogger

1. INFORMAÇÕES DE CONTATO
A primeira parte do formulário se refere às informações de contato do dono do blog. Preencha os campos (espaços em branco) do formulário da seguinte forma:
2. SEU TRABALHO PROTEGIDO POR LEIS DE DIREITOS AUTORAIS
No primeiro campo, informe o endereço (URL) do seu blog que sofreu o plágio.
No segundo campo, informe as URLs dos seus posts que foram plagiados.

3.LOCAL DO MATERIAL INFRATOR NO BLOG
No primeiro campo, informe todas as URLs ( do blog plagiador) dos posts que foram copiados do seu blog e repita-as no segundo campo.
Vamos para um exemplo prático? Nas imagens abaixo, vou mostrar uma denúncia que acabei de fazer, assim fica mais fácil para vocês entenderem o formulário.
No final, marque todos os campos obrigatórios, coloque a data e, na assinatura, escreva seu nome completo. Clique então no botão “enviar”.

Este formulário só serve para denunciar blogs que estejam hospedados no Blogspot, mesmo que tenham domínio próprio.

Como retirar o gadget attribution

Nos novos modelos de templates do Blogger – designer do modelo – existe um gadget chamado attribution, que tem por finalidade exibir os créditos ao autor do template.

Esse gadget não pode ser retirado dos templates do designer do modelo para respeitar os direitos autorais de quem criou o tema. Entretanto, quando um blog está usando um desses modelos e o autor decide trocar o template por modelos personalizados, o gadget attribution é tranferido com os demais gadgets os novo template e, como não tem a opção “excluir”, ele fica “grudado” no blog.

Ainda bem que para tudo existe uma solução :) Para retirar o gadget attribution, basta instalar o Template Mínima, ir em elementos de página e excluir o gadget.

Caso você não saiba como instalar o Template Mínima, acesse este post:

• Como voltar a usar os antigos templates do Blogger

E para conhecer todos os tipos de templates para o Blogger, acesse:

• Opções de templates para Blogger

Repito: o gadget attribution NÃO PODE ser retirado dos templates do Designer do Modelo, somente dos templates que são personalizados por nós usuários.

Mundo Blogger – um metablog que veio pra ficar!

Nestes três anos à frente do Dicas Blogger, já vi muito blog nascer, crescer, fazer sucesso ou estagnar, procrastinar e até mesmo morrer.
Quando comecei, eram poucos os blogs nacionais que traziam novidades para a plataforma Blogger; tanto que até consigo citar um por um: Templates Novo Blogger, Templates para Você, Códigos Blog, Usuário Compulsivo, Blosque e Dicas para Blogs.
Para nossa alegria, estão todos no ar,  muito bem de saúde e dispensam maiores apresentações. O Templates Novo Blogger (TNB)  é que nos deu um susto recentemente, saindo do ar por um erro dos robôs do Blogger, mas o problema já foi resolvido e ele continua ocupando seu inestimável lugar na Blogsofera.

Como vocês já devem saber, todo blog que ensina a blogar é chamado de metablog e nós que escrevemos sobre o Blogger, somos chamados de metabloggers.

Muito bem. Nestes três anos, também acompanhei o surgimento de muitos metablogs, mas foram poucos que me chamaram a atenção. Infelizmente, a maioria deles não traz nada de novo, apenas replica o conteúdo de seus antecessores.
Eu sou uma pessoa que adora novidades. Se eu não tenho nada de novo pra compartilhar com vocês, prefiro deixar o blog sem atualizações. E se, por um motivo de força maior, eu precisar publicar algo que vi em outro blog, daí eu linko, cito a fonte e ainda agradeço. Acho que é o mínimo que podemos fazer por quem se esforçou tanto para descobrir e compartilhar algo novo, né?

Bom, em meio a tantos metablogs novos, conheci o Mundo Blogger – que até cerca de 20 dias atrás se chamava Mundo Darkness. Confesso que no começo achei o blog meio estranho, com aquele template lindo, porém…… gótico! Aliás, eu nem sabia direito o que era gótico, mas o Google me deu uma forcinha :)
Com o tempo eu percebi que ali estava um blog com grande potencial. A Clau, editora do Mundo Blogger, não se limita a postar tutoriais amarelados. Ela estuda, vai atrás, faz modificações, quebra a cabeça e ainda compartilha. Não é lindo?
Eu tenho aprendido muito por lá. Por isso resolvi fazer este post apresentando o Mundo Blogger pra vocês. O ponto forte do blog são os tutoriais para customizar templates. É HTML e CSS que não acaba mais! Como se diz no Twitter: CORRÃO!
Na página Índice, vocês vão encontrar todos os tutoriais feitos para blogs do Blogger, sistematicamente organizados com títulos e marcadores. Um luxo.
Aproveito para deixar meu agradecimento e um super abraço para a Clau e pra todas as “Meninas Super Poderosas”  Espero não esquecer de nenhuma (ai, a idade…): Ariane, Áurea, JoAngel, Mamanunes, Ro Zancheta e a diva  Nospheratt.
“Meninas Super Poderosas” foi um apelido dado a todas nós pela Ariane em 2007 e que está bem explicado neste post da JoAngel - As Meninas Superpoderosas.

Hack “Leia mais” automático e com imagens

Fui procurar este hack, à pedido de uma cliente do DB-produtos e serviços e encontrei no Templates para você, blog da querida e sumida amiga Áurea.
Trata-se de um hack que resume os posts da página inicial (home) automaticamente e ainda mostra uma pequena imagem (thumbnail) do lado esquerdo da postagem.
Antes de mais nada, recomendo que você instale este hack em um blog de testes ou, se quiser instalar diretamente no blog, faça antes um backup do template.
Como colocar o hack Leia Mais com imagens
Entre no painel do Blogger, clique em design e, depois, em editar HTML.
Marque a caixa expandir modelos de widgets e procure por:

<div class='post-body entry-content'>
<data:post.body/>

Substitua a linha <data:post.body/> por:

<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<div expr:id='"summary" + data:post.id' style='display:none;'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<div style="clear:both" align='right' class='rmlink'><a expr:href='data:post.url'>Leia mais »»</a></div>
</b:if></b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/></b:if>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'><data:post.body/>
</b:if>

ATENÇÃO! Para quem usa os meus templates, que já vêm com um outro hack “leia mais” e/ ou com o jump break do Blogger, o caminho é outro. Procure por:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>#fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>#fullpost{display:none;}</style>
<p><data:post.body/></p>
<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + &quot;#more&quot;'><data:post.jumpText/></a>
</div>
</b:if>
<span id='showlink'>
<a expr:href='data:post.url'>Continue lendo &gt;&gt;</a>
</span>
<script type='text/javascript'>
checkFull(&quot;post-&quot; + &quot;<data:post.id/>&quot;);
</script>
</b:if>
<div style='clear: both;'/> <!-- clear for photos floats -->

Substitua tudo por:

<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<div expr:id='"summary" + data:post.id' style='display:none;'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<div style="clear:both" align='right' class='rmlink'><a expr:href='data:post.url'>Leia mais »»</a></div>
</b:if></b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/></b:if>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'><data:post.body/>
</b:if>
<div style='clear: both;'/> <!-- clear for photos floats -->

Agora vá no CSS do template e antes da tag ]]></b:skin> cole este código:

.rmlink {
font-size: 100%;
float: right;
margin-right: 30px;
margin-top: 10px;
font-weight: bold;}
.rmlink a {
font-style: normal;
font-weight: bold;
font-variant: small-caps;
font-family: Arial,Sans-Serif;
color: #24618e; /*Cor do Link*/}
.rmlink a:visited { color: #649dc7;}/*Cor do link depois de clicado*/
.rmlink a:hover { color: red;} /*Cor do link ao passar o mouse em cima*/

Procure então pela tag </head> e cole este outro código em cima dela:

Fontes de referência

• Templates para Você - Hack Leia Mais com imagens reduzidas
• Mundo Blogger - Hack Leia mais com imagens na página inicial

Escondendo o rodapé dos post na página inicial
Para esconder a data e o rodapé dos posts na página inicial, procure por:

]]></b:skin>

e cole o seguinte código depois dessa tag:

<b:if cond='data:blog.pageType == "index"'>
<style type='text/css'> .post-footer { display: none; } </style>
</b:if>
<b:if cond='data:blog.pageType == "index"'>
<style type='text/css'> h2.date-header { display: none; } </style>
</b:if>

Para entender melhor as condicionais do Blogger, acesse:

• O Blogger e as Condicionais – BloggerSphera
• Aplicar estilos a página inicial do Blogger – Mundo Blogger

Esta última dica funcionou no Template Mínima e nos meus templates, mas talvez não funcione em outros, já que o nome dos seletores ( .post-footer e h2.date-header ), pode variar de um modelo para outro.
Exibindo apenas o texto
Se você quiser mostrar apenas o texto na home e não as imagens, procure por:

<style type="text/css">
.thumbnailimg IMG {
max-width:150px;
width: expression(this.width > 150 ? 150: true);
max-height:120px;
height: expression(this.height > 120 ? 120: true);
}
.thumbnailimg {
float:left;
padding:0px 10px 5px 0px;
}

Substitua todo o trecho acima por este:

<style type="text/css">
.thumbnailimg IMG {
max-width:150px;
width: expression(this.width > 150 ? 150: true);
max-height:120px;
height: expression(this.height > 120 ? 120: true);
display: none:
}
.thumbnailimg {
float:left;
padding:0px 10px 0px 0px;
}

Você sabe o que é um Splog?

Artigo de LUMA ROSA – Luz de Luma, Yes Party | @Luzdeluma

Os meios de comunicação social fazem parte da nossa vida diária e blogar foi uma das primeiras inovações da "Internet Social" e hoje, juntamente com os sites e redes sociais dão existência a Web 2.0 - O paraíso estaria perfeito, se não existissem os phishing scams, spams e lixo eletrônico.
Conforme definiu o SplogReporter - página da internet criada para listar Splogs: "Eles são os terroristas da blogosfera e precisam parar", mas que raios é um Splog?

Spam + Blog = Splogs
Por definição, Splogs são blogs que produzem conteúdo e usam do seu, sem a sua permissão e sem lhe dar crédito ou referência, publicam seus textos com a finalidade de aumentar tráfego e assim obter lucro ao atrair internautas desatentos para links patrocinados ou redirecionando-os para outras páginas, aumentando o pagerank da página de destino.
Os Splogs procuram por blogs bem cotados no google, naturalmente ou aqueles que fazem uso de "truques" para melhorar o posicionamento, como por exemplo, o uso das tais "palavras-chaves". Se o seu blog é chamativo para paraquedistas, também será para Sploggers.
Parece que o feitiço vira contra o blogueiro, se este também usa de muitos artifícios para se posicionar melhor nos sistemas de pesquisas ou usa muitos anúncios dentro blog. Mas você pode fazer uma análise prévia para saber se o seu blog está livre de Splog no SplogSpot e na mesma ferramenta pesquisar se um blog/site é falso. Desconfie se algo estranho acontece no seu blog mesmo que você esteja blogando normalmente, tais como a combinação de ingredientes: problemas de indexação nos motores de busca, diminuição de pagerank, da monetização e audiência. Em resumo, veja se incorreu em penalizações.
Outros prejuízos ao alimentar um Splog
1. A autoria do seu texto que não é reconhecida - configurando o crime de plágio por parte do splogger - para ele, isto pouco importa! Mas e as suas aspirações ao manter um blog?
2. Se você usa o Google Adsense, a ferramenta irá identificar dois textos iguais e selecionará anúncios de baixo rendimento para as páginas, pois é assim que o Adsense trabalha. Textos originais terão anúncios mais valorosos para o Adsense e consequentemente para o seu bolso - Mesmo que não use o Adsense, a originalidade ganha espaço no posicionamento nos sistemas de pesquisas e/ou no pagerank. Produza conteúdo original!
Alguns cuidados para impedir splogs
Um Splog pode aleatoriamente enviar comentários spams para o seu blog e por isso a necessidade de monitoramento constante do sistema de comentários, tanto no sistema livre ou com uso de moderação.
Saiba mais: Blogger implementa anti-spam nos comentários
Quase sempre os splogs usam Javascript. A razão para isto é que ele permite incorporar as instruções que aumentarão as receitas com os possíveis cliques. Um dos atributos de determinados Javascript é a geração de janelas pop-up quando você entra no site e clica em um link ou até mesmo quando sai do blog. Independente do que aciona essas pop-ups, elas são irritantes e mostram quão mal os sploggers trataram os visitantes na internet, se importando apenas em ganhar dinheiro. Monitore o seu blogue no sentido de retirar esses Javascripts. Vejo que alguns blogueiros usam as tais para ganhar cliques, mesmo não sendo splogs, sem dar a possibilidade do visitante de escolha - isto não é legal! Alguns blogueiros possuem a paciência de colocar no início do post uma mensagem padrão alertando os visitantes da presença de Splogs - veja exemplo - Porém existe uma maneira mais prática de proteger o seu feed e já demonstrada aqui no Dicas Blogger:

• Assine seus feeds e irrite os kibadores - não somente os kibadores!

Para os que usam o Wordpress, recomendo os plugins: RSS Signature Smackfoo ou RSS Footer, que fazem a assinatura automática no rodapé do post dentro do feed.
Essa assinatura facilita para os motores de busca a detecção de conteúdo duplicado, distinguindo o conteúdo original da cópia, não prejudicando a indexação e manutenção do seu pagerank.
O Futuro dos Blogs, uma preocupação real
Quando os splogs surgiram, a blogosfera ficou muito mal vista no território web, principalmente as plataformas que ofereciam a feitura de blogs gratuitamente, devido a facilidade de se criar uma página falsa ou Splog. O IceRocket esteve à frente de outros motores de buscas que cogitaram parar com a indexação de blogs para limpar seus resultados. Começou então, a patrulha Splog!
No Blogger foi adicionada na Navbar o botão "Flag", para sinalizar conteúdo duvidoso e os grandes produtores de conteúdo web alavancaram uma campanha muito bacana de denúncia de Splogs, pois enxergaram na atitude dos motores de busca, a desvalorização de uma grande conquista: A Liberdade de expressão criada pelos blogs e retroação no desenvolvimento do pensamento coletivo.
"A propriedade intelectual que está disponível na blogosfera é uma fonte incrível de ideias, fatos e imaginação. Agora é a hora de fazer alguma coisa antes do splog superá-los e dificultá-los. Descobrir novos blogs é emocionante." (Mark Cuban)
Em 2006, 56% da blogosfera de língua inglesa era considerada Splog (dado da Revista Wired - leitura recomendada) e o Blogger sabendo deste crescimento vem tomando suas providências. Recentemente colocou um aviso em sua página inicial de acesso "Atualização: a política de privacidade foi simplificada e atualizada. Saiba mais e dentro desta atualização das políticas de privacidade, você tem acesso a nova versão da Política de Privacidade do Google que entrará em vigor no dia 03 de Outubro de 2010. Não deixe de saber as novas regras!
Independente da política de privacidade, dentro dos Termos de Serviço do Blogger (TOS) são listados itens que configuram violação do uso do serviço, onde é destacada a infração da Lei de Direitos Autorais do Milênio Digital. Se você não deu pelota para este "detalhe" e se for reincidente, o Blogger deletará o seu blog alegando ser ele um Splog (Blog Spam).
Passível, o Blogger ainda lhe dá a oportunidade de recuperar o seu blog. Veja como proceder nesta postagem de Peter Enviroman:

• Recover blog deleted as splog, TOS violation

(em inglês - aproveite e instale o Client for Google Translate)
Ademais, um blogueiro não deve se comportar como um Splog para não ser confundido com um e sempre cite a fonte de suas pesquisas. Caso tenha que citar um texto - JAMAIS copie um texto inteiro. Dê ênfase ao assunto tratado, desenvolvendo o seu ponto de vista e no máximo copie um pequeno trecho da sua fonte de pesquisa. Respeito ao alheio bate e volta!
Neste texto foram utilizadas as novas regras do acordo ortográfico com excessão da palavra anti-spam, por fazer parte do título de um post escrito antes da assinatura do acordo - forma correta atual: antispam - o hífen é usado também para separar vogais (ex.: anti-inflamatório)

Template Style

Este é Template Style, nas cores azul, preto e cinza e com detalhes em degradé e 3D. A maioria das cores podem ser mudadas através do próprio painel do Blogger, bem como a imagem do cabeçalho. Ele é leve, moderno e gratuito.

Demonstração – Download – Licença

RECURSOS INSTALADOS	CARACTERÍSTICAS DO TEMPLATE
Posts Relacionados	Cores e fontes personalizáveis
Retirada da Navbar	Compatível com navegadores atuais
Avatar nos comentários	1 coluna de cada lado
Citação em bloco personalizada	Nome do seu blog nos créditos
Jump Break e Hack Leia Mais	CSS otimizado
Botões de compartilhamento	Cores em degradé
Caixa de busca no cabeçalho	Caixa de busca estilizada
Favicon	Carregamento rápido
Citação em bloco personalizada	Design moderno

Antes de instalar o Template Style em seu blog, leia atentamente este artigo:

• Instruções para uso dos templates do Dicas Blogger

Agora leia as instruções específicas para o Template Style:
1. Alterando a imagem de exibição do cabeçalho
Na pasta do template, você encontrará uma imagem em formato .png. Entre em elementos de página e clique em cabeçalho>editar. Faça o upload da imagem e escolha a opção “por trás do título e descrição”
Se você quiser criar a sua própria imagem, escolha o tamanho 920 x 150 px e cor de fundo #333 e salve-a no fomato .PNG.
2. Fontes e Cores
A maioria das fontes e das cores podem ser alteradas pelo painel do Blogger, exceto o background, a linkbar e os títulos da sidebar.
3. Retirando a caixa de busca
Entre no HTML do template, procure pelo trecho abaixo e apague-o:

<div id='search'>
<form expr:action='data:blog.homepageurl + &quot;search&quot;' id='searchform' method='get' name='searchform'>
<input class='keyword' id='s' name='q' type='text' value=''/>
<input src='http://lh3.ggpht.com/_mcq01yDJ2uY/TIoN4zHVJmI/AAAAAAAADi0/-lPcOV2086M/search.gif' style='border:0; vertical-align: top;' type='image'/>
</form>
</div>

O template é gratuito e está pronto para uso. Caso você queira realizar mudanças na estrutura dele ou instalar novos recursos, pesquise como fazer.
Depois que você instalar este template em seu blog, volte aqui e deixe o link dele nos comentários para que eu possa ver como ficou ;)
©Template by Dicas Blogger – alguns direitos reservados. Não retire os créditos.

Em breve, nova interface do Twitter

Foi anunciada hoje, em uma conferência de imprensa realizada na sede do Twitter, a nova interface da página twitter.com. No novo Twitter, teremos integração de vídeo e imagens, em uma interface mais bonita, limpa e agradável.
Confiram as novidades, acessando este link - Meet the new Twitter.com


Fontes: @RicardoFraga e @willianmax
Imagens: twitter.com

Conheça a Hepatite C

Você já deve ter ouvido falar em Hepatite C, mas talvez ignore o fato de que a doença, geralmente, não apresenta sintomas em sua fase inicial e que por isso milhares de pessoas estão infectadas sem saber.
Segundo dados do Ministério da Saúde, existem cerca de 170 milhões de pessoas infectadas no mundo; no Brasil, a incidência da hepatite C em doadores de sangue é de cerca de 1,2% e a doença é responsável pela maioria dos transplantes de fígado.

Concurso Cultural Hepatite C, Sem Medo
A nossa leitora Ana Barcellos - autora do blog Animando-C - está lançando o Concurso cultural "Hepatite C, Sem Medo" onde ela vai premiar com um iPad o melhor post sobre a Hepatite C. Além do prêmio ser sensacional, a iniciativa da Ana é de grande utilidade pública, já que a Hepatite C é uma doença grave e que merece atenção.
Aqui está a minha contribuição, em forma de perguntas e respostas.
O que é Hepatite C?
É uma inflamação do fígado causada pelo vírus HCV – cujo hospedeiro é o ser humano. Essa inflamação acontece na maioria das pessoas contaminadas com o vírus da hepatite C e pode levar à cirrose e ao câncer do fígado.
Como se pega Hepatite C?
A transmissão ocorre por via parenteral, ou seja, através de sangue contaminado.

Quais são as formas mais comuns de transmissão do vírus da Hepatite C?
1-transfusão de sangue ou derivados, especialmente ocorridas antes de 1993 (a partir da década de 90, instituiu-se diversos testes para doadores de sangue.)
2-exposição a materiais pérfuro-cortantes sem esterilização adequada:

• equipamentos para fazer tatuagens e piercings
• seringas e agulhas para uso de drogas injetáveis
• equipamentos de dentista
• objetos de manicure, barbeiros e cabeleireiros
• material de uso pessoal, tais como barbeadores e escova de dentes

3-uso de drogas inaladas, como a cocaína ou pipadas, como o crack
4-relação sexual sem camisinha (incidência menor que 1%)
A transmissão perinatal ou vertical ( mãe – bebê) é possível de acontecer e ocorre no momento do parto. A incidência gira em torno dos 5%.
Qual o período de incubação?
De 15 a 150 dias (em média 50 dias)
E qual é o período de transmissão?
Enquanto o virus for detectável
Como posso saber se tenho o vírus da Hepatite C?
Através de um teste de sorologia anti-HCV. O teste é realizado em doações de sangue ou mediante solicitação de um médico, tanto da rede pública quanto particular e convênios.
Quais os sintomas da Hepatite C?
Em 90 % dos casos, a doença é assintomática.
E quais as suas consequências?
A tendência da hepetite C é tornar-se crônica e ir causando diversos danos ao fígado, incluindo cirrose hepática e câncer.
A Hepatite C tem tratamento?
Sim, mas apenas para os casos mais graves.
A Hepatite C tem cura?
15 a 30% das pessoas infectadas apresentam cura espontânea, enquanto 70 a 85% ficam com hepatite crônica
Como me prevenir?
Além de evitar o contato com sangue contaminado, faça o teste da Hepatite C. Quanto mais cedo a doença for detectada, menores serão suas consequências.
Quer saber mais sobre Hepatite C? Assista aos vídeos do canal Animando-C
Referências Bibliográficas:

• Hepatites Virais – O Brasil está atento/Ministério da Saúde – 3.ed. – Brasília, 2008
• Doenças infecciosas e parasitárias: guia de bolso – 8.ed.rev. – Brasília, 2010
• Hepcentro – Hepatologia Médica: ciência e ética (site)

Template Business

Apresento-lhes o Template Business. Trata-se de um tema moderno e arrojado, com diversos recursos instalados, fontes e cores personalizáveis e compatível com as últimas versões dos principais navegadores – Internet Explorer, Chrome e Firefox.

Demonstração – Download – Licença

RECURSOS INSTALADOS Posts Relacionados Retirada da Navbar Jump break e hack leia mais Favicon Avatar nos comentários Citação em bloco personalizada Botão para redes sociais ícones de navegação

CARACTERÍSTICAS 1 coluna à direita 3 blocos no rodapé Nome do seu blog nos créditos CSS otimizado caixa de busca estilizada compatível com as últimas versões dos principais navegadores fontes e cores personalizáveis

Modo de Usar – Instruções comuns a todos os templates

Leia atentamente as instruções abaixo antes de instalar este template:

• Instruções para uso dos templates do Dicas Blogger

Instruções Específicas para o Template Business

1.Alterando a imagem de exibição do cabeçalho

Na pasta do template, você encontrará uma imagem em formato .png. Entre em elementos de página e clique em cabeçalho>editar. Faça o upload da imagem e escolha a opção “por trás do título e descrição”

2.Caixa de busca na sidebar

O uso da caixa de busca é opcional. Entre em elementos de página, escolha “adicionar uma gadget”>HTML/Javascript e cole o seguinte código:

<div id='search'>
<form expr:action='data:blog.homepageurl + &quot;search&quot;' id='searchform' method='get' name='searchform'>
<input class="keyword" id="s" name="q" type="text" value="" />
<input src="http://lh3.ggpht.com/_mcq01yDJ2uY/TIoN4zHVJmI/AAAAAAAADi0/-lPcOV2086M/search.gif" style="border:0; vertical-align: top;" type="image" />
</form>

</div>

3.Fontes e Cores

A maioria das fontes e das cores podem ser alteradas pelo painel do Blogger, exceto o background, a linkbar, os créditos e os títulos da sidebar.

O template é gratuito e está pronto para uso. Caso você queira realizar mudanças na estrutura dele ou instalar novos recursos, pesquise como fazer.

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

Widget “assine os feeds”

Uma forma legal de aumentar o número de assinantes de feeds, é oferecendo várias formas de assinatura aos visitantes. Muita gente nem imagina o que seja um feed e muito menos um leitor RSS; então, não custa nada facilitarmos as coisas, né?
Pensando nisto, criei um widget bem simplezinho, usando os próprios recursos do FeedBurner. Apesar de simples, o widget é poderoso, pois reúne três formas de direcionamento para o FeedBurner: caixa de email,  ícone e  contador.

Se você não sabe o que é um Feed e nem o que é FeedBurner, acesse:

• O que são Feeds e para que servem?
• Como usar e configurar o FeedBurner

Nas imagens abaixo, temos um exemplo do widget já instalado no Blogger:
Como configurar e instalar o widget
Copie o código abaixo, cole no gadget HTML/javascript do Blogger e faça as seguintes substituições (preste bastante atenção agora):
Onde estiver escrito SEUBLOG, substitua pela parte final da url do Feed do blog.
Exemplo: http://feeds.feedburner.com/dicasblogger (dicasblogger é a parte final)
Escolha uma imagem com fundo transparente, em formato .PNG e  de 120 x 120 px. Faça o upload da imagem no Picasa e cole a url dela em URL DA IMAGEM.

• Como hospedar imagens no Picasa

Recomendo o site  Findicons para encontrar o ícone dos Feeds.

<table cellpadding="2" cellspacing="2" style="border: 1px solid rgb(236, 236, 236); background:transparent;text-align: left; width: 100%;">
  <tbody><tr><td align="undefined"
valign="undefined"><a
href="http://feeds.feedburner.com/SEUBLOG"><img
alt="RSS" title="Assine os feeds"
src="URL DA IMAGEM"
border="0" height="120" width="120"></a></td><td
align="undefined" valign="undefined"><form
style="padding: 3px; text-align: center;"
action="http://feedburner.google.com/fb/a/mailverify"
method="post" target="popupwindow"
onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=SEUBLOG', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><p>Receba os posts por email:</p><p><input style="width: 140px;"
name="email" type="text"></p><input
value="SEUBLOG" name="uri" type="hidden"><input
name="loc" value="pt_BR" type="hidden"><input
value="Assinar" type="submit"><p>Delivered by <a
href="http://feedburner.google.com/" target="_blank">FeedBurner</a></p></form>
<p align="center"><a
href="http://feeds.feedburner.com/SEUBLOG"><img
src="http://feeds.feedburner.com/%7Efc/SEUBLOG?bg=FF9900&amp;fg=0000000&amp;anim=1&amp;label=leitores"
style="border: 0pt none ;" alt="" height="26"
width="88"></a></p></td></tr></tbody></table><div style="text-align: center;"> Widget by <a  href="http://www.dicasblogger.com.br/2010/09/widget-assine-os-feeds.html”>Dicas Blogger </a> </div>

Se você quiser mudar as cores do contador, altere os números que aparecem em verde e azul, onde bg é o background (plano de fundo do contador) e fg é a cor do texto. Veja aqui uma tabela de correspondência de cores.
Para mudar a cor da borda do widget, substitua os números deste trecho:

border: 1px solid rgb(236, 236, 236);
Exemplo: border: 1px solid rgb(255, 255, 255);

Depois de fazer todas as modificações, clique em SALVAR.
As alterações também podem ser feitas no WordPad do Windows e depois coladas no gadget HTML/javascript do Blogger.
A exibição dos créditos (nome e link do Dicas Blogger), é opcional.
Recomendo que o título do gadget seja algo do tipo “Assine os feeds” :)