wp_add_inline_style - loads styles in BODY instead of HEAD

Envato Authors CodeCanyon
1

Hi

I’m using wp_add_inline_style in shortcode (loacted in plugin, not in theme). Then i use add_action( ‘wp_enqueue_script’, ‘pe_background’ );

The problem is that my styles are located just before BODY end, and i would like to add them in HEAD section (it causes W3C validation problems).
My code looks like that (in simplification):

  add_shortcode('background', 'xx_background');
  if (!function_exists('xx_background')) {
  		function xx_background($atts, $content = null ) {
  				$a = shortcode_atts(
  						array(
  								'imgid' => ''
  						), $atts);

  					$font_color_background_line = '';
  					if(!empty($font_color)){
  						$font_color_line = 'color:'.$font_color;
  						$font_color_background_line = 'background:'.$font_color;
  					}
  					
  					if(!empty($xx_selector)){
  						wp_enqueue_style(
  							'xx-theme-plugin-custom',
  							plugin_dir_url( __FILE__ ). 'xx-theme-plugin-custom.css', array(), '1.0', 'all'
  						);
  						$xx_theme_plugin_custom_css = '';
  						$xx_theme_plugin_custom_css.=
  								$xx_selector." .xx-title:after{
  									$font_color_background_line;
  								}".	
  							";
  						wp_add_inline_style( 'xx-theme-plugin-custom', $xx_theme_plugin_custom_css );
  					}
  				}
  		}
  }
  add_action( 'wp_enqueue_script', 'xx_background' );

Any help would be appreciated.

2

It is wrong category for this question.

3

You probably meant to use the wp_enqueue_scripts action instead of wp_enqueue_script.

Reference: https://developer.wordpress.org/reference/hooks/wp_enqueue_scripts/