Wordpress: Is there a way to move stylesheets from head to body?

Question

I want to move theme stylesheets from head section to body section, for example:

<link rel='stylesheet' id='flatsome-main-css-css'
      href='//www.mysite.com/wp-content/themes/flatsome/css/foundation.css' 
      type='text/css' media='all' />

I want to move this link to the body section, but don't know how.

Why would you even think of that? CSS links are always in the head of a page! — Dut A., Apr 16 '16 at 07:47
https://www.webdesignby.com/programming/wordpress-hook-after-body-tag/ — vrajesh, Apr 16 '16 at 07:56

score 0 · Answer 1 · edited May 23 '17 at 12:07

0

Several ways to do this, for example:

As simple as this:

<link href=".../yourstylesheet.css" rel="stylesheet" type="text/css" />

Mind the difference, you don't put rel="stylesheet/css", just rel="stylesheet"

JS way:

loadCSS = function(href) {

  var cssLink = $("<link>");
  $("head").append(cssLink); //IE hack: append before setting href

  cssLink.attr({
    rel:  "stylesheet",
    type: "text/css",
    href: href
  });

};

Usage:

loadCSS("loadCSS(".../yourstylesheet.css");");

Credits: https://stackoverflow.com/a/13556622/6134447

But I second Dadani's question: why would you do that? :)

edited May 23 '17 at 12:07

Community

1
1

answered Apr 16 '16 at 09:40

bugnumber9

451
1
4
16

Only for testing. :) – zed Apr 16 '16 at 10:27
What about performance, you can use that as a substitute for 'defer' in old browsers – Velimir Tchatchevsky Jan 01 '18 at 23:51

Wordpress: Is there a way to move stylesheets from head to body?

1 Answers1