Combine External CSS In WordPress

Pingdom, GTmetrix, or Google PageSpeed Insights are all giving you the “combine external CSS” warning. This is a relatively common error among WordPress website owners, so you’re not alone. When you have 10 or more CSS files loaded from a CDN or subdomain, this warning appears (external domain). Concatenating or combining your CSS files so that they load in a single request is one approach to fix this.

Note: If you’re using HTTPS and your ISP supports HTTP/2, you can normally disregard this warning right now. Multiple CSS files can now be loaded in parallel over a single connection thanks to HTTP/2.
external css warnings should be combined with Pingdom
In Pingdom, combine external CSS warnings.
If you’re still using HTTP and haven’t made the switch to HTTP/2, the lesson below will show you how to mix external CSS files. Concatenation is, once again, a technique that is now widely considered outmoded. HTTP/2 is now supported by over 77 percent of browsers when running over HTTPS, as well as numerous CDN and web hosting providers, including Kinsta. It’s also worth noting that Pingdom doesn’t yet support HTTP/2 due to the fact that it runs on an older version of Chrome.
Combine External CSS in WordPress
When using a CDN, the integrate external CSS warning appears because your CSS files are hosted on an external domain, such as cdn.domain.com. On your web server, you may simply concatenate your CSS files. You will no longer see this warning once they have been integrated because they will be loaded in a single request. Using a free WordPress plugin called Autoptimize, created by Frank Goossens, is one of the simplest ways to do this.

autoptimize
Plugin Autoptimize
This plugin is quite small, weighing in at only 176 KB. It presently has over 1,000,000 active installs and a 4.7 out of 5-star rating as of this writing. The plugin aids in script concatenation, minification, expiration headers, and the ability to transfer styles to the header and scripts to the footer.

You can get it from the WordPress repository or search for it in the “Add New” plugins section of your WordPress dashboard. You’ll want to go into the settings and enable the “Optimize CSS Code” option once it’s installed. Your CSS files will be concatenated (combined) as a result of this. Also, if you’re utilizing a CDN, make sure to include the URL for your CDN. Your CSS files will load as a single request on your CDN in this manner.

Integrate CSS files from other sources
Combine CSS files from different sources.
After enabling the aforementioned options, all of your CSS files will be combined into one “autoptimize xxxxx.css” file.

CSS files that have been combined
Save time, and money, and improve site performance by using:

Expert WordPress hosting assistance is available 24 hours a day, 7 days a week.
Integration with Cloudflare Enterprise.
With 29 data centers across the world, we can reach a global audience.
With our built-in Application Performance Monitoring, you can improve your performance.
All of this and more is included in a single plan that includes no long-term obligations, aided migrations, and a 30-day money-back guarantee. Check out our plans or speak with a sales representative to find the ideal plan for you.