Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. WordPress

Criando Temas Filhos para Sua Framework Para Temas de WordPress

by
Difficulty:IntermediateLength:MediumLanguages:
This post is part of a series called How Theme Frameworks Actually Work.
Adding Filter Hooks to Your WordPress Theme Framework
Developing Plugins for Your WordPress Theme Framework

Portuguese (Português) translation by Erick Patrick (you can also view the original English article)

A framework para temas que você construiu será usada como um tema pai para os sites que você desenvolver. Isso significa que, em cada caso, você terá que criar um tema filho para criar um site único com seu próprio design e funções extras ou diferentes.

A forma mais óbvia para lidar com isso é cair de cabeça e sair criando arquivos do modelo no seu tema para sobrescrever os da sua framework. Porém, graças aos ganchos de ação e ganchos de filtro que você adicionou à sua framework, isso pode não ser melhor abordagem sempre.

Nesse artigo, apresentarei algumas das técnicas que você pode usar em seus temas filhos para fazer o melhor uso da sua framework e conseguir criar um fluxo de trabalho.

Os tópicos que cobrirei são esses:

  • Criação de temas filhos básicos
  • Alteração de código através dos ganchos de filtro da framework
  • Adição de código através dos ganchos de ação da framework
  • Criação de arquivos de modelo nos temas filhos
  • Descobrir quando usar um plugin ao invés de um tema

Criação de Temas Filhos Básicos

