- NewspaperWP Rocket and Newspaper Theme: Optimization Guide
- NewspaperBest Of Forums
- NewspaperHow to Make the Site Faster
And how about css? Pagespeed said that i could save 20% by minifying style.css, but no minify plugin will minify the themes css file. Is the tagDiv Speed Booster plugin included in the version 2.2? And i never seen anyone mention mod_pagespeed plugin on this forum, what does it so?
Hello,
someone use W3 Total Cache, Minify option?
I am trying to optimize my site using the Minify option, but is not about simple. Any option break the layout, so I trying to use “Manual” minify, and add what “js” and “css” minify and combine.
Someone who use this method, can tell me how files optimize?
Thanks!
Hello,
for javascript we already have the minified versions in js/min . For the rest of the site I would not recomment that you minify the html. It provides minimum gains. Also our users are using the mod_pagespeed plugin for apache (i think there is a version for nginx too).
Hello,
What you can do is to Use W3 Total Cache with enable Page cache, and also use tagDiv Speed Booster plugin enabled.
Other optimizing stuff and suggestions you can read here on our forum: https://forum.tagdiv.com/topic/pagespeed/
Thanks for the message!
I read this interesting topic and decided to do a check myself.
I use wp smushit, wp minify and total cache (page cache as per tagdiv’s instruction)
Google Pagespeed: 88/100 (desktop) and 73/100 (mobile)
GTMetrix: 93 Pagespeed, 76 Yslow.
Historically I always received a much lower grade with Yslow. Guess they don’t like my site 🙂
Now I will experiment with Christopher’s tip with the .htcaccess.
And one tip to others: don’t get obsessed with getting high grades… I’ve been there a couple of months ago… for 2 days I slept at 4 AM trying to figure it out :/ It became an obsession. Spend your time in the nice things of your website 🙂
ooooh, ahhhhh 🙂
I’m suffering trying to do as much on our high speed server with local caching, mod_pagespeed, common stuff cached to RAM and 1GIG dedicated switch to server in SoftLayer with 7 inbound pipes. Pain in butt. Getting there. 🙂
were using w3 cache / div tag speed boost and MaxCDN – 685ms load time is the result
http://postimg.org/image/pl24nqilb/
fix image sizes etc with pixlr.com – save to 80% or lossless / lossy with kraken.io and stay away from facebook plugins that load faces.
Our next step https://www.cloudflare.com/railgun
and not to brag but 98/100 mobile and 98/100 desktop
http://developers.google.com/speed/pagespeed/insights/?url=twoversion.com
Hi, @evdb
glad all the rambling helped 🙂
For those who are trying to work with the “step up” on speed from caching, such as using mod_pagespeed and then an optimized .htaccess code block, I found this article super helpful, and is somebody else who is a couple steps ahead of my efforts with the whole “make the server do the work, not a plugin” mentality.
http://customerhelp.co.za/wordpress/optimizing-linux-apache-for-wordpress-blogs-memcached-mod_pagespeed-expires-headers-mod_deflate-gzip.html
Hmm., @mbasche
that’s kind of cool, actually. Will have to try it and see if it plays nice with mod_pagespeed.
Hoping to NOT have to do any more hacking to templates since I already have to fix something in the main template, the hit counter module (we had existing system and field), and the author name on hack. So, trying not to add anything more to “insert here in code for something” if I can help it.
Will check it out! 🙂
Holiday PageSpeed Fun Report Update!
Just as a pagespeed comment, I was testing mod_pagespeed, vs your tagdiv cache experimental, and W3 with page cache on, and found that mod_pagespeed on server with memcache, optcache and eaccelerator, seem to be about the same effect. What this means for most WordPress folks is quite simple: use a hosting provider that supports mod_pagespeed (e.g., GoDaddy now supports it with htaccess local config options — NOT an advert for them, just anecdotal) may be better option than messing around with all the various plugins that try to replicate that server-side functionality.
To Radu and all … who are wondering about the “render blocking blah blah” errors, this was one of the suggested solutions for WP (note the issue is common to ALL WP themes frankly due to the way the header works for most themes based on “traditional” HTML practice, 2 years ago nobody really cared about this issue!):
(QUOTED from WordPress.org discussion, “wpgeekster”)
The reason you are getting render blocking message from google is because your javascript is being called in the header. In your wp_register_script() function and in your wp_enqueue_script() function you must include true for the $in_footer argument. If you include the $in_footer argument, you must also include all the other arguments.
See:
http://wp.tutsplus.com/articles/how-to-include-javascript-and-css-in-your-wordpress-themes-and-plugins/
http://codex.wordpress.org/Function_Reference/wp_enqueue_script
http://codex.wordpress.org/Function_Reference/wp_register_script
(END QUOTE)
From same discussion:
(QUOTED from “manuelkuhs”)
Here’s what I figured out about how to eliminate all render-blocking JS & CSS:
Install W3 Total Cache
Go to Minify
Use the “help” wizard that you can see as a button near the top
Accept the suggestions without making changes. This will combine all your CSS files into 1, and all your JS files into 1, 2 or 3, depending where you load them (if you load all in the same area, e.g. in the <head>, you’ll only get 1 combined file).
Set all JS to “Non-blocking using Async”.
Now test your site. If everything works, the only blocking CSS/JS file left should be your combined CSS file, and nothing else.
Most likely some JS functions won’t work properly anymore. If this is the case, it gets a bit more complicated.
In this case, try the following:
Remove all the JS files in the Minify settings of W3
Open the source of your functioning page where no JS files are combined and manually add to W3 Minify ONLY the JS files found in the header (since these are the ones “above the fold”) and IN THE ORDER that they exist in your source file. Try this. If it works, try moving them all into the <body> or just before the </body> using the Minify JS settings.
In my case, I had a strange issue whereby combining jquery.js with the other JS files broke many js functions that depend on jquery even though they loaded after. To get around this I made jquery.js load on its own after <body>, and made all the others load combined just before </body>, with everything set to load using async.
Using this method, the only “above the fold” problem I have is the combined CSS sheet.
If your combined CSS is small, you can try inlining the entire thing.
If not, the only way around this that I currently know is to manually inline only the relevant parts of this combined CSS, and then to load the combined CSS in the footer using JS.
(END QUOTE)
Hi, Radu and Marius
one of the remaining annoyances with pagespeed testing appears to be the gravatar, which even with our mod_pagespeed running on server, still shows up with errors in pagespeed tests.
So…. in the old days, it was common to have a user image field for each user, as a hack (which we used to do), to load an author photo into the author box. Or, probably even cooler would be for you to do a capture/cache of the gravatar image locally assigned to the user (if I knew how to code, it’s what I would do, frankly). To refresh when somebody changed their picture, perhaps they would need to delete their /images/authors/ folder or something.
Anyway… not hyper critical with all the other shenanigans folks are asking you about, but having an author image on the magazine site (hence the theme main purpose) without having to ping gravatar every time would be awesome.
Thanks, and happy new year! 🙂
So first of all I’d like to thank you for creating an awesome theme. It really is doing its job on practically every level and so far I’ve encountered only 3 things that do not really suit me.
1. The scroll on mobiles is absolutely horrible for me (tested on Galaxy SII with android 4.1). Instead of going smoothly it’s choppy and requires me to tap the screen repeatedly to scroll up/down. Pointing out that the problem is not only on my site, same thing happens with your demo.
2. My website is in Polish so it requires usage of foreign letters (Ä…, Ĺ‚ etc.). All the letters appear just fine but when I turn on the tagDiv speed booster, the letters suddenly go lowercase arial (they’re just no longer being formatted).
3. Despite enabling the speed booster, google pagespeed is still throwing out that there is a ton of render blocking js/css (especially on mobile).
If you could help me resolve those 2 issues, I’m honestly giving 11/10 to this theme. Will immensely appreciate it!
Hi, just as an aside the site with both comment systems has an awful Google PageSpeed score of “73” which having both comment systems impacts. On the other hand, if it’s a way to interact with audience, why not? Just be aware that’s an awful experience for mobile users waiting for both systems to instantiate. 🙂
You can place videos anywhere in your post, as this is a normally supported function of WordPress via oembed. You only have to place video on top if doing “featured video” which is useful when you don’t have a photo (really only reason to do that, or if you had something like a music video gallery).
Always good idea to check all the wonderful tutorials provided by WordPress on how to use WP, such as how to insert videos:
how-to embed videos on ANY WordPress site regardless of theme:
http://codex.wordpress.org/Embeds#In_A_Nutshell
basically all you do is in your post do
check out this cool video
http://youtu.be/videoIDhere is example of how we do this on our site
http://ga-ga.com/1245/stone-solid-hooks-reflections-da-blooze/
so, upshot you only “have to” have video on top when you choose the featured video template; otherwise just do normal post, and drop in your videos anywhere you want in text.
Here is an example where we put two videos at bottom of article:
http://ga-ga.com/1125/musical-high-verheyen-studio-great-carl-verheyen-consistently-wows-crowds/
Hope that helped. 🙂
As to using both DisQus *and* the FB comment box; I would *not* advise that since Disqus can support login via Facebook, you will need to likely avoid that option, otherwise you might get two “call backs” to FB and this will kill your site loading time and PageSpeed, if you care about that. It it works, would love to see it! 🙂
HI
it’s in the folder with your theme when you downloaded “all files” off themeforest.
I think it’s
newspaper-tf/plugins/td-speed-booster.zip
disclaimer:
“tagDiv speed booster is still in beta! Currently it is affecting the theme customizer and probably some plugins. This plugin is for advanced users only. We are still working on it.
~ Radu”
HI, folks
for many of you (including us), we wanted to use slightly different method for the social media buttons at bottom of the post in the theme, and for some reason with the default theme setup and using Yoast SEO plugin, the Pinterest image would never populate even with all the Pinterest-friendly code in the head of the theme.
So, starting playing with using the WP AddThis plugin, however its main flaw (and those folks are really dumb in not updating to include the async code which EVERYBODY has been requesting for the pat year – and which can be easily fixed).
Finally, I took look at plugin and sorted out how easy it is to “hack that” for your site. While there are many choices for plugins, or managing “on page” code, we’ve found over the past five years, that the AddThis plugin when used async mode, actually is very consistent and doesn’t adversely impact our pages. Your mileage may vary. Still, think about how many websites have those little orange [+] buttons for sharing and AddThis has big installed base.
So, here is how to do this – was going to post this in my blog, and will later, but redoing my website right now and well, I just hacked our Newspaper theme site to do this, so thought I’d pass it along.
This assumes you will
1) turn off the social media option in the control/customizer panel for the theme, on posts.
2) download the AddThis plugin v 3.5.6+ (the one from the AddThis company) and open file in the plugin folder to edit one line;
3) upload the modified plugin to your /wp-content/plugins/ folder via FTP
4) activate plugin
5) choose settings for plugin as to whether you want the pill buttons with balloons showing number of shares/likes, or the speedier share buttons without the “phone homes” to get read/share numbers (which slow down your website and pagespeed, btw).
So, once you have plugin:
in the folder, you’ll be editing this file:
addthis/includes/addthis_addjs.php
You can edit in notepad, simpletext, or whatever (I use the awesome TEXTPAD 5 on Windows7); do not edit in a word processor like Pages, or OpenOffice, MS Word, etc.
around about line 166-167 you will see this:
function addWidgetToJs(){
$this->jsToAdd .= '<script type="text/javascript" src="//s7.addthis.com/js/'.$this->atversion.'/addthis_widget.js#pubid='. urlencode( $this->pubid ).'"></script>';
}and you will simply change to: (YOURID is your publisher id you get when creating an AddThis account, which is free; includes tracking if you want that, zero cost, and no impact on SEO or link pollution). If you have no publisher ID, simply remove #pubid=YOURID — IMPORTANT, do *NOT* put in a publisher ID in the AddThis WP control panel as you’re manually over-riding the insert variable here.
function addWidgetToJs(){
$this->jsToAdd .= '<script type="text/javascript" src="//s7.addthis.com/js/'.$this->atversion.'/addthis_widget.js#pubid=YOURID#async=1"></script>';
}To see this in action:
http://ga-ga.com/1204/beginning-adventure-space-time-reveals-roots-doctor/
Using this hack as of 12.25.13, but if you’re reading this a year later, we might be doing something totally different (view ‘source code’ for page to see whassup).
Hope tha helped somebody.
Once I get our server moved, and my website updated for our main company, my wordpress blog will be back, and I’ll include link to that for more of my little tidbits of tips.
HAPPY HOLIDAYS!
mehedi,
see how Radu got the demo to the pagespeed
https://forum.tagdiv.com/how-to-make-the-site-faster/
“speed” is a process which requires many tools to accomplish, no one theme “magically” has high pagespeed. YOU need to research and implement many things separate from the theme to achieve a high pagespeed ranking, including NOT using various things like adsense, or plugins which “dial out” to get resources. But, if you follow the link above, Radu explains how they optimized the demo site.
You should also read through this thread, as you may need to update your htacess file for expiration headers, optimize your images, etc.
hey guys! my site is not doing good in speed!! I don’t knw why? but can anyone help me? thanks. my site is: http://www.techierevive.com
check out the spped: https://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F%2Ftechierevive.com&tab=desktop
HI,
if you’re using a cache plugin with “page cache” on that should work.
Many hosting providers also run caching software of varying kinds, but not all websites may have that function depending on plan and how they setup VPS or containers for different customer classes. eacclerator, optcache, memcache, etc.
The .htaccess file goes in the root of your public document area (e.g., httpdocs/yoursitename/public – same place that wp-content lives), and is more easily seen with an FTP application that can show hidden files ( .htaccess is the file name – the dot makes it hidden ). Or, if you’re using something like YOAST SEO, there is an “edit files” option to make additions to the file (which is what I do). It is there, as WordPress writes it’s “rewrite” rules to that file. In your web hosting account there may be a “file manager” which would let you edit it, also.
Smush.it is the popular choice, however it only works on new files not existing ones. I think “regenerate thumbnails” may work when smushit is on, but check the help support on that for those plugins.
What amazes me are the problems you and I can’t do much about
a) issues with Google AdSense
b) issues with social media elements
c) issues with recaptcha (I just turned this off); powered by Google
d) issues with Disqus or any comment platform including the one from automatic
The most hilarious issue is that we installed Google’s “mod_pagespeed” system on our web server, and now it’s saying that there is a PageSpeed error since PageSpeed inserted three 1×1 pixel graphics and isn’t specifying their height and width.
Seriously?
So, basically from my experience wrangling this the past few months, if you want to know your real pagespeed run it with
1) ads off ! You will get pagespeed errors from Google ads.
2) social media off – you will get error from twitter
3) if you use Addthis, as we do – you need to hack the plugin to add the #async=1 option at end of javascript string.
It’s a process that will end up being frustrating at some point. No way around issues with Google’s own products generating errors. SO, they penalize page speed for using their services. Crazy.
Hello Christopher,
I read all forum messages already and still do have some problems:
1. WP Total Cache: the widget NEXT PREV AJAX ain’t working, so I installed WP Super Cache
2. Where can I put the .htaccess code into my WordPress? I can not find the .htaccess file.
3. Aks my provider for caching: whats the differences between WP Super Cache and asking them?
4. I use Bulk Smush.it to minimize the pictures size. Its ok?
ALSO:
take some of Google’s “recommendations” with a grain of salt….
for a test page,
http://ga-ga.com/1277/12-songs-christmas-surprising-secrets-seasons-popular-tunes/
here is one of their ‘errors’ – note the page response time … 0.32 seconds (okay, we have a server response time of 1/3 of a second … oh no…… so sloooow!!) <LOL>
[!] Reduce server response time
In our test, your server responded in 0.32 seconds. There are many factors that can slow down your server response time. Please read our recommendations to learn how you can monitor and measure where your server is spending the most time.
just a fun thing to try for those who don’t want to go through either Radu’s recommendations for optimization as well as my various notes in this forum, you might try Google’s currently free while in beta (basically it is free now, and may be free for years, or might be free for personal sites in 3 years but paid for commercial purposes)…. upshot you can have Google re-render your pages on the fly with their mod_pagespeed module in the cloud for your website for free:
see if this might be an option for some of you
https://developers.google.com/speed/pagespeed/service
this same system is used by the various “custom wordpress high speed hosting” companies out there (and I’m literally right now testing it on our new web server!).
If at some point in future Google charges for this, it might be something like $100 per year based on what they charge for their custom search tool for websites.
However, they have a neat tool to compare your site now vs what their system would do for you. Pretty cool stuff, really. An option for those unable to wrangle their own site properly. 🙂
