Dentro de “footer.php”

Mas, esta não é a maneira correta de enfileirar arquivos CSS e JS dentro do seu projeto wordpress. Para encaixar isso, primeiro vá para o arquivo “functions.php” e enfileire os arquivos desta forma. Vamos ver o truque do sigma….

Etapa 1: funções.php

function my_theme_enqueue_styles_scripts() {    // Enqueue CSS files    wp_enqueue_style(\\'bootstrap-css\\', get_template_directory_uri() . \\'/assets/css/bootstrap.min.css\\');    wp_enqueue_style(\\'aos-css\\', \\'https://unpkg.com/[email protected]/dist/aos.css\\');    wp_enqueue_style(\\'custom-css\\', get_template_directory_uri() . \\'/assets/css/custom.css\\');    // Enqueue default Jquery in wordpress.    wp_enqueue_script(\\'jquery\\');    wp_enqueue_script(\\'bootstrap-js\\', get_template_directory_uri() . \\'/assets/js/bootstrap.bundle.min.js\\', array(\\'jquery\\'), null, true);    wp_enqueue_script(\\'font-awesome-js\\', get_template_directory_uri() . \\'/assets/js/font-awesome-all.min.js\\', array(), null, true);    wp_enqueue_script(\\'custom-js\\', get_template_directory_uri() . \\'/assets/js/custom.js\\', array(\\'jquery\\'), null, true);}add_action(\\'wp_enqueue_scripts\\', \\'my_theme_enqueue_styles_scripts\\');

Nota: Wordpress fornece uma versão não compactada do jquery. Portanto, podemos simplesmente usar esse jquery dentro dos arquivos js necessários! Para isso basta passar o parâmetro array('jquery') dentro de “wp_eneueue_script” . Uma coisa a lembrar é que o JQuery possui 2 versões principais: descompactada e compactada. Dentro da versão descompactada, o AJAX não funcionará corretamente.

Etapa 2: Agora dentro de “header.php”
Agora precisamos usar wp_head(); função em tags

.
    <?php echo get_bloginfo(); ?>                

Etapa 3: Agora dentro de “footer.php”
Agora precisamos usar wp_footer(); sob a tag.

Incluir wp_head() e wp_footer() em seu tema WordPress é crucial. Essas funções inserem automaticamente scripts, estilos e metadados essenciais exigidos pelo WordPress, temas e plug-ins, garantindo funcionalidade, compatibilidade e desempenho adequados. wp_head() adiciona elementos necessários na seção para SEO, enquanto wp_footer() inclui scripts no final para adiar JavaScript não crítico, melhorando a velocidade de carregamento da página. Essas funções são vitais para a integração de plugins e personalizações dinâmicas de temas, bem como o posicionamento correto de análises e códigos de rastreamento.

","image":"http://www.luping.net/uploads/20240929/172757700566f8bbad10cf2.jpg","datePublished":"2024-11-04T20:05:55+08:00","dateModified":"2024-11-04T20:05:55+08:00","author":{"@type":"Person","name":"luping.net","url":"https://www.luping.net/articlelist/0_1.html"}}
"Se um trabalhador quiser fazer bem o seu trabalho, ele deve primeiro afiar suas ferramentas." - Confúcio, "Os Analectos de Confúcio. Lu Linggong"
Primeira página > Programação > Enfileirar scripts CSS e JS no WordPress para melhor desempenho

Enfileirar scripts CSS e JS no WordPress para melhor desempenho

Publicado em 2024-11-04
Navegar:916

Enqueue CSS and JS Scripts in WordPress for Better Performance

WordPress é um software de código aberto – os usuários podem instalá-lo, modificá-lo e distribuí-lo como quiserem. Como o código-fonte é acessível a todos, milhões de especialistas e desenvolvedores em WordPress podem criar ferramentas e extensões e compartilhá-las com o público.

Vamos ver como enfileirar arquivos CSS e JS em seu projeto wordpress.

A maioria dos desenvolvedores mais novos gosta,

Dentro de “header.php”

    <?php echo get_bloginfo(); ?>

Dentro de “footer.php”

Mas, esta não é a maneira correta de enfileirar arquivos CSS e JS dentro do seu projeto wordpress. Para encaixar isso, primeiro vá para o arquivo “functions.php” e enfileire os arquivos desta forma. Vamos ver o truque do sigma….

Etapa 1: funções.php

function my_theme_enqueue_styles_scripts() {
    // Enqueue CSS files
    wp_enqueue_style('bootstrap-css', get_template_directory_uri() . '/assets/css/bootstrap.min.css');
    wp_enqueue_style('aos-css', 'https://unpkg.com/[email protected]/dist/aos.css');
    wp_enqueue_style('custom-css', get_template_directory_uri() . '/assets/css/custom.css');

    // Enqueue default Jquery in wordpress.
    wp_enqueue_script('jquery');

    wp_enqueue_script('bootstrap-js', get_template_directory_uri() . '/assets/js/bootstrap.bundle.min.js', array('jquery'), null, true);
    wp_enqueue_script('font-awesome-js', get_template_directory_uri() . '/assets/js/font-awesome-all.min.js', array(), null, true);
    wp_enqueue_script('custom-js', get_template_directory_uri() . '/assets/js/custom.js', array('jquery'), null, true);
}
add_action('wp_enqueue_scripts', 'my_theme_enqueue_styles_scripts');

Nota: Wordpress fornece uma versão não compactada do jquery. Portanto, podemos simplesmente usar esse jquery dentro dos arquivos js necessários! Para isso basta passar o parâmetro array('jquery') dentro de “wp_eneueue_script” . Uma coisa a lembrar é que o JQuery possui 2 versões principais: descompactada e compactada. Dentro da versão descompactada, o AJAX não funcionará corretamente.

Etapa 2: Agora dentro de “header.php”
Agora precisamos usar wp_head(); função em tags

.
    <?php echo get_bloginfo(); ?>

Etapa 3: Agora dentro de “footer.php”
Agora precisamos usar wp_footer(); sob a tag.

Declaração de lançamento Este artigo está reproduzido em: https://dev.to/shimanta_microcodes/enqueue-css-and-js-scripts-in-wordpress-for-better-performance-32ao?1 Se houver alguma infração, entre em contato com study_golang@163 .com para excluí-lo
Tutorial mais recente Mais>

Isenção de responsabilidade: Todos os recursos fornecidos são parcialmente provenientes da Internet. Se houver qualquer violação de seus direitos autorais ou outros direitos e interesses, explique os motivos detalhados e forneça prova de direitos autorais ou direitos e interesses e envie-a para o e-mail: [email protected]. Nós cuidaremos disso para você o mais rápido possível.

Copyright© 2022 湘ICP备2022001581号-3