A principal razão em se criar sua própria framework para temas é poder adotar o princípio DRY (Don't Repeat Yourself, "não se repita"), e isso se aplica aos seus temas filhos também.

Isso pode trazer mais eficiência caso crie um ou mais temas filhos 'básicos' para serem usados com sua framework, já contendo o "grosso" do código necessário para iniciar novos projetos.

Ao decidir se seguirá por esse caminho, considere a forma como você trabalha e os sites que você cria:

  • Você cria vários sites para clientes no mesmo setor com necessidades semelhantes?
  • Você quer oferecer um site de baixo custo, baseado em modelos, para clientes menores?
  • Há algum arquivo de modelo que você quase sempre cria em seus novos projetos?
  • Há alguma funcionalidade que você tem de adicionar em alguns sites, mas não em outros? (Por exemplo, uso dois temas filhos básicos, um com comentários e outro sem)
  • Há alguma estilização que costuma usar para a maioria dos projetos ou você pode usar Estilização Orientada a Objetos ou ainda um Pré-processador CSS para a maioria dos projetos?
  • Há alguma biblioteca ou recurso que use para a maioria dos novos projetos?
  • Você tem duas ou três categorias principais a qual pode dividir seus trabalhos, em que cada categoria envolve tipo de trabalho semelhante?

Se você respondeu sim para qualquer uma dessas perguntas, o desenvolvimento de um ou mais temas filhos pode salvar bastante tempo. Você pode criar um conjunto de temas filhos com código básico repetido por todos os projetos que os usam, assim, não precisará reescrever aquele código (ou criar os arquivos) para cada novo projeto.

Um pequeno detalhe: Se você tem adicionado um mesmo trecho de código a cada novo projeto, talvez seja interessante adicioná-lo à sua framework ao invés dos temas filhos, talvez através do uso de ganchos para que possam ser sobrescritos se alguma necessidade diferente aparecer no futuro.

Mesmo que tenha respondido não para as perguntas acima, vale a pena criar um tema inicial básico com folhas de estilo em branco e um arquivo de funções, bem como as instruções que o WordPress precisa para acessar o tema pai da sua framework, lá na folha de estilo:

Os campos obrigatórios são Theme Name e Template, o resto é opcional. Tenha certeza que em Template você tenha usado o diretório do tema da sua framework, não o nome do tema. É interessante completar os outros campos com o conteúdo relevante ao seu tema.

A declaração @import também é importante se quiser carregar a folha de estilo da framework. Enquanto você posicionar essa declaração antes de qualquer outro CSS, ela carregará a folha de estilo do tema pai antes de qualquer estilo da folha de estilo do tema filho. Isso significa que você pode adicionar e/ou sobrescrever qualquer estilização da sua framework no tema filho quando necessário.

Talvez queira criar um arquivo functions.php inicial com as funções que você usa com frequência nos temas filhos. Você pode escolher remover ou adicionar funcionalidades de acordo com as espeficicações do projeto.

Alteração de Código Através dos Ganchos de Filtro

Assim como adicionar estilização ao seu tema filho, é provável que queira realizar mudanças naquilo que códigos de sua framework retorna. A forma mais fácil de fazer isso é através dos ganchos de filtro, assim, é interessante explorá-los antes, para identificar se é possível lançar mão deles.

Criar uma função que você pode anexar a um gancho de filtro é muito mais eficiente que criar um arquivo de modelo inteiramente novo para o novo código. No entanto, se você tem usado, repetidamente, os mesmos ganchos de filtro, é interessante considerar trocar o gancho de filtro por um gancho de ação, e passar a escrever uma nova função para cada novo projeto, ativando através desse novo gancho de ação.

Para maior eficiência, talvez queira criar um conjunto de funções relevantes para colocar no arquivo de funções de vários temas iniciais ou, quem sabe, criar um plugin com sua função, podendo ativá-la quando precisar. Falarei mais sobre plugins em um artigo futuro.

Cobri o processo de criação de filtros em um artigo anterior da série, mas, para recapitular, você anexa uma função a um filtro usando a função add_filter(). Então, por exemplo, para alterar um link e o nome usado no cólofon do meu site, criei duas funções, assim:

Elas são atreladas a dois filtros em minha framework: wptp_colophon_name e wptp_colophon_link, alterando a saída de cada uma delas.

Adição de Código Através dos Ganchos de Ação

Sua framework para temas também terá ganchos de ação que você pode usar para inserir conteúdo em diversos lugares em seu site.

Se você estiver trabalhando com os arquivos dos códigos da framework utilizada nessa série, então você terá sete ganchos de ação:

  • antes do cabeçalho
  • no cabeçalho
  • antes do conteúdo
  • depois do conteúdo
  • na barra lateral (sidebar)
  • no rodapé
  • após o rodapé

Então, por exemplo, digamos que você queira adicionar um botão de ação na barra lateral. Você poderia criar um novo arquivo sidebar.php, mas seria muito mais eficiente apenas usar o gancho wptp_sidebar.

Para isso, crie um arquivo functions.php dentro do seu tema filho e adicione o trecho de código a seguir:

A função wptp_cta() cria o HTML para o botão de ação e a função add_action() a executa através do gancho wptp_sidebar com uma prioridade de 1, assim, ele aparecerá antes de qualquer conteúdo ativado por esse gancho.

Há vários outros conteúdos que talvez queira adicionar usando os ganchos de ação, como botões de compartilhamento nas redes sociais antes e/ou depois do conteúdo; conteúdo extra no rodapé, campo de busca no cabeçalho e muito outros.

Talvez você queria adicionar algum conteúdo apenas a tipos específicos de páginas, como páginas únicas de artigos que, nesse caso, o lugar masi óbvio para começar seria criando um novo arquivo single.php. Mas você ainda pode usar seus ganchos de ação usando tags condicionais:

Isso criaria uma nova consulta (usando a WP_Query) que retornaria uma lista com os artigos masi recentes do blog, numa tentiva de encoraja os visitantes a lerem algo mais, logo após terminarem de ler o artigo da página em questão. A tag condicional is_singular( 'post' ) garante que isso só será retornado para páginas de artigos e, ao anexá-la ao gancho wptp_after_content, você a mostrará após o conteúdo principal do artigo.

Criando Novos Arquivos de Modelos

No caso de não conseguir o resultado esperado criando os ganchos de filtro ou de ação da sua framework, você terá de criar novos arquivos de modelo em sues temas filho.

Eles podem ser os mesmos arquivos criados para a sua framework. Nesse caso, os arquivos criados no tema filho sobrescreverão os do tema pai da framework. Ou eles podem ser novos arquivos de modelos para, por exemplo, uma nova categoria, taxonomia ou tipo de post.

Se você criar arquivos de modelo no seus temas filhos, será mais fácil usar os modelos da framework como ponto de partida. Os passos são os seguintes:

  1. Identifique o arquivo de modelo que precisa ser criado, seguindo a Hierarquia de Modelos do WordPress
  2. Crie um arquivo em branco com o nome apropriado, dentro do diretório do tema filho
  3. Identifique o arquivo da sua framework que é mais parecido com o nome arquivo (novamente, referencie a hierarquia de modelos)
  4. Copie o conteúdo desse arquivo da framework e cole no novo arquivo
  5. Faça alterações ao novo arquivo como necessário.

Fazendo isso, você evita o trabalho de duplicar qualquer código usado por ambos os arquivos, como as chamadas aos arquivos de inclusão.

Descobrir Quando Usar um Plugin ao Invés de um Tema

Outra opção que você tem ao criar sites baseados na sua framework é usa plugins juntos do seus temas filhos. Um plugin não substituirá um tema filho completamente, mas pode ser bem útil em certas circunstâncias:

  • A funcionalidade que você adicionar não será dependente do tema (ou seja, ela permancerá, mesmo que o tema mude no futuro). Isso inclui o registro de posts ou taxonomias customizadas, por exemplo.
  • A funcionalidade deve ser usada em vário outros sites que você criar, mas não é interessante ou importante o suficiente para todas as categorias, o que a tornaria válida dentro do próprio tema filho inicial ou da framework em si.

Cobrirei mais sobre o desenvolvimento de plugins para sua framework no próximo artigo da série.

Conclusão

Sua framework para temas é só o começo da biblioteca de códigos e arquivos que você criará para dar suporte aos sites que você desenvolve. Cada site que criar, precisará usar seu próprio tema filho, que usará o tema da framework como pai.

Como vimos, seus temas filhos adicionará seus próprios estilos e funcionalidades, e poderão fazer isso através dos ganchos de ação e filtro em framework, ou através da criação de um novo arquivo de modelo. Sempre é uma boa ideia adotar a solução que exija a menor quantidade de código, já que isso torna seu site mais rápido e sua vida mais fácil.

Seja o primeiro a saber sobre novas traduções–siga @tutsplus_pt no Twitter!

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.