-
Notifications
You must be signed in to change notification settings - Fork 0
Construindo uma interface modular
Uma interface modular consiste em um conjunto de módulos de código separados que juntos formam um todo. O mkt-virtual-theme possui diversas funções para facilitar todo esse processo. As principais são get_component e the_component.
Componentes são apenas arquivos PHP. Usando a função the_component, você pode inserí-lo dentro de outros arquivos PHP.
Vamos começar definindo um componente chamado header.php:
<header>
<h1><?php bloginfo('name'); ?></h1>
</header>Usando the_component podemos colocá-lo dentro do nosso template front-page.php:
the_component('header');Isso irá inserir todo o conteúdo do arquivo header.php no arquivo front-page.php. Este arquivo não é apenas copiado. Todo o código dentro dele é executado.
Você também pode passar argumentos para um componente, através de um array. Essa é uma técnica bem poderosa, que permite que você altere componentes para adaptá-los a cada contexto. Estes argumentos estão disponíveis no componente dentro da variável $args. Então, se usássemos the_component('header', array('class' => 'light')), aplicaríamos a classe no header.php dessa forma:
<header class="<?php echo args['class'] ?>">
<h1><?php bloginfo('name'); ?></h1>
</header>Em um site real, uma página possui muito mais informações do que apenas um header. O the_component também pode ser utilizado repetidamente. Um exemplo mais real:
/**
* front-page.php
*/
the_component('components/header');
the_component('components/posts-list');
the_component('components/newsletter-form');
the_component('components/footer');/**
* archive.php
*/
the_component('components/header');
the_component('components/posts-list');
the_component('components/dates-list');
the_component('components/newsletter-form');
the_component('components/footer');Dessa forma temos componentes altamente reutilizáveis, que juntos podem compor uma série de páginas e até outros componentes.
Você deve ter percebido que ocultamos o head e que também não foi necessário usar funções como get_header e get_footer para abrir e fechar o documento HTML que será gerado. Isso aconteceu pois o mkt-virtual-theme conta com um sistema de layouts.
Um sistema de layouts significa que podemos definir uma "casca" que ficará em volta de todos os nossos templates. Cada "casca" é chamada de layout. O layout padrão é o default, mas você pode criar novos dentro da pasta layouts na raiz do tema.
Todos os layouts possuem acesso à variável $args['content'], onde fica armazenado o conteúdo dos templates que deve ser "injetado" no layout. Então, um layout tem uma estrutura parecida com essa:
<!DOCTYPE HTML>
<html>
<head>
<title>Site</title>
</head>
<body>
<?php echo $args['content'] ?>
</body>
</html>Você pode mudar o layout de uma página definindo a variável $layout com o nome do layout desejado. Usando $layout = 'logged_in' em uma página, ela seria carregada dentro do layout layout/logged_in.php.
Essas são só algumas das formas de melhorar o código do seu projeto utilizando os helpers do mkt-virtual-theme. Construindo uma interface modular, você torna seu código mais legível, reutilizável e manutenível.