In this tutorial, learn to Optimize GeneratePress Theme. Basically, we will use the GP Premium WordPress Theme in this whole optimization process.
If you are regular visitors then you all know that I have been writing lots of GeneratePress Tutorials on my blog. I love GeneratePress Theme and I have been using GP Premium in my other blogs.
so after reading this blog post, implement my strategy in your blog to speed up the GeneratePress website.
In this guide, you will also learn more about
- GeneratePress and WPLogout Speed Test
- Steps to Speed Up GeneratePress Theme
- Use of Premium Plugin in GeneratePress
- Web Hosting
- Plugin Optimization
- Font Optimization
- Use of Content Delivery Network (CDN)
- Analytics Optimization
GeneratePress Speed Test
Tom Usborne, the founder and lead developer of GeneratePress Theme has created a separate subdomain
speedtest.generatepress.com to check the speed of the bare GP Theme using Autoptimize plugin.
The result with GTMetrix and Google PageSpeed Insights is here.
Also, the GTMetrix Score and Google PageSpeed Insights of WPLogout are also awesome.
100/100 score in GTMetrix and 97/100 for Mobile, 100/100 for Desktop in Google Page Speed Insights.
Also Read: GeneratePress Review
Steps to Optimize GeneratePress Theme
Before starting, you can read my optimize WordPress website article, there are few similar things that are useful for optimizing the GeneratePress website.
Furthermore, this article is based on how I speed up my GeneratePress site. so below are the tips and tricks you can implement in your blog.
First, always try to use less plugin. Less plugin = Less code and Less code = Fast loading and bug-free site.
I always try to avoid plugin but there are few plugins that I am going to list out that helps to achieve our goal.
Logo: Basically, we upload the logo with jpg or png extension. Here, I am using the SVG logo. I created my SVG’s wplogout logo because SVG has huge advantages over png and jpg. The size of SVG is smaller compared to other image extensions. SVGs icon remains the same no matter the screen resolution.
If possible use SVG logo on your site. For security purposes, WordPress doesn’t permit to upload SVG files. You can use Safe SVG plugin to upload SVG in WordPress.
Icon Type: Use SVG as a Icon Type rather than Font in GeneratePress. For this, go to your
Dashboard > Appearance > Customize > General > Choose SVG > Publish
If possible avoid using FontAwesome or ionicons that add extra requests in your site.
Table of Contents
If you are looking for a TOC plugin then you can find plenty of them in the WordPress plugin repository. You can also create a Table of Contents without a plugin in WordPress easily but if you have a long article then creating TOC manually can be frustrating and time-consuming.
Previously I was using Easy Table of Contents plugin and it was loading TTF font. The size of loading TTF font was small but it was adding an extra request.
so later I migrated to LuckyWP Table of Contents. I use LuckyWP TOC because it has minimal impact on page speed, less memory uses. TOC plugin is best for SEO.
Tom is using the Autoptimize plugin while testing his site, the plugin is free to use. I am using the WP Rocket plugin to speed up my site. It is a famous paid WordPress Caching Plugin.
WP Rocket Plugin has great features like Page Caching, Cache Preloading, Sitemap Preloading, GZIP Compression, Browser Caching, Database Optimization, Google Fonts Optimization, Remove Query Strings from Static Resources, Minification / Concatenation, Defer JS Loading, etc.
WP Rocket helps to get a higher score on Google Page Speed Insights, GTmetrix, etc.
Almost the internet is filled with Web Hosting articles :P. so I am not going to write a long article on web hosting.
Hosting is the main reason behind the speed. Previously, I was using Shared Hosting and later I migrated to Cloudways Managed Cloud Hosting. I am using DigitalOcean stack in Cloudways and after whole migration, my site’s page loading time drastically reduces and you can see the result above.
Also Read: Cloudways Hosting Review
GeneratePress itself is using Kinsta – A Managed Cloud Hosting to host their site. Kinsta is powered by Google Cloud.
There is a day and night difference between cheap shared hosting and managed hosting. so think about Web hosting before anything else and choose wisely.
Content Delivery Network
CDN is suitable if you are targeting your site globally. Facebook, Amazon, Netflix, Alibaba, etc. are using CDN. I am personally using BunnyCDN. One of the cheapest and fastest CDN providers to speed up my website globally.
Social Sharing Buttons
Almost every blogger uses social sharing buttons after each post or page and I do that too. Bloggers prefer to use a plugin. Some of the social sharing plugins are good but in most cases, you will find a social sharing plugin that tends to slow our WordPress Website.
So, to overcome this issue I wrote a tutorial to create social sharing buttons without any plugin. Also, you can create floating social sharing buttons in your GeneratePress website without a plugin.
Recently I switched my font back to System Font Stack from one of the Google Fonts. The only reason is that I am obsessed with Web Performance.
Generally when you use Google Fonts in your site then fonts are called from Google’s server every time i.e. there is always extra request from
To overcome this issue, you can host Google Fonts locally so that Fonts can be called from your server or CDN. If you can’t live without Google Fonts then I suggest you use 1 or 2 fonts at maximum hosting them locally.
But if you want to speed up your GeneratePress website then you can switch back to System Stack font. There are certain reasons to choose System Stack Font.
- System Font Stacks are free.
- System Font Stack is available in your operating system.
- No Fonts Download is required
How to use System Font Stack in GeneratePress Theme?
- Go to your site dashboard
- Go to Appearance > Customize
- Go to Typography and Choose System Stack from font options.
Google Analytics Optimization
Generally, we use Google Analytics tracking code in your site to track visitors. While testing the site in GTMetrix, you see Leverage Browser Caching for Google Tag Manager and Google Analytics.
You will see 2 extra requests and to fix leverage browser caching you can host Google Analytics locally. Optimizing Analytics helps to speed up our WordPress Website.
What if you are embedding YouTube videos in your post or page? Will embedding slow down your site? How to lazy load images below the fold?
Yes, embedding slows down the website since every time visitors have to make an extra HTTP request. So you can solve this issue by lazy loading the YouTube iframe.
Solution: If you are using WP Rocket Paid plugin then go to WP Rocket > Media > Enable LazyLoad for iframes and videos.
Also you can lazy load images below the fold using WP Rocket plugin.
Moreover, you can use WP YouTube Lyte to lazy load YouTube video that is available in the WordPress Repository for free.
You can always improve your site by removing bloated plugins, unused code snippets, etc. Lazy load your images and videos, optimize your images before uploading. Implement CDN, choose the proper hosting.
By default, GeneratePress is one of the fastest themes and by implementing the above tips, you can optimize GeneratePress Theme and make it even faster.
If you have more tips then please feel free to comment below.