WordPress – How to fix Jetpack connection errors, Fonts and Icons showing as squares with NGINX

I recently migrated https://blog.eucse.com/blog from running on Apache to Nginx. I found it helped a lot with utilization and speed (combined with a few more tweaks), but one thing I noticed after was Jetpack wouldn’t load correctly, and some fonts and icons were showing as squares.

See examples of what I was seeing below:

Resolution

Access Control Allow Origin settings in NGINX!


       location ~ \.(ttf|ttc|otf|eot|woff|woff2|font.css|css|js)$ {
               add_header Access-Control-Allow-Origin "*";
       }

Add the above to your server block, run nginx -t to test, and then restart nginx to set it.

Say hello to a working site!

Thanks to https://support.maxcdn.com/hc/en-us/articles/360036555812 and https://docs.presscustomizr.com/article/233-social-icons-showing-up-as-squares for the assistance!