Get almost 100% PageSpeed on Newspaper theme

29
Get almost 100% PageSpeed on Newspaper theme

The newspaper theme is a most popular premium theme for self-hosted WordPress blog. The theme is developed by team tagDiv. You can buy this theme from ThemeForest. The theme comes with great features. The theme package contains some premium plugins which are listed below –

  • Mobile theme plugin
  • Js Composer plugin
  • Social Counter plugin
  • Speed Booster plugin
  • Revolution Slide plugin

Theme developers have provided great support forum and tutorials for step by step setup. They have also provided PageSpeed guide to speed up your blog. You can buy Newspaper theme here.

Here, I am going to share some simple ideas which I have learned while optimizing my own blogs.

I am considering you have self-hosted WordPress blog with Newspaper theme active.

Install WP Super Cache

WP Super Cache plugin is a recommended cache plugin by tagDiv. It serves static contents to the visitor which improve page load speed.

Setup CloudFlare

CloudFlare is a free CDN which cache all the resources from your website and serve them to the users from their servers which are located across the globe. This reduces the load time of your website.

Options you have to enable on CloudFlare’s dashboard.

In your CloudFlare’s dashboard go to speed option. In the Auto minify check for-

  • JavaScript
  • CSS
  • HTML

minify_cloudflare

Scroll down, under the Rocket Loader settings, check Automatic this will improve load time for pages that include JavaScript.

enable-rocket-loader

Browser Caching – Add Expire Headers to WordPress

We are almost done here, now will go with sensitive part of this tutorial. You have to modify the code in .htaccess file. If anything goes wrong while editing .htaccess, your site may show a blank page or Error 500.

You have to add below code to your .htaccess file. Just copy and paste the following code-

# BEGIN Expire headers
<ifModule mod_expires.c>
ExpiresActive On
ExpiresDefault "access plus 5 seconds"
ExpiresByType image/x-icon "access plus 604800 seconds"
ExpiresByType image/jpeg "access plus 604800 seconds"
ExpiresByType image/png "access plus 604800 seconds"
ExpiresByType image/gif "access plus 604800 seconds"
ExpiresByType application/x-shockwave-flash "access plus 604800 seconds"
ExpiresByType text/css "access plus 604800 seconds"
ExpiresByType text/javascript "access plus 604800 seconds"
ExpiresByType application/javascript "access plus 604800 seconds"
ExpiresByType application/x-javascript "access plus 604800 seconds"
ExpiresByType font/truetype "access plus 604800 seconds"
ExpiresByType font/opentype "access plus 604800 seconds"
ExpiresByType application/x-font-woff "access plus 604800 seconds"
ExpiresByType image/svg+xml "access plus 604800 seconds"
ExpiresByType application/vnd.ms-fontobject "access plus 604800 seconds"
ExpiresByType text/html "access plus 600 seconds"
ExpiresByType application/xhtml+xml "access plus 600 seconds"
</ifModule>
# END Expire headers

<IfModule mod_deflate.c>
<filesMatch "\.(js|css|woff|html|php)$">
SetOutputFilter DEFLATE
</filesMatch>
</IfModule>

NOTE: If you have Optimize Website module enabled. It is located in your cPanel under Software. Then just remove the following code from a .htaccess file. It is highlighted with red color in above code.

<IfModule mod_deflate.c>
<filesMatch "\.(js|css|woff|html|php)$">
SetOutputFilter DEFLATE
</filesMatch>
</IfModule>

Fix The admin-ajax.php Slow Problem

As discussed with the tagDiv team it confirmed that theme uses admin-ajax.php almost for every block to request the Server and may of the features theme uses this way to query the server and may increase server response time.

So, to reduce admin-ajax requests trim down the block ajax options meaning the blocks pagination and ajax filters. Turn off the Ajax view count. Also, make sure you do not use too many different types of blocks. It’s better to check my guide to reduce admin-ajax server load in WordPress.

Install Lazy Load

You can reduce numbers of REQUESTS by installing Lazy Load plugin. Though theme has it’s inbuilt lazy load feature. Basically, it does not Lazy load images on your website, it just adds animation to your images.

Note: Don’t forget to disable theme’s inbuilt Lazy Load animation from Newspaper theme panel.

Install Speed Booster plugin

Speed booster plugin comes with Newspaper theme bundle. It compresses all the Stylesheets and JavaScripts and moves them to the bottom of the page. This will eliminate render-blocking JavaScript and CSS.

Currently, this plugin is not compatible with Jetpack. Enabling speed booster plugin with Jetpack active will result in double jetpack CSS in the source code.

