Meio Bit » Arquivo » Internet » Dicas para o TwentyTen, tema padrão do WordPress 3.0

Dicas para o TwentyTen, tema padrão do WordPress 3.0

12 anos e meio atrás

Após anos trazendo o bom e velho Kubrick como tema padrão, na versão 3.0 o WordPress mudou. Desde então, TwentyTen é o nome do tema que os criadores de novos blogs na plataforma veem imediatamente após a instalação. Mudança tardia e muito válida, importa dizer.

Com o TwentyTen, a Automattic fez um trabalho moderno e mais adaptado aos dias atuais. O time de temas, encabeçado por Ian Stewart, criador do celebre framework Thematic, conseguiu colocar num único tema o que há de melhor em boas práticas e recursos que o WordPress oferece. O TwentyTen permite, dentre outras coisas, a criação de child themes, traz diversas áreas de widgets e base para personalizações fáceis, como cabeçalho, imagem de fundo e menu, tudo via área administrativa, sem uma linha de código sequer.

Mas, com precisão, quais as sacadas do TwentyTen? É isso que iremos descobrir hoje.

Personalização sem código

Expanda o menu "Aparência", e estando o TwentyTen ativo, opções extras aparecerão sob essa aba. São elas: "Fundo" e "Cabeçalho".

A primeira permite definir o fundo do blog, que pode ser tanto uma cor sólida, quanto uma imagem repetida. Na prática, esse sistema funciona apenas como uma interface para a personalização, simples até, possível via CSS. O que, a propósito, nos leva ao efeito negativo disso tudo: inclusão de CSS no cabeçalho das páginas, algo que vai contra as boas práticas de desenvolvimento Web, mas é o preço a ser pago pela comodidade de configurar isso de forma fácil.

Já em "Cabeçalho", o TwentyTen permite que se defina uma imagem para aparecer no topo do blog. As dimensões são 940x198, mas não se preocupe em redimensioná-la antes do envio. Imagens maiores são levadas a uma interface de recorte, tudo muito simples e fácil.

Recorte de imagem para o cabeçalho.

Recorte de imagem para o cabeçalho.

Cabeçalhos dinâmicos

Um recurso meio obscuro, porém bastante útil presente no TwentyTen é o de cabeçalho dinâmico. A imagem, mostrada acima, pode variar de acordo com o post em exibição, desde que o autor faça o serviço de bastidor que consiste em definir a "Imagem Destacada" na área de publicação.

É uma caixinha que fica, por padrão, na lateral direita da página de publicação. Basta expandi-la, enviar uma imagem e, no rodapé das propriedades dela, clicar no link "Usar como imagem destacada".

Imagem destacada.

Imagem destacada.

Diferentemente do que acontece com o cabeçalho geral, aqui a imagem precisa ser submetida nas dimensões corretas para que a mágica aconteça, a saber, 940x198. Se tudo for feito da maneira certa, no final você terá esse efeito:

Cabeçalho dinâmico no TwentyTen.

Cabeçalho dinâmico no TwentyTen.

(Suas) imagens, aleatórias

E que tal mostrar imagens aleatórias no cabeçalho? É possível, graças a um plugin, o Twent Ten Header Rotator. Ele é daqueles "instale e esqueça", não tem nenhuma configuração, o que pode frustrar alguns já que, com esse comportamento, o que ele faz, a princípio, é rotacionar os cabeçalhos nativos do tema mais o enviado para o usuário. Soa meio estranho, não? Então, vamos editar as imagens que o WordPress oferece, as que surgem na página de configuração:

Mudaremos essas imagens.

Mudaremos essas imagens.

Teremos que mexer com código — uma hora isso aconteceria, não? Abra o arquivo functions.php, presente dentro da pasta do TwentyTen. Desça até a linha 127, que começa com esse comentário: "// Default custom headers packaged with the theme. %s is a placeholder for the theme template directory URI". Ali começam as opções de imagens que são exibidas na página de configuração. Em resumo, basta editar e/ou clonar os blocos, com os dados das suas imagens, previamente submetidas. Então, isso:

'berries' => array(
			'url' => '%s/images/headers/berries.jpg',
			'thumbnail_url' => '%s/images/headers/berries-thumbnail.jpg',
			/* translators: header image description */
			'description' => __( 'Berries', 'twentyten' )
		),

Vira isso:

'leitura' => array(
			'url' => '%s/images/headers/leitura.jpg',
			'thumbnail_url' => '%s/images/headers/leitura-thumbnail.jpg',
			/* translators: header image description */
			'description' => __( 'Leitura', 'twentyten' )
		),

Além de enviar a imagem com tamanho 940x198 para a pasta /images/headers/, é bom criar a miniatura, nas dimensões 230x48. Veja como as opções ficam após um pouco de trabalho:

Imagens do cabeçalho personalizadas.

Imagens do cabeçalho personalizadas.

Em conjunto com o plugin que rotaciona imagens no topo, o efeito é muito positivo.

Templates de posts pré-definidos

Truque bacana, usando categorias. Existem duas categorias que, se criadas, geram templates diferenciados na capa do blog. São elas: asides e gallery.

Asides são posts curtos, para encurtar (rá!) a história. No TwentyTen, posts armazenados nessa categoria aparecem na home sem título e com uma fonte menor. Fica assim:

Aside, na capa do blog.

Aside, na capa do blog.

O mesmo vale para a categoria Gallery, que como o próprio nome denuncia, serve para galerias de imagens. Neste caso, o TwentyTen pega a miniatura da primeira imagem e coloca na capa, junto com a quantidade delas presente no post. Assim:

Galeria, no TwentyTen.

Galeria, no TwentyTen.

Conclusão

O TwentyTen cumpre seu papel, que é o de apresentar as possibilidades do WordPress a novos usuários e instigar a produção de temas mais criativos e dinâmicos. Como se vê diante das dicas dadas neste artigo, há muitos pormenores e recursos diferenciados nele, prova de que o tema padrão não serve simplesmente para ocupar espaço.

Conhece alguma outra dica para o TwentyTen? Compartilhe nos comentários!

Leia mais sobre: , .

relacionados


Comentários