Trechos de código no WordPress usando wp_enqueue_script e wp_enqueue_style

Ao desenvolver um site em WordPress, às vezes surge a necessidade de incluir pequenos trechos de CSS ou JavaScript para funcionalidades específicas em páginas individuais. No entanto, é essencial seguir as melhores práticas do WordPress para garantir um código limpo, organizado e otimizado para SEO. Em vez de inserir diretamente os trechos de código no cabeçalho do site, podemos utilizar as funções wp_enqueue_script() e wp_enqueue_style() para incorporar esses recursos de forma adequada. Abaixo, apresento a abordagem:

1. No arquivo header.php, remova o código anterior e adicione o seguinte trecho:

<?php 
// arquivo header.php

// Inclui scripts e estilos registrados com wp_enqueue_script() e wp_enqueue_style()
wp_head();
?>

2. No arquivo da página em questão (por exemplo, page-contato.php), faça o seguinte:

<?php 
// arquivo page-contato.php (como exemplo)

// Função para incluir os scripts específicos da página
function my_custom_scripts() {
    wp_enqueue_script( 'meu-script-da-pagina', get_template_directory_uri() . '/js/script-da-pagina.js', array(), '1.0', true );
}
add_action( 'wp_enqueue_scripts', 'my_custom_scripts' );

// Função para incluir os estilos específicos da página
function my_custom_styles() {
    wp_enqueue_style( 'meu-estilo-da-pagina', get_template_directory_uri() . '/css/estilo-da-pagina.css', array(), '1.0' );
}
add_action( 'wp_enqueue_scripts', 'my_custom_styles' );

// Mostra o cabeçalho do site (header.php)
get_header();
?>

Crie os arquivos script-da-pagina.js e estilo-da-pagina.css nas pastas js e css, respectivamente, dentro do diretório do seu tema WordPress. Coloque o código JavaScript específico da página no arquivo script-da-pagina.js, e estilos específicos da página no arquivo estilo-da-pagina.css.

Essa abordagem utiliza a função wp_enqueue_script() para adicionar scripts ao site, e a função wp_enqueue_style() para adicionar estilos ao site. Essas funções garantem que os recursos sejam carregados corretamente, seguindo a ordem adequada e evitando conflitos com outros scripts e estilos.

Adicionalmente, se o script for extenso e for utilizado em várias páginas, considere criar um arquivo separado para esse script e incluí-lo em todas as páginas que necessitem dele. Essa prática melhora o desempenho e a manutenção do site.

Lembre-se de que seguir as melhores práticas de desenvolvimento, como o uso das funções wp_enqueue_script() e wp_enqueue_style(), não apenas torna o código mais organizado e eficiente, mas também ajuda a evitar problemas futuros e possíveis erros. Dessa forma, você garante que o site seja entregue com qualidade, mesmo dentro do prazo estipulado, sem comprometer o desempenho ou a experiência do usuário.