How To Remove Social Warfare’s Inline CSS

Social Warfare is a really good social share plugin for WordPress. The buttons look great, and it’s easy to integrate. In fact, I am using it on this site. However, the plugin has a troubled past with security issues and notably an annoying inline CSS block.

You see, this inline CSS block wasn’t very well documented and it doesn’t depend on anything nor is it enqueued. What this means is that I had to track down it’s means of activation to get it optimized and removed.

This is the inline CSS block I am referring to.

@font-face { font-display:swap; font-family:"sw-icon-font";src:url("https://www.sertmedia.com/wp-content/plugins/social-warfare/assets/fonts/sw-icon-font.eot?ver=3.6.1");src:url("https://www.sertmedia.com/wp-content/plugins/social-warfare/assets/fonts/sw-icon-font.eot?ver=3.6.1#iefix") format("embedded-opentype"),url("https://www.sertmedia.com/wp-content/plugins/social-warfare/assets/fonts/sw-icon-font.woff?ver=3.6.1") format("woff"),     url("https://www.sertmedia.com/wp-content/plugins/social-warfare/assets/fonts/sw-icon-font.ttf?ver=3.6.1") format("truetype"),url("https://www.sertmedia.com/wp-content/plugins/social-warfare/assets/fonts/sw-icon-font.svg?ver=3.6.1#1445203416") format("svg");font-weight: normal;font-style: normal;}

So, What Needs To Be Optimized?

Social Warfare loads all of its assets on every single page regardless of inclusion on that page. Now, where do you normally load your share buttons? On your blog posts, maybe on some other scattered pages.

Do you ever load those share buttons on your homepage? No, not if you really care to have a cohesive design. Recently, I was trying to remove the CSS block from my header. I ran into issues when trying to only load Social Warfare’s assets on pages where they were being used.

How To Remove Just The Inline CSS Block.

If you’re just wanting to know how to remove Social Warfare’s inline CSS this can be done with the below filter.

Adding the above code to your child theme’s functions.php file or a site-specific plugin will resolve the issue. However, if you want to remove all css, js, and inline CSS from everything that is not a post you can do that with the below snippet.

The above gist will do just that, you can even change the logic to include a different post type, or all post types.

Closing Thoughts

Social Warfare is a great plugin overall I do wish though that it had some internal logic for loading its assets only when necessary. I also wish their icon font included a woff2 offering because atm they do not include it even though the integration of such would be relatively simple.

If you’re looking for a simple plugin you can upload to your site and be done with it you can download one from here.

scott hartley

About the author

Scott is a web performance geek, lover of all things coffee, and avid video game player. His WordPress work delves into web performance, web security, and SEO.

1 thought on “How To Remove Social Warfare’s Inline CSS”

Leave a Comment