Dicas para melhorar seu blog do WordPress.com

O WordPress.com tem fama de ser limitado, e de fato é. Afinal, não dá para instalar plugins, nem mexer nos temas disponíveis, muito menos fazer hacks no sistema. Só que, apesar dessa casca grossa sob a qual os blogs lá hospedados estão, existem dicas simples e eficázes, todas com o aval da administração do serviço, que podem ser usadas para melhorar a experiência do leitor.

Já brinquei uma vez no WordPress.com, logo que o serviço foi lançado, e apenas por curiosidade. Por isso, quem dá as dicas, hoje, é o Raul, jovem talento que faz miséria com seu blog em se tratando de personalização. É mais arrumado e personalizado que muitos blogs com domínio próprio, que usam o WordPress “de verdade”.

O mais legal é que o Raul não fica só na personalização; ele ajuda outros bloggers do WordPress.com a melhorarem os seus espaços. A mais recente e valiosa contribuição dele para com a comunidade é esta página, contendo dezesseis dicas interessantes e incomuns para o WordPress.com. Vale a leitura, o bookmark, imprimir e guardar…

Como instalar o Gears e usar o WordPress Turbo

Uma das grandes novidades do novíssimo WordPress 2.6 é a opção Turbo. Através dela, o WordPress integra-se com o Gears, projeto da Google que traz para o PC local informações guardadas na Internet. No nosso caso, o Gears atua como um cache local do painel administrativo do WordPress (imagens, arquivos e scripts), agilizando o carregamento de páginas de edição e gerenciamento.

Ativar o Turbo é um procedimento simples, mas por tratar-se de algo novo, é bom ter um tutorial detalhado à mão, que não por acaso, é este que você está lendo :-) . Vamos ao modus operandi?

Primeiramente, clique no link Turbo, no canto superior direito da página de administração do WordPress. Uma janela popup aparecerá no meio da tela, a qual diz que o Gears não está instalado, e pergunta se deseja fazer isso (a instalação) neste momento.

Instalando o Gears.

Clique em Install Now, e você será levado ao site oficial do Gears. Clique no botão Install Gears, na tela seguinte marque a caixa de seleção e clique em Agree and Download, espere o download do arquivo GoogleGearsSetup.exe terminar, e então execute-o.

Ao término da instalação, a tela abaixo aparece. Clicando no botão Restart Browser Now, o navegador será fechado e reaberto.

Final da instalação do Gears.

Em tese, devem voltar todas as páginas abertas anteriormente, mas há casos em que isso não funciona. Assim sendo, volte ao painel administrativo do seu blog.

Clique novamente no link Turbo, e agora a tela popup surgirá com uma mensagem diferente:

Comece a instalação do Gears.

Desta vez, clique no botão Enable Gears. Um aviso de segurança surgirá; marque a opção I trust this site. Allow it to use Google Gears., e em seguida, clique no botão Allow e a cópia dos arquivos, imagens e scripts começará. Espere-a terminar:

Instalação em progresso.

Quando acabar, clique no botão Close, e pronto! :D .

Para testar o poder do Gears/Turbo, faça logoff, feche o navegador, e abra-o novamente. Faça login, e navegue nas áreas do painel administrativo, especialmente na área de postagem. A diferença é notável.

Tutorial sobre como converter um layout PSD em HTML

O blog NetTuts escreveu um excelente tutorial explicando passo-a-passo como converter um layout criado no Photoshop em um site HMTL/CSS. Apesar de escrito em inglês, os leitores não terão muita dificuldade de compreensão em virtude da utilização de muitas imagens. O autor ainda disponibilizou para download todos os arquivos utilizados no tutorial.

Abaixo você pode ver o layout utilizado no tutorial.

Tutorial para converter PSD em HTML

Vale a pena salvar no Del.icio.us! :)

Painel administrativo do WordPress em português do Brasil

O WordPress é muito amigável e fácil de usar. Mesmo em inglês, a maioria não sente dificuldade em destrinchar seus recursos, e se vira bem no idioma do Tio Sam – mesmo sem conhecê-lo direito. Mas, do outro lado da moeda, o uso do inglês no painel administrativo do WordPress intimida e até assusta muita gente. Felizmente, é possível traduzir o painel administrativo do sistema para o nosso português (ou qualquer outro idioma suportado). Este texto é um mini-tutorial de como fazer isso, baseado no texto original da Codex.

A primeira coisa é baixar o arquivo de tradução. Na Codex, existem algumas opções, incluindo a oficial. O problema é que ela está desatualizada, já que é para a versão 2.1.3… A mais recente é a do site WebMais, a qual pode ser baixada neste link. Mesmo sendo para a versão 2.3.2, ela funciona perfeitamente na atual (2.3.3).

Descompacte o arquivo pt_BR.mo em qualquer lugar, e acesse o servidor via cliente FTP (recomendo o FileZilla para tal tarefa). Estando lá, acesse a pasta /wp-include/, e dentro dela crie uma nova pasta, chamada /languages. Envie o arquivo pt_BR.mo para a pasta recém-criada. A primeira parte está finalizada.

