Views CSS load in HEAD in Tag and without Javascript

This support ticket is created 6 years, 12 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

No supporters are available to work today on Toolset forum. Feel free to create tickets and we will handle it as soon as we are online. Thank you for your understanding.

Sun	Mon	Tue	Wed	Thu	Fri	Sat
-	7:00 – 14:00	7:00 – 14:00	7:00 – 14:00	7:00 – 14:00	7:00 – 14:00	-
-	15:00 – 16:00	15:00 – 16:00	15:00 – 16:00	15:00 – 16:00	15:00 – 16:00	-

Supporter timezone: Europe/London (GMT+00:00)

Tagged: Views plugin

This topic contains 1 reply, has 2 voices.

Last updated by Nigel 6 years, 12 months ago.

Assisted by: Nigel.

Author

Posts

November 26, 2017 at 6:00 pm #593119

christianS-8

Hi,

This ist also my Support Ticket https://toolset.com/forums/topic/extra-css-of-views-and-content-templates-load-as-style-in-head/#post-590770, you can see hier what my problem was.

I use Plugin Autoptimize hidden link , this plugin is pretty good to optimize CSS and JS on website. But WPV-Views loads full CSS in Footer as DIV and after Website is loaded, then copies it full css from Footer in HEAD as <style> TAG. Therefore cannot CSS optimizers identify this inline css as CSS and therefore the don't optimize it. But this CSS is very important for website.
Also because of this, is VIEWS CSS to late in HEAD with JS loaded and therefore looks website very bad for first seconds.

I hope Toolset Team can understand this problem.
Thanks

November 27, 2017 at 9:03 am #593320

Nigel

Supporter

Languages: English (English ) Spanish (Español )

Timezone: Europe/London (GMT+00:00)

Hi Christian

It is not possible to change this I'm afraid.

By the time the shortcode to insert the View into the page is reached in the build-process, the header of the page is already complete and it is the page body that is being constructed.

Hence the CSS is inserted into the page body.

Because it is currently not valid HTML to add CSS to the body element, JavaScript is used to then move it to the head tag.

If this is a problem for you then you should add your custom CSS by some other means and not use the custom CSS sections when editing a View.

You can add it to your theme's main stylesheet, for example, or enqueue another CSS with your customisations (https://developer.wordpress.org/themes/basics/including-css-javascript/).