How to minify CSS / JavaScript in wordpress without any plugin

Home / Blogging / How to minify CSS / JavaScript in wordpress without any plugin

Minifying CSS and javascript is very important for better performance of blog / website. In this article I gonna tell you about how to minify CSS and javascript.

Hello everyone hope you guys are doing well and first of all I would like to apologize to my hindi readers for writing this article in English. In this article we’will discuss about how to minify CSS and javascript of a wordpress site.
What does minifying css and Javascript means ? minification means removing unnecessary space from the file. Minifying CSS and javascript helps our blog or website to load faster. Site loading time is obviously an important part of user experience, also a slow website is bad for search engine optimization.

There are tons for plugin and others ways are available in internet for minify CSS and javascript but in this article I am gonna share the easiest way to minify css .

How does loading time effect website or blog ?

Just imagine that you are a user trying to find something on google and you gets landed on a site which is terribly slow , so how would you react ? I am 100% sure you will instantly leave that site right ? that’s exactly happens to our site when it works slow. If your site takes 4-5 seconds to load then for sure the user will leave and that will increase the bounce rate , decreases the conversion rate and also reduce the page view. So because of all these reasons a website needs to load faster. Reduction in customer satisfaction , Search engine optimization problems are one of those major impact which your site face when it load slow.

You can test your sites load time by using these online tools –

1 .  Google Page speed Insights

2 .  GTmertix

3 .  KeyCND speed test

As I mentioned before there are lot of ways to  compress javascript online or to minify CSS but the method which I am going to share with you guys the one of the best and easiest way to do it. In this method of compress javascript online and minify css all you need to do is  just copy and paste codes , ya that’s all.

Step 1 – Open your wordpress – appearance – editor

aperrance How to minify CSS / JavaScript in wordpress without any plugin

Step 2 –  In Editor section you simply have to cut all the CSS code

codes-1 How to minify CSS / JavaScript in wordpress without any plugin

Step 3 –  After copying all CSS codes just open  cleancss.com and paste all the CSS codes there.

codes-2 How to minify CSS / JavaScript in wordpress without any plugin

Step 4 –  After minifying your CSS codes in cleancss.com , just copy and paste that code in editor section from where you have cut them.

Before and after screenshot of CSS codes after minifying them in cleancss.com

before-and-after-minify-css-codes How to minify CSS / JavaScript in wordpress without any plugin

This is as simple as that , just simple copy and paste. For reference you can see the before and after screenshot below. I would suggest you to copy your CSS code in notepad just in case if you messed up simply put that old code again in same place.

That’s all  , I hope this article helped you to minify your CSS and javascript code. If you liked this article then don’t forget to share it with your friends. Also you can find us on Facebook and Twitter.

 

 

 

Please follow and like us:
follow_subscribe How to minify CSS / JavaScript in wordpress without any plugin

2 Comments

Leave a Reply

Your email address will not be published. Required fields are marked *

Enjoy this blog? Please spread the word :)