Removing Font Awesome

To use icons in the theme, you have to use Font Awesome plugin. There are LOT of icons, and if you’re not using them, then there’s no point in loading all of them.

You need some of these icons for various elements throughout the theme. So you can add a little filter to script so that it only loads essentials.

To do so, put the following code in your theme’s functions.php file.

add_filter( 'infophilic_fontawesome_essentials', 'infophilic_fontawesome_essentials' );
function infophilic_fontawesome_essentials()
{
 return true;
}

Removing Emojis

If you not using Emojis on your site then there’s no need to load them in the back-end. So you can remove it by adding following code in theme’s functions.php 

add_action( 'init', 'infophilic_disable_wp_emojicons' );
function infophilic_disable_wp_emojicons() 
{
 // all actions related to emojis
 remove_action( 'admin_print_styles', 'print_emoji_styles' );
 remove_action( 'wp_head', 'print_emoji_detection_script', 7 );
 remove_action( 'admin_print_scripts', 'print_emoji_detection_script' );
 remove_action( 'wp_print_styles', 'print_emoji_styles' );
 remove_filter( 'wp_mail', 'wp_staticize_emoji_for_email' );
 remove_filter( 'the_content_feed', 'wp_staticize_emoji' );
 remove_filter( 'comment_text_rss', 'wp_staticize_emoji' );
}

Conclusion

That’s it, you are done with the optimization now check your website’s performance score ar GTMetrix.com. I am sure you are much satisfied with the speed. If you stuck somewhere feel free to drop a comment bellow.

Hey, wait!!
Don’t forget to share this tutorial on your social networks.  Thanks for reading 🙂

29 COMMENTS

  1. Hi Amit, I followed all your steps but still have “elements that must be corrected:” do not know where and how to add these images and files so they are cached at least 31 days for example:
    http://sumome.com/api/load/ (not specified expiration time)
    https://shield.sitelock.com/shield/trebol-apuestas.com (not specified expiration time)
    ….

    Here you can see my pagespeed
    https://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F%2Fwww.trebol-apuestas.com%2F&tab=mobile

    You can help me a little more

  2. Thanks Amit for the Tutorial. The object-cache.php returned error and turn my site off. I have set others as stated but the search function seems not working anymore on desktop version. You can check the demo by clicking on my name. What next???

  3. I am using cloudflare and wp rocket for caching and getting like a 98/100 but the search, more from author, infinite load wont work unless cloudflare rocketscript it off which then takes my page load time way up. I downloaded wp super cache and tried your way and I get an F score on gtmetrix. Any idea why?

  4. I did but that doesn’t stop the issues with search, more from author, infinite load not working. They only start working when I disable rocketscript on cloudflare. Doesn’t matter which cache plugin I use.

  5. Hello Amit, I came here from Newpaper forum. Really appreciate your input. Our site mayapurvoice was shown green (score around 85) in Google page speed insight but after upgrading either some plugin/s or the theme itself the speed score plummeted to below 60 (couldn't ascertain the culprit although I tried disabling plugins and stuff.. will try downgrading the theme if nothing works).

    I went through your suggestions and they all make sense to me but I have a question before I install Could flare. Do you know if this plugin doesn't bring a desired result and if I disable and delete it, will it undo the changes it may have done to my theme and other settings? I ask this because one security plugin screwed up my .htaccess file and although I deleted the plugin, it didn't put back my original .htaccess file. Not only that, the plugin didn't even create (or at least I couldn't find) a back up of that file and I had to re-enter some entries manually. Perhaps that also has affected my page speed but I am not sure. On top of that, I spent days before finding it to be the reason for my cron job issues. Anyway that's a side point.

    The number of posts and images on our homepage should not be a real issue as more or less the same were there when it was in green.

    Your input will be useful. Thanks again for the post on Newspaper forum and here.

    • Hello Mayapur,

      I have inspected your site, It's loading fine on my end. All you need to optimize images on your website. It will surely add some positive points to Google page speed score.

      Now coming to the CloudFlare query, it will not damage your site. All you need to follow this tutorial https://goo.gl/1qCXdP

      Installing CloudFlare plugin doesn't change any existing file (.htaccess) on your server.

  6. Hello

    Newspaper 7 recommends disabling Rocket Loader for the incompatibility it causes. What you did to fix this, for example the search button gets error and several other things.

    • Don't over minify the scripts, use CloudFlare alone for the minification. And purge all the cache. If you face image loading issue on successful activation of Rocket loader, reactivating Image load animation (Lazy load) from the theme control panel.

LEAVE A REPLY

Please enter your comment!
Please enter your name here