• Nenhum resultado encontrado

style.css, home.php, single.php

Primeiro verifica o tema filho, depois recorre ao tema de modelo e outros arquivos de modelo que você queira alterar

altera apenas as partes que precisam de mudanças

Figura 5-1: O Conceito de Tema fi lho

Este é o style.css básico para basicamente qualquer tema:

/*

Theme Name: O nome do seu tema

Theme URI: http://a-página-inicial-do-seu-tema.com

Description: Aqui você deve colocar uma linda descrição do seu tema! Author: Seu nome

Author URI: http://seu-website.com

Template: Caso se trate de um tema fi lho, você deve confi gurar o nome da pasta do tema pai aqui, caso contrário, remova o campo

Version: Um número de versão .

Quaisquer informações gerais, licenças, plug-ins requeridos, ou outras informações que você queira compartilhar.

. */

Você precisa da linha Template se quiser que a folha de estilo declare que trata-se de um tema fi lho, caso contrário simplesmente deixe essa linha de fora. No entanto, não escreva o nome do tema pai no header do style.css do tema fi lho; ao invés disso, escreva o nome da pasta onde o tema pai está armazenado. Aqui está, novamente, o arquivo style.css, preenchido com o conteúdo simulado do tema hipotético Small Notes, um tema fi lho do Notes Blog:

/*

Theme Name: Small Notes

Theme URI: http://notesblog.com/blog/small-notes/

Description: Este é o Small Notes, um tema fi lho para Notes Blog. Author: Thord Daniel Hedengren

Author URI: http://tdh.me Template: notes-blog Version: 1.0

.

Você precisa ter tanto o Small Notes quanto o Notes Blog em sua pasta wp-content/ themes para que este tema funcione.

. */

O tema padrão do WordPress está localizado em wp-content/themes/default, por isso use esse modelo para seu tema fi lho, escrevendo default na linha Template.

Lembre-se de que este é o arquivo style.css do tema fi lho. Você pode ativá-lo como um tema normal a partir da página Appearance, no admin do WordPress.

Agora que você já tem a folha de estilos para o tema fi lho Small Notes, pode alterar aquelas fontes e cores. Primeiramente, você precisa decidir se irá substituir totalmente o arquivo style.css do tema pai (neste caso, Notes Blog), ou se trabalhará sobre ele. Para este exemplo, trabalharemos sobre o arquivo style.css do Notes Blog, por isso você vai precisar importar a folha de estilo do Notes Blog. Para fazer isso, use a tag @import:

@import url(“../notes-blog/style.css");

Acrescente essa linha abaixo das informações no header do tema, e acrescente as alterações desejadas abaixo dela. Altere algumas cores e fontes, só pela diversão.

@import url(“../notes-blog/style.css");

div#content { font-family: Georgia, Times New Roman, serif; } ul.sidebar ( color: #444; }

Nada demais até aqui, apenas a confi guração de família de fontes começando com Georgia em tudo o que estiver dentro de div com id="content", e a cor da fonte na tag ul.sidebar será cinza escuro. Isso será lido depois que todo o conteúdo da folha de estilo do Notes Blog houver sido lido; por isso você deve inserir @import o mais alto possível no arquivo style.css. Dessa forma, o arquivo style.css completo para o tema fi lho Small Notes, com as alterações mencionadas até aqui, fi caria assim:

/*

Theme Name: Small Notes

Theme URI: http://notesblog.com/blog/small-notes/

Description: Este é o Small Notes, um tema fi lho para Notes Blog. Author: Thord Daniel Hedengren

Author URI: http://tdh.me Template: notes-blog Version: 1.0

.

V ocê precisa ter tanto o Small Notes quanto o Notes Blog em sua pasta wp-content/ themes para que este tema funcione.

. */

@import url(“../notes-blog/style.css");

div#content { font-family: Georgia, Times New Roman, serif; } ul.sidebar ( color: #333; }

Lembra dos modelos de Página que você queria? É fácil criá-los. Basta criar os modelos como faria se fosse modifi car o tema Notes Blog e colocá-los na pasta do tema fi lho Small Notes. Agora, eles podem ser usados sempre que o tema fi lho Small Notes for ativado, exatamente como em um tema comum.

Todos os arquivos no tema fi lho têm uma classifi cação mais alta do que seus equivalentes no tema pai. Isso signifi ca que, ainda que haja um arquivo sidebar.php no tema pai Notes Blog, é o seu arquivo sidebar.php do tema fi lho Small Notes que será carregado. Se você não quiser fazer alterações no arquivo sidebar.php no tema pai, basta não acrescentar esse arquivo ao tema fi lho.

Há apenas uma exceção a essa regra: o arquivo functions.php. O arquivo functions.php do tema pai será carregado mesmo que haja um arquivo functions.php na pasta do tema fi lho, mas caso haja confl ito entre eles, o functions.php do tema fi lho terá prioridade. Isso é bom, porque signifi ca que você pode usar o arquivo functions.php do tema fi lho, que se sobrepõe ao functions.php do tema pai, para alterar qualquer recurso e função do tema pai. Em outras palavras, se você quiser fazer algo levemente diferente em seu tema fi lho, pode substituir certas partes do functions.php do tema pai simplesmente alterando o código que você não quer no arquivo functions.php de seu tema fi lho, mantendo o restante do arquivo functions.php totalmente funcional. A grande vantagem desse processo é que apenas as alterações fi cam em seu tema fi lho, de modo que, quando o tema pai original é atualizado, você pode atualizar seu tema pai também, sabendo que suas alterações estão intactas no tema fi lho. Melhor ainda, seu tema fi lho irá se benefi ciar da atualização do tema pai, sem sofrer alterações.

O MARAVILHOSO MODELO LOOP.PHP

A versão 3.0 do WordPress introduziu o modelo loop.php. Essencialmente, o modelo loop.php permite que você separe o loop dos outros arquivos de modelo, como já mencionamos anteriormente. Isso é muito útil na hora de trabalhar com temas fi lhos, pois permite que você obtenha a localização exata de um loop específi co em seus temas fi lhos, ao invés de substituir completamente um arquivo de modelo.

Digamos que você queira alterar o loop nos arquivos de categoria. O tema pai que selecionou possui um arquivo category.php plenamente funcional, que por sua vez contém um loop chamado loop-category.php, com o seguinte trecho de código que, a essa altura, você já conhece bem:

<?php get_template_part('loop’, 'category’); ?>

Como você já sabe, esse loop buscará primeiramente loop-category.php e, caso não obtenha sucesso, buscará loop.php.

Anteriormente, você precisaria criar um arquivo de modelo category.php totalmente novo para obter o loop usado aqui, mas isso não é mais necessário. Se você quiser alterar o loop de seu tema fi lho, de fato, basta incluir um arquivo de modelo loop-category.php ali. Uma vez que o arquivo do tema fi lho tem prioridade, o arquivo loop-category.php que o modelo category. php de seu tema pai quer incluir será obtido a partir de seu tema fi lho (desde que você tenha incluído um arquivo category.php no tema fi lho, é claro). Em outras palavras, você pode incluir o loop no category.php do tema pai sem precisar incluir um modelo category.php completo em seu tema fi lho; basta incluir o loop. Não é uma maravilha?

No documento Smashing Wordpress - Além Do Blog (páginas 132-135)