Olá amigos! Normalmente, quando adicionamos um arquivo CSS ou Javascript ao nosso site WordPress, nosso primeiro pensamento é fazer isto dentro de nossa tag <head>:
<link rel="stylesheet" href="caminhoparaoarquivo/arquivo.css" type="text/css"> <script src="caminhoparaoarquivo/arquivo.js" type="text/javascript">
Mas você sabia que o WordPress possui funções próprias para adicionar estes arquivos?
O principal benefício de incluir estes arquivos da forma correta é a tranquilidade de saber que você poderá atualizar o seu tema sem se preocupar com os scripts que estavam inseridos nele.
Além disso, fica mais fácil para adicionar, remover e até mesmo decidir em quais páginas determinados estilos e scripts serão utilizados.
function add_estilos_e_scripts() { wp_enqueue_style( 'nomedocss', get_template_directory_uri() . '/css/arquivo.css')} add_action( 'wp_enqueue_scripts', 'add_estilos_e_scripts' );
A função wp_enqueue_style(
) possui cinco parâmetros:
wp_enqueue_style( $handle, $src, $deps, $ver, $media );
function add_estilos_e_scripts() { wp_enqueue_script( 'script', get_template_directory_uri() . '/js/script.js', array ( 'jquery' ), 1.1, true); } add_action( 'wp_enqueue_scripts', 'add_estilos_e_scripts' );
A função wp_enqueue_script() possui cinco parâmetros:
wp_enqueue_script( $handle, $src, $deps, $ver, $in_footer );
Você pode inserir todos os arquivos em uma mesma função no seu arquivo functions.php e dentro dela fazer as devidas verificações. No exemplo a seguir, vamos inserir dois arquivos, sendo que o segundo só será inserido na página inicial do seu blog.
function add_estilos_e_scripts() { wp_enqueue_script( 'script', get_template_directory_uri() . '/js/script.js', array ( 'jquery' ), 1.1, true); if ( is_front_page() ) { wp_enqueue_style( 'slider', get_template_directory_uri() . '/css/slider.css', array(), '1.1', 'all'); } } add_action( 'wp_enqueue_scripts', 'add_estilos_e_scripts' );
Gostaram do artigo? Deixem seus comentários e compartilhe.
Caso você queira se aperfeiçoar em WordPress, aprender a criar temas, plugins ou potencializar seu site neste poderoso CMS, conheça nossos Cursos Online de WordPress. E também, se precisar aumentar seus conhecimentos em desenvolvimento, veja nossos cursos de Desenvolvimento Front-End.
Bons estudos!
Nos últimos anos, testemunhamos uma revolução na forma como os sites são criados, impulsionada pelo…
A animação 3D tem sido uma forma poderosa de contar histórias e criar experiências visuais…
Nos últimos anos, a inteligência artificial (IA) tem revolucionado a forma como criamos e editamos…
Nos últimos anos, a integração da inteligência artificial (IA) na criação de sites tem revolucionado…
Nos últimos anos, a edição de vídeo evoluiu rapidamente com o avanço da tecnologia, e…
A dublagem de filmes desempenha um papel fundamental na indústria cinematográfica, permitindo que obras de…
This website uses cookies.
Ver comentários
https://uploads.disquscdn.com/images/bfe05a864cdcf835baa9d4aee7f8838ba74d42c504a4a277f0c4c80f5b875b92.png Felipe, excelente tutorial. Muito obrigado! Estou com um problema, criei o arquivo functions.php inclui todas as chamadas jquery, ao carregar a página index a função está sendo carregada como print. Não sei o que estou fazendo de errado. Desde de já, agradeço pela disponibilidade.
Resolvido
Obrigado
Olá
Estou criando um site onde terá explicações (texto), imagens estáticas, vídeos, e cálculos.
Na parte de cálculos, preciso criar uma espécie de calculadora onde ela ira mostrar, sobre uma imagem que o usuário escolher de fundo, o resultado.
Estou criando o código do calculo todo em JS, é possível inserir isso sobre um layout do wordpress?
Os vídeos posso postar normalmente através de links para rodar dentro da mesma pagina do wordpress?
Obrigado!
Achei mais prático usar um plugin https://wordpress.org/plugins/insert-headers-and-footers/