0

We have some shortcodes which are generating CSS styles. there are like options ("Title color, Title box border color,font-size, font-weight").

When user setup the options, it will be generated before the shortcode code started.

ex)

<html>
<head>
.................. (some style, js) .................. 
/* I want to put all of css styles into head tag from into body tags */
</head>
<body>
  <style type="text/css">
   .sc_title {color:#fff; font-weight:600;}
  </style>

  <div class="sc_wrap">
   <h1 class="sc_title">Hello This is the title</h1>
  </div>
</body>
</html>

As you may know this is illegal rule for W3C. style tags have to be in "head" tag.

Is there anyway to put them into header tags when css styles have been generated from shortcodes?

I have seen some tips or tutorial saying that I should use wp enqueue style. I don't think it's possible to create each .css files for each shortcodes.

Please advise us if we have missed something or if you have any good idea.

Thank you,

Improve this question
1

1 Answer 1

Reset to default
-1

You can insert any code in the header by hooking an action.

header.php

<?php wp_head(); ?>

functions.php

add_action( 'wp_head', 'iulia_example' );

function iulia_example() {

    echo '<style type="text/css">
   .sc_title {color:#fff; font-weight:600;}
  </style>';

}

the result will be : the style inserted just above </head>

Improve this answer
2
  • thanks you for your comment. however, the "css" is in body tag. the css style gets variables from shortcodes which are in body. I believe and tested that wp_head is Not working in body.
    – pulla
    Commented Sep 21, 2015 at 6:57
  • Hey iulia, OP is asking for shortcode styles, can you please address that.
    – leymannx
    Commented May 17, 2019 at 10:15

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.