- This topic has 11 replies, 2 voices, and was last updated 5 years, 1 month ago by Tom.
October 14, 2014 at 1:54 pm #39170Oleg
Sorry for my english – I write with translate.google.
Recently installed your template. Thank you so much. The template is really very cool!
Tell me, how can I remove the styles from the html-code?
I mean that custom styles, that you can find inside <head> … </head>
I use a template with Super Package.
Thanks in advance for your reply!October 14, 2014 at 1:56 pm #39171TomLead DeveloperLead Developer
These styles are necessary, and won’t impact performance.
I’m looking into ways to package these styles into a file – the problem is when I do that, the Customizer doesn’t update stuff right away, meaning you have to save to show the changes (which defeats the purpose of the Customizer).
For right now, they have to stay – but I’m working on it 🙂
Glad you’re enjoying the theme!October 14, 2014 at 11:16 pm #39209Oleg
Thank you for your answer!
I understand that now styles need to configure the template, but it may be possible to remove them now?
Russian search system is very sensitive to the presence of styles in the html code.
I front-end and will be able to customize the appearance of the theme without customizer, but do not understand php: /
I tried to edit $ visual_css = array (…), but nothing happened 🙁
Perhaps this information will be useful to other users template!October 14, 2014 at 11:48 pm #39212TomLead DeveloperLead Developer
Having CSS in the HTML is very bad for performance and CSS, but loading it directly in the
<head></head>of the website actually increases performance, and isn’t seen as bad by search engines (globally).
Here’s a great article on it: https://medium.com/@schizdazzle/whats-with-putting-the-css-in-the-head-24888fbbd2e2
Google also has an article on it: https://developers.google.com/speed/pagespeed/module/filter-css-to-head
I think you may be mistaking it with inline CSS inside the
<body>, which is bad and should be avoided.
Of course, it’s not impossible to remove the CSS from the
<head>– but it will make the Customizer useless, as none of your changes will be output into the browser.
Let me know – if you really want to remove it, I can provide some functions which should do so.
Thanks!October 15, 2014 at 3:45 am #39248Oleg
It’s will be great, if you do it for me.
Recently, our main search engine make “nice” changes, and one of them is about styles.
Thanks a lot for your support!October 15, 2014 at 2:47 pm #39397TomLead DeveloperLead Developer
Looked into this, and there’s no function for removing it as I was hoping.
What you can do is look inside the plugin files, and find a line that starts with this:
wp_add_inline_style( 'generate-style', ... );
Then, comment it out by adding two slashes in front of it:
//wp_add_inline_style( 'generate-style', ... );
Doing it like this means you won’t be able to update the addons without having to repeat this process.
Again – for anyone reading this, this will do more harm than good, and is only for people who want to strip important CSS code and replace it with their own. I don’t suggest doing this at all, especially seeing as search engines actually prefer CSS in the
<head>as opposed to external files, as it’s better for performance.
Good luck!May 28, 2016 at 12:30 pm #197495rudolf
Actually Tom, it does harm because the relation between text and code is severely influenced by the big amount of styles in the header and since WordPress has already a lot of overhead stuff, this makes it worse.
As such, it is bad for SEO. It would be OK if you add a couple of styles, but your template generates 6,900 characters for styling in the header alone.May 28, 2016 at 12:33 pm #197496TomLead DeveloperLead Developer
Any articles/sources for that? I’d be very interested in reading.
It’s my understanding that search engines only care about content.
If the code was in the body then I would agree, but it’s not.
There’s little difference between including the style in the head vs linking to an external file.
When people refer to “inline CSS”, they mean something like this:
<p style="background-color-red;color:white;">My paragraph</p>
Too much of that is bad.
I should note that the current method is the go-to for WordPress developers where the user writes the CSS with their options.
There are a couple options for writing this CSS to files, but they hurt performance.
I’m always looking for the best of both worlds – CSS in an external file that doesn’t hurt performance.
For anyone who wants this CSS in an external file, I suggest using this plugin: https://en-ca.wordpress.org/plugins/autoptimize/
May 30, 2016 at 8:43 am #197988rudolf
- This reply was modified 5 years, 2 months ago by Tom.
- This reply was modified 5 years, 2 months ago by Tom.
Thanks for the response Tom, but according to W3C:
“An internal style sheet may be used if one single page has a unique style.
Internal styles are defined within the <style> element, inside the <head> section of an HTML page:…”
This isn’t the case here. The same styles are repeated in the header over and over again, which is against the very idea of css.
But I understand that if you want options in the admin, that you have to resort to this sort of solutions.
Keep up the good work 🙂
Cheers!May 30, 2016 at 9:47 am #198024TomLead DeveloperLead Developer
Thanks for the info! It doesn’t look like it will hurt anything, but it’s definitely something I’d like to get sorted out.
Once I find a solution that won’t hurt performance I’ll definitely do it 🙂May 31, 2016 at 12:38 am #198204rudolf
Thanks, Tom. What I thought was: have the options in there, the user sets them and when happy with the result, goes to the frontend, select the internal css in the source code, glues it at the end of the style sheet, then, there would be a checkbox in the options to disable internal styling.
In the funvctions.php, you check for the variable of that checkbox and enable or disable wp_add_inline_style( ‘generate-style’, … ); accordingly.
Cheers!May 31, 2016 at 11:01 am #198286TomLead DeveloperLead Developer
That’s one way, but most people probably won’t do it.
I’m working on a “feature plugin” that will try to do that for you automatically. I’ll release it as a plugin, and once we get enough people using it successfully, I’ll add it to core 🙂
- You must be logged in to reply to this topic.