Speeding up Web Fonts on WordPress Portfolios (Real Test)

发布于 2026-07-21 14:16:29

A Week of Speed Tuning My New Creative Agency Website


A regular client of mine—a busy video and photography agency—wanted to update their portfolio site. They were tired of their old slow page builder and wanted a clean, bold look. After comparing a few choices, we decided to try out a premium template.

Here is my raw, honest diary of how we set it up, ran into some font loading bottlenecks, and fixed them to get the loading times under 1.5 seconds.

Day 1: Clean Install and Page Speed Check

We started with a clean WordPress setup on a standard cloud server. I installed the Creaox - Creative Agency Portfolio WordPress Theme. On day one, I wanted to see what the core performance looked like without any third-party plugins.

The good news is that the theme doesn't rely on heavy builders like Elementor. The HTML structure is clean and uses Gutenberg blocks. Out of the box, the homepage had only 14 server requests, which is great for a media-focused theme.

Day 3: The Web Font Loading Bottleneck

By day three, we started customizing the layout. That is when I ran into our first real speed issue.

The theme is beautiful, but by default, it makes external requests to Google Fonts. On mobile, these external font calls were blocking our page rendering for nearly 1.5 seconds. It created a blank screen while the phone waited to download the font files.

Instead of using a bulky optimization plugin that might break other scripts, I decided to fix this directly with code. I added this PHP snippet to our child theme's functions.php file to stop the theme from loading those external fonts:

// Block the default external Google Fonts
add_action('wp_enqueue_scripts', function() {
    wp_dequeue_style('creaox-fonts');
}, 99);

Next, I downloaded the font files (WOFF2 format), uploaded them locally to our child theme folder, and preloaded them in the HTML head. This meant the browser loaded the fonts instantly without making external trips to Google's servers.

Day 5: Cleaning Up the Media Library with WP-CLI

By day five, the client had uploaded some massive images that messed up our mobile scores. I didn't want to compress them manually one by one.

I logged into the server using SSH and ran a quick WP-CLI command to regenerate all their uploaded media to use our newly configured WebP sizes:

wp media regenerate --yes

This replaced the heavy JPEG files with light WebP images, saving us over 5 MB of total page weight on their portfolio grid page.

Day 7: The Final Verdict

After seven days of working with the site, we launched it. Our mobile PageSpeed score went from a mediocre 55 to a clean 91.

My honest take? The layout is great and the code is built properly. But like most themes, you still need to keep an eye on how fonts and heavy media are loaded. If you are willing to spend a little time tweaking the asset loading and running some basic WP-CLI cleanup commands, it serves as an excellent, lightweight foundation for any modern creative agency.

0 条评论

发布
问题