Skip to content
/ blank-theme Public template

Basic template to create custom wordpress themes.

License

Notifications You must be signed in to change notification settings

devnicholas/blank-theme

Repository files navigation

Blank Theme

Um tema base para a criação de temas personalizados no Wordpress

Badge Badge Badge

👀 Requisitos

Em ambiente de produção:

  • PHP 7.4 ou superior
  • Wordpress 5.4 ou superior

Em ambiente de desenvolvimento:

  • Node
  • Docker
  • Yarn

🚀 Instalação

Em ambiente de produção: Baixe o tema no formato .zip e vá até Aparência > Temas no seu painel do WordPress e clique em Adicionar novo. Envie o arquivo .zip que você baixou previamente e o tema estará pronto para ser ativado!

Em ambiente de desenvolvimento: O processo pode ser feito da mesma forma que em produção, porém existe uma maneira mais fácil para trabalhar localmente com esse tema usando o Docker. Ao rodar o comando:

$ docker-compose up

Você irá iniciar uma instalação do wordpress que já terá seu tema pronto para ser ativado e todas as alterações feitas serão refletidas na pasta do tema dentro do container.

🔗 Plugins

A listagem de todos os plugins recomendados está feita em Plugins > Plugins recomendados. O único que é obrigatório é o Advanced Custom Fields, pois as maiores features do tema dependem dele. É possível utilizar o tema sem ele, porém não será possível usar todos os recursos que o tema possui.

🛠️ Tecnologias

O tema utiliza as seguintes tecnologias no seu funcionamento:

📋 Features

Abaixo segue a lista de features presentes nesse tema que visam auxiliar no desenvolvimento ou mantê-lo organizado para futuras manutenções.

📑 Campos customizados

Utilizando recursos do ACF e do ACF Pro, é possível criar campos customizados para cada tipo de post ou páginas específicas, facilitando a criação de um tema personalizado.

Apesar de existir uma interface visual para a criação dos campos do ACF, é indicado que a criação aconteça via PHP. Dessa forma a sincronização entre diferentes ambientes não dependerá do banco de dados e sim dos arquivos.

Para essa criação, o ACF possui uma documentação oficial. Porém o Blank Theme possui uma classe interna chamada AcfBuilder que irá facilitar esse processo, fazendo com que ele seja menos verboso.

Modelo de criação de um novo grupo de campos com um campo do tipo texto:

$acf = new AcfBuilder('test_group', 'Grupo de teste');
$acf->setLocate('post');
$acf->createField('infos', 'Informações');

📑 Tipos customizados

É muito comum, durante o desenvolvimento de um site com Wordpress, a necessidade de criar um novo tipo de post, com categorias e tags próprias . Utilizando recursos do ACF e ACF Pro isso é perfeitamente possível e facilitado pelos helpers do Blank Theme.

Para criar um novo tipo de campo, basta criar uma nova instância da classe CustomTypes. Segue um exemplo de criação:

$type = new CustomTypes('test', 'Teste');
$type->create();

📄 Exibir páginas

Após a criação da página pelo Wordpress, é possível criar o arquivo referente a ela. Para isso basta criar um novo arquivo dentro do diretório resourses/views/pages com o nome {slug}.php, onde o slug irá corresponder ao slug da página criada.

Por exemplo para a página com o slug sobre o arquivo ficaria resourses/views/pages/sobre.php. Para a página fale-conosco ficaria resourses/views/pages/fale-conosco.php.

Na ausência de um arquivo com o slug da página o Wordpress chamará outros arquivos conforme a hierarquia de templates.

📂 Exibir tipos de conteúdos customizados

Para exibir a página interna de um tipo de conteúdo customizado é necessário criar um arquivo dentro do diretório resourses/views/singles com o nome {slug}.php, onde o slug irá corresponder ao slug do tipo de conteúdo.

Por exemplo para o tipo de conteúdo com o slug servicos o arquivo ficaria resourses/views/singles/servicos.php.

Na ausência de um arquivo com o slug do tipo de conteúdo o Wordpress chamará outros arquivos conforme a hierarquia de templates.

Consumir campos customizados

Para ter acesso aos campos customizados que forem criados por você, existe a classe ContentController, que pode ser instanciada passando o ID de um post específico ou ele pegará o do post atualmente ativo.

Uma vez instanciada você tem acesso aos seguintes métodos:

  • get, onde você deve passar a key de um campo para receber o valor dele;
  • getAll, onde você receberá um array com todos os campos relacionados aquele post.

Um exemplo de implementação que utiliza a classe:

$data = new ContentController();
$foo = $data->get('foo');

Nesse exemplo foo é o slug de um campo previamente criado.

💡 Recomendações

  • Mantenha o arquivo functions.php o mais enxuto possível, sempre que possível isole as funcionalidade e não trabalhe com blocos de códigos grandes dentro dele, isso aumenta a complexidade de manutenção. 🔨
  • Crie uma pasta components e reutilize, sempre que possível, seu código. 🤝
  • Ao utilizar o WooCommerce, faça uso dos Hooks, alterar o código fonte do WooCommerce não é uma boa prática pois você pode perder compatibilidade com futuras versões do plugin. Essa é uma lista de todos os hooks que o WooCommerce possui, use-os! 😉
  • Por fim, esse é um template para temas customizados, então tem o objetivo de proporcionar uma rápida resolução de problemas comuns no desenvolvimento de sites utilizando Wordpress. Se você identificou um problema comum que esse tema não resolve ou até uma melhor solução para um problema, sinta-se livre para contribuir! ❤️

🙋‍♂️ Autor


Nicholas Stefano 🔥

Linkedin Badge Gmail Badge

📝 Licença

Este projeto esta sobe a licença MIT.

Feito com ❤️ por Nicholas Stefano 👋🏽 Entre em contato!