Como adaptar um template WordPress

Antes de começar a falar de plugins para WordPress, vou falar um pouco sobre como alterar um template para seu blog WordPress.

Há alguns dias falei sobre como escolher um bom template para seu blog , nesse artigo tem alguns sites nos quais você pode baixar templates prontos para seu blog. Mas, depois de baixar, como faço para adaptar esse template às minhas necessidades?

É sobre esse assunto que vou falar hoje, alguns itens importantes que você deve levar em consideração ao trocar o template do seu blog.

Alterar imagens

Acho que a primeira coisa a ser feita em um template é alterar as imagens, por exemplo, você encontrou um template super legal só que com uma imagem no topo que você não gostou muito, ou não combina com o assunto do seu blog, quando isso acontece, você pode trocar a imagem, veja a imagem abaixo como exemplo, era de um template que eu baixei, porém não combinava com o que eu queria:

Como a imagem é simples, ou seja, é um retângulo, qualquer outra imagem do mesmo tamanho que fosse colocada serviria, troquei então por essa imagem, ao meu ver muito mais agradável:

Como o template escolhido tinha basicamente uma só imagem, foi necessário trocar apenas essa, porém se no seu tema existirem outras, provavelmente você terá que trocar todas elas. O importante é manter o mesmo tamanho das imagens originais, assim não terá que mexer em tamanhos no CSS.

Modificar CSS

Depois que trocar as imagens, você verá que as cores dos textos, links e cabeçalhos não estarão mais combinando com a imagem nova, a não ser que você tenha mantido o mesmo padrão de cores da imagem antiga ou colocado uma imagem muito parecida com a anterior.

Para alterar isso é preciso alterar o arquivo CSS, que é um arquivo que guarda todas as configurações de cores, tamanhos e posições de seu blog. Normalmente o arquivo se chama style.css, e fica junto com os outros arquivos do seu template.

No arquivo é necessário que você altere a cor antiga em todos os lugares que ela aparece, por exemplo, se no arquivo está escrito a cor #333333, você pode simplesmente procurar por essa cor dentro do arquivo e mandar substituir pela cor nova. Mas como vou saber qual cor colocar? Bom, existem várias maneiras de fazer isso, eu faço assim: no Fireworks colo um printscreen da tela do blog, depois desenho uma figura e pinto com a cor do texto que quero mudar (para fazer isso basta selecionar a figura, clicar no baldinho que serve para selecionar a cor do preenchimento e quando abrir as opções de cores, ir com o mouse em cima do texto da tela que você deu o printscreen, assim você seleciona a cor que está lá), depois você pode selecionar outra cor de sua preferência, abrir seu arquivo CSS, procurar a cor antiga e substituir a nova.

As alterações do CSS demoram um pouco para ficarem 100%. Tem que testar diversas combinações até que fique de seu agrado, sempre testando, testando e testando de novo.

Outro ponto importante é: não teste seu novo template somente em um navegador. O ideal é você testar no Firefox, Chrome ou qualquer outro menos o Internet Explorer, pois todos, menos esse, seguem o mesmo padrão, pode ter certeza que você vai testar em todos os navegadores e vai tudo funcionar perfeitamente, porém quando for testar no IE, vai dar problema, isso é normal, porém ninguém merece. Eu já aboli o IE da minha máquina há algum tempo, porém a grande maioria dos usuários infelizmente ainda usam essa “coisa”, fazer o que… temos que fazer nosso tema funcionar em todos, por isso existem “hacks para IE” em CSS, se alguém tiver interesse, o site do Maujor é especializado em CSS, muito bom, ou se tiver alguma dúvida pode me perguntar também.

Veja nas figuras acima como era e como ficou a alteração das cores do tema do blog, eu troquei as cores para que combinassem com a nova imagem, escurecendo um pouco todo o template.

Escolher Widgets

Depois da parte visual do seu tema já estar pronta, é importante que você escolha os widgtes que quer usar, ou seja, os componentes de navegação e utilidade que você quer disponibilizar no seu blog. Eu aconselho você colocar os widgets de sua preferência na sidebar, direto no código php, para que fique tudo padrão, pois em alguns templates você não consegue incluir um widget pelo admin do Wordpress sem que ele sobrescreva todos os outros widgets que você já tinha inserido direto no código.

Para fazer isso é necessário editar o arquivo sidebar.php e incluir os widgets escolhidos.

Aqui vai uma lista dos widgets mais comuns e que já estão instalados no Wordpress e seus códigos:

• Widget Últimos artigos: <?php get_archives(‘postbypost’, 10); ?> (onde 10 é o número de artigos que quer mostrar)
• Widget Categorias: <?php wp_list_cats(’sort_column=name’); ?>
• Widget Arquivos: <?php wp_get_archives(‘type=monthly’); ?>
• Widget BlogRoll: <?php get_links_list(); ?>
• Widget Comentários Recentes: <?php get_recent_comments(); ?>
• Widget Calendário: <?php get_calendar() ?>

Teste vários widgets, para isso basta acrescentar os códigos acima dentro do arquivo sidebar.php e veja o que se enquadra melhor para seu blog.

Os widgets de Artigos Populares e Top Comentadores você pode ver no artigo Dois Widgets para WordPress.

Como o artigo se extendeu um pouco além do esperado, vou deixar para o próximo os itens que faltaram, que são Feeds,  Locais para Publicidade e Google Analytics.

Caso tenha alguma dúvida ou sugestão, não deixe de postar um comentário!

Um abraço e até breve!