How to Preload Font in WordPress Functional Plugin

I use a plugin to do a bunch of optimizations on this site, but for some reason, the preloading of fonts is broken. So I rolled my own font preloading function and placed it in my functional plugin (You could also put it in functions.php). Here’s the code:

// Add code to <head>
function tmm_add_to_header(){
	?>
	<link rel="preload" href="/path/to/font.woff2" as="font" type="font/woff2" crossorigin>
	<?php
};
add_action('wp_head', 'tmm_add_to_header');

That’s it!

Thanks to web.dev for the font preload code.

Posted in

The Mighty Mo! Design Co.

More posts from themightymo.com

How to merge two folders, including all sub-folders and files, on Mac

By The Mighty Mo! Design Co. | November 3, 2022

Today I had an issue where I needed to merge two folders, each of which contained many sub- and sub-sub folders that had lots of images. After a lot of trial-and-error and some Googling, I found the best solution is to use the “ditto” command in Terminal like this: That’s it! Hat tip to AppleInsider.

mailchimp usage stats

Some Surprising Trends in Website Development

By Toby Cryns | October 17, 2022

I wasted some time today to bring you (dum dum duuuuum!): Some Surprising Trends in Website Development!

How to Configure WordPress with Cloudflare, HSTS, TLS, and Secure Headers

By The Mighty Mo! Design Co. | October 11, 2022

I was recently asked to look into creating some secure http headers as well as forcing a website to load over TLS1.2+. Below are my “how to” instructions for updating these settings within WordPress and Cloudflare. Install & Configure the Cloudflare WordPress plugin. Make sure an SSL Certificate is installed on your host for your…