Na raiz do WordPress, baixe o arquivo wp-config.php. Ele é responsável pelo acesso ao banco de dados, e por isso deve ser manipulado com muito cuidado! Localize a linha 16, esta aqui:

define ('WPLANG', '');

Acrescente, entre as últimas aspas simples, o código pt_BR. Deve ficar assim:

define ('WPLANG', 'pt_BR');

Salve, e envie novamente para o servidor, substituindo o que lá se encontra.

Pronto! Se tudo deu certo, o painel administrativo do seu WordPress estará em português do Brasil, como o meu:

WordPress em português do Brasil.

Se por qualquer motivo aparecerem erros, simplesmente edite o arquivo wp-config.php, voltando-o às configurações originais – ou seja, sem o “pt_BR” na linha 16. Mas as chances disso ocorrer são mínimas, afinal, como deu para perceber, o passo-a-passo é simples e sem pegadinhas.

Espero que o tutorial lhes seja útil, e até a próxima!

Como criar um tema para o WordPress – parte V

Tema Mighty Bom pessoal, estamos chegando a última parte deste tutorial e conforme prometido anteriormente, vou disponibilizar para download o tema que elaboramos durante todo este tempo. Para quem está chegando agora, é bom dar uma olhada nos posts anteriores deste tutorial, parte I, parte II, parte III e parte IV.

Antes de disponibilizar o tema, gostaria de esclarecer para quem acompanhou todo o tutorial, que fiz algumas modificações nos templates e adicionei mais alguns arquivos ao nosso tema, para que o mesmo ficasse completíssimo.

Os arquivos adicionados foram:

  • single.php – arquivo cuja função é exibir um único post. A única diferença para o index.php é a inserção da tag comments_template(), que insere o arquivo comments.php;
  • comments.php – tem a função de exibir os comentários e o formulário para comentar no arquivo single.php;
  • functions.php – torna o tema compatível com widgets.

Tenho certeza que, quem leu todas as partes do tutorial não terá dificuldades em entender os acréscimos que foram feitos. De qualquer maneira se alguém tiver alguma dúvida basta perguntar. Críticas, sugestões e opiniões são muito bem-vindos.

Espero que este tutorial tenha ajudado vocês a elaborar seus próprios temas, pois esse foi meu principal objetivo ao escrevê-lo. Quem quiser informações mais detalhadas sobre como elaborar um tema pode acessar o WordPress Codex.

  • Download do Tema Mighty – 2 colunas, XHTML/CSS válido, compatível com widget e totalmente em português.

[download]

Como criar um tema para o WordPress – parte IV

Na etapa de hoje, falaremos sobre o rodapé do nosso tema e como sempre, recomendo a todos que estão chegando agora a leitura dos posts anteriores deste tutorial, parte I, parte II e parte III.
Na imagem abaixo, como vocês podem ver, está o rodapé do nosso template.
Template Mighty - Rodapé
Neste template o rodapé é extremamente simples, mas há temas para o WordPress que adicionam vários recursos, como é o caso do tema Dark (excelente por sinal).
Voltando ao nosso template, vamos dar uma olhada no código fonte.

<div id="footer">
<ul>
<li id="copyright" >&amp;copy; 2007 Mighty</li>
<li id="links" >
<ul>
<li><a href="http://validator.w3.org/check/referer">XHTML</a> |</li>
<li><a href="http://jigsaw.w3.org/css-validator/check/referer" >CSS</a> |</li>
<li><a href="http://www.kulor.com/?ref=mighty_template">Design by Kulor</a></li>
</ul>
</li>
</ul>
</div>
</body>
</html>

Como de praxe, agora vamos ver o código com as tags do WordPress, que deverá ser inserido no arquivo footer.php.

<div id="footer">
<ul>
<li id="copyright">&amp;copy; 2007 <?php bloginfo('name'); ?> |</li>
<li>Powered by <a href="http://wordpress.org/">WordPress</a> |</li>
<li><a href="<?php bloginfo('rss2_url'); ?>">RSS</a></li>
<li id="links">
<ul>
<li><a href="http://validator.w3.org/check/referer" >XHTML</a> |</li>
<li><a href="http://jigsaw.w3.org/css-validator/check/referer" >CSS</a> |</li>
<li><a href="http://www.kulor.com/?ref=mighty_template" >Design by Kulor</a></li>
</ul>
</li>
</ul>
</div>
<?php wp_footer(); ?>
</body>
</html>

Como vocês puderam observar, de fato nosso rodapé é muito simples e apenas algumas tags foram inseridas. Vamos explicá-las:

  • bloginfo(’name’) – nome do blog;
  • bloginfo(’rss2_url’) – link para o feed RSS;
  • wp_footer() – é uma tag especial que permite certos plugins inserir códigos no rodapé de seu tema. Quando esta tag não é inserida vários plugins deixam de funcionar, então não esqueça de colocá-la em todos os seus temas.

Terminamos assim mais uma etapa de nosso tutorial e para a próxima, e última parte, teremos o tema completo para download e as considerações finais. Até a próxima.