WordPress Extremo: Arquitetura e Engenharia de Plugins
Fala, pessoal! 👋
Aqui é o Asllan Maciel novamente — e hoje a parada é Settings Page com estilo e organização!
Sabe aquele plugin cheio de add_options_page, campos soltos e sem padrão? Pois é, a gente não faz mais assim.
Neste ponto da nossa jornada, você já criou estrutura em camadas, repositórios, injeção de dependência, logger, WP-CLI… agora chegou a hora de dar ao seu plugin uma interface de configuração decente, modular, com campos reutilizáveis, e fácil de manter.
Bora profissionalizar essa parte também? 🚀
⚙️ Por que criar uma Settings Page do jeito certo?
- ✅ Centraliza as configurações do plugin em um lugar intuitivo
- ✅ Facilita manutenção e evolução da interface
- ✅ Evita duplicação de código (renderização de campos)
- ✅ Integra com nossa arquitetura de serviços e helpers
- ✅ Dá uma boa primeira impressão para quem instala seu plugin
🛠️ Etapa 1 – Criando uma classe SettingsPage
Vamos colocar dentro de src/Admin/SettingsPage.php:
<?php
namespace WpArquiteturaExtrema\Admin;
class SettingsPage
{
public function register()
{
add_action('admin_menu', [$this, 'add_menu']);
add_action('admin_init', [$this, 'register_settings']);
}
public function add_menu()
{
add_options_page(
'Configurações WP24H',
'WP24H Plugin',
'manage_options',
'wp24h-settings',
[$this, 'render_page']
);
}
public function register_settings()
{
register_setting('wp24h_settings_group', 'wp24h_api_key');
add_settings_section(
'wp24h_main_section',
'Credenciais de Acesso',
null,
'wp24h-settings'
);
add_settings_field(
'wp24h_api_key',
'API Key',
[$this, 'render_field_api_key'],
'wp24h-settings',
'wp24h_main_section'
);
}
public function render_field_api_key()
{
$value = esc_attr(get_option('wp24h_api_key'));
echo "<input type='text' name='wp24h_api_key' value='$value' class='regular-text'>";
}
public function render_page()
{
?>
<div class="wrap">
<h1>Configurações do WP24H Plugin</h1>
<form method="post" action="options.php">
<?php
settings_fields('wp24h_settings_group');
do_settings_sections('wp24h-settings');
submit_button();
?>
</form>
</div>
<?php
}
}🧬 Etapa 2 – Registrando no nosso Init
Abra seu Init.php e adicione:
use WpArquiteturaExtrema\Admin\SettingsPage;
public function register()
{
add_action('init', [$this, 'init_plugin']);
add_action('init', [$this, 'register_blocks']);
if (is_admin()) {
(new SettingsPage())->register();
}
}🧪 Etapa 3 – Teste tudo e valide
- Ative o plugin
- Vá em Configurações > WP24H Plugin
- Salve sua API Key fictícia
- Use
get_option('wp24h_api_key')em qualquer lugar para usar a config
✨ Extras que você pode implementar depois:
- Organização em abas (com tabs em jQuery)
- Sanitização avançada dos campos
- Uso de helpers para renderizar múltiplos campos com estrutura DRY
- Compatibilidade com REST para manipulação externa
💡 Conclusão
Plugins WordPress profissionais têm painéis de configuração profissionais.
Ao separar a lógica em uma classe dedicada, você ganha clareza, organização e facilita demais a manutenção. Nada de admin_menu perdido no arquivo principal.
Me conta o que achou nos comentários!
