Muitas pessoas estão construindo seus temas, adicionando seus arquivos javascript e css, diretamente no arquivo header.php. Mas o WordPress existe uma forma indicada, para adicionar esse arquivos. Nesse tutorial, vamos ver como realizar esse procedimento.
Vamos ao arquivo functions.php
Criaremos uma função, para adicionar os arquivos, daremos o nome de add_custom_scripts
function add_custom_scripts(){ }Primeiro, vamos adicionar o arquivo CSS. Para isso, podemos utilizar wp_enqueue_style, agora dentro da função que criamos, vamos configurar o wp_enqueue_style
function add_custom_scripts(){ /** * wp_enqueue_style( $nome_unico, $arquivo, $dependencia, $versao, $media_usada); * $nome_unico => recebe um nome unico * $arquivo => caminho completo até o arquivo css * $dependencia => Informa se para funcionar, ele depende de outro arquivo (opcional) * $versao => versão do estilo (opcional) * $media_usada => A media que será usado, pode ser screen, print. Por padrão é usado all (opcional) */ /** * Nesse caso, vamos só informa nome único, e o caminho do arquivo */ wp_enqueue_style('main-css', get_template_directory() . '/css/main.css'); }Agora vamos adicionar um arquivo javascript, para isso vamos utilizar wp_enqueue_script
function add_custom_scripts(){ /** * wp_enqueue_style( $nome_unico, $arquivo, $dependencia, $versao, $media_usada); * $nome_unico => recebe um nome único * $arquivo => caminho completo até o arquivo css * $dependencia => Informa se para funcionar, ele depende de outro arquivo (opcional) * $versao => versão do estilo (opcional) * $media_usada => A media que será usado, pode ser screen, print. Por padrão é usado all (opcional) */ /** * Nesse caso, vamos só informa nome único, e o caminho do arquivo */ wp_enqueue_style('main-css', get_template_directory() . '/css/main.css'); /** * wp_enqueue_script($nome_script, $arquivo_script, $dependencia, $versao, $adicionar_no_rodape); * $nome_script => nome único atributo ao script * $arquivo_script => caminho completo até o script * $dependencia => Informa se para funcionar, ele depende de outro arquivo (Opcional) * $versao => Versão do script (opcional) * $adicionar_no_rodape => se deseja adicionar no footer , por padrão é falso (opcional) * */ wp_enqueue_script('main-js', get_template_directory() . '/js/main.js', array('jquery'), '1.0', true); }Agora vamos criamos a nossa função, informamos quais arquivos que queremos adicionar, vamos agora adicionar a nossa função ao WordPress
add_action('wp_enqueue_scripts', 'add_custom_scripts');Ficando assim no final:
function add_custom_scripts(){ /** * wp_enqueue_style( $nome_unico, $arquivo, $dependencia, $versao, $media_usada); * $nome_unico => recebe um nome único * $arquivo => caminho completo até o arquivo css * $dependencia => Informa se para funcionar, ele depende de outro arquivo (opcional) * $versao => versão do estilo (opcional) * $media_usada => A media que será usado, pode ser screen, print. Por padrão é usado all (opcional) */ /** * Nesse caso, vamos só informa nome único, e o caminho do arquivo */ wp_enqueue_style('main-css', get_template_directory() . '/css/main.css'); /** * wp_enqueue_script($nome_script, $arquivo_script, $dependencia, $versao, $adicionar_no_rodape); * $nome_script => nome único atributo ao script * $arquivo_script => caminho completo até o script * $dependencia => Informa se para funcionar, ele depende de outro arquivo (Opcional) * $versao => Versão do script (opcional) * $adicionar_no_rodape => se deseja adicionar no footer , por padrão é falso (opcional) * */ wp_enqueue_script('main-js', get_template_directory() . '/js/main.js', array('jquery'), '1.0', true); } add_action('wp_enqueue_scripts', 'add_custom_scripts');Espero que tenha ajudado, e até a próxima.
Boa tarde.
Como faço para utilizar o java script nativo do WordPress ?
Quero utilizar esse script em uma página do WordPress: https://www.davidchc.com.br/video-aula/php/criando-combo-dinamico-com-jquery-e-php/
Obrigado.
Muito obrigado! ajudou demais.