css - why enqueued styles in header.php shows in footer?

admin2025-04-17 0

I`m using this code in functions.php:

add_action('wp_head', 'addMyStyle');
function addMyStyle() {
    wp_enqueue_style( 'bootstrap', get_template_directory_uri() . '/css/bootstrap.css', false, '1.0', 'all', false );
    wp_enqueue_style( 'bootstrap-rtl', get_template_directory_uri() . '/css/bootstrap-rtl.css', false, '1.0', 'all', false );
    wp_enqueue_style( 'style', get_template_directory_uri() . '/style.css', false, '1.0', 'all' );
}

and <?php wp_head(); ?> tag is right before </head> tag. but style files load in footer tags. I want these styles load in head tags.

Inside my <head> tags:

<!DOCTYPE html>
<html xmlns="" dir="rtl" xml:lang="fa" lang="fa">
<?php global $current_user; get_currentuserinfo(); ?>
<head>
<meta name="theme-color" content="#1B5064" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="HandheldFriendly" content="True">
<link rel="shortcut icon" href="/favicon-16x16.png" />
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src=""></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA--1');
  function resizeIframe(obj) {
    obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px';
    obj.style.height = 0;
    obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px';
  }
</script>
<meta name="google-site-verification" content="" />

<?php 
if ( wp_is_mobile() ) {
    ?>
    <style>.woocommerce-cart-form .container {overflow:scroll;}</style>
    <?php
}
?>
<?php wp_head(); ?>
</head>

I`m using this code in functions.php:

add_action('wp_head', 'addMyStyle');
function addMyStyle() {
    wp_enqueue_style( 'bootstrap', get_template_directory_uri() . '/css/bootstrap.css', false, '1.0', 'all', false );
    wp_enqueue_style( 'bootstrap-rtl', get_template_directory_uri() . '/css/bootstrap-rtl.css', false, '1.0', 'all', false );
    wp_enqueue_style( 'style', get_template_directory_uri() . '/style.css', false, '1.0', 'all' );
}

and <?php wp_head(); ?> tag is right before </head> tag. but style files load in footer tags. I want these styles load in head tags.

Inside my <head> tags:

<!DOCTYPE html>
<html xmlns="http://www.w3/1999/xhtml" dir="rtl" xml:lang="fa" lang="fa">
<?php global $current_user; get_currentuserinfo(); ?>
<head>
<meta name="theme-color" content="#1B5064" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="HandheldFriendly" content="True">
<link rel="shortcut icon" href="/favicon-16x16.png" />
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager/gtag/js?id=UA--1"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA--1');
  function resizeIframe(obj) {
    obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px';
    obj.style.height = 0;
    obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px';
  }
</script>
<meta name="google-site-verification" content="" />

<?php 
if ( wp_is_mobile() ) {
    ?>
    <style>.woocommerce-cart-form .container {overflow:scroll;}</style>
    <?php
}
?>
<?php wp_head(); ?>
</head>

Share Improve this question edited Dec 22, 2019 at 9:35 asked Dec 22, 2019 at 7:58 Avand Printer 134 bronze badges

What does the code look like for your header? Also, you are passing too many arguments into wp_enqueue_style. You have 6 and the function only takes 5: developer.wordpress/reference/functions/wp_enqueue_style – Nick Young Commented Dec 22, 2019 at 8:51
I put my head tag section. and yes last false is extra argument. – Avand Printer Commented Dec 22, 2019 at 9:08

Add a comment |

1 Answer 1

Sorted by: Reset to default 1

The reason this is happening is that enqueued scripts and styles are output on wp_head at priority 8, but your addMyStyle() functioning is running at priority 10, the default. This means that it's too late to enqueue scripts and styles for the header. You could use a lower priority, but wp_head is the wrong hook to use here anyway. You should be using wp_enqueue_scripts.

转载请注明原文地址:http://conceptsofalgorithm.com/Algorithm/1744884251a272441.html

csswhy enqueued styles in headerphp shows in footer

最新回复(0)