The Need For Mobile Speed

Improving Mobile Speed

mobile speedMobile Speed is important! As much as it pains me to say this, if we want to get more traffic we need to keep Google happy. Failing this would cause us to lose our standing in the search engine causing a huge drop in traffic resulting in less income. And we don’t want that do we.

I’ve written several posts on how to boost the speed of your WordPress blog. One of the later ones was when I moved to Inmotion Hosting a VPS host because a shared hosting was just too slow. That post was called WassupBlog Now Hosted On A VPS Host. Yeah, I come up with some killer titles :tongue_laugh_ee:

I followed that post with How To Optimize Your WordPress Blog. Although I would have been more than happy to leave it at that I happened to come across one of Mitch’s Mobile Friendly vs Mobile-Speed post. I already knew my blogs are mobile friendly because I use Flexsqueeze. I assumed that the mobile speed would be the same as the desktop speed but alas, this is not the case.

This post is about increasing the mobile speed of my Best Online Sports Betting blog. Unfortunately I didn’t take a screen shot of the results before I started updating the mobile speed of that blog but I did leave a comment on Mitch’s post and it was 60. The image below shows the current speed after all my tweaking.

need for speed mobile

Pretty good huh? You can see how your site scores by clicking this link.

How To Improve Your Mobile Speed

The first thing you need to do is to find out what Google thinks is hampering your mobile speed. You do this by using Google’s Page Speed Insight tool. That will score your site as well as tell you what’s wrong with it and what you need to do to make it better. The order you tackle that is up to you. I decided to tackle the easy things first.

Optimize Images

This came under the ‘Consider Fixing’ category. I was surprised to see that because I thought all my images were optimized because I use the EWWW Image Optimizer

The good thing about Googles Speed Insight tool is that it actually shows you what needs to be fixed. In the case of the images it gives you actual links to those images. A lot of my images were images used in my theme. I downloaded one directory at a time, optimized all the images in that directory using TinyPNG and then uploaded it back to the server. That increased my mobile speed a little.

Unfortunately a lot of those images were from my affiliate sites which I had  no control over. Why they don’t use optimized images is beyond me. I decided to host all those images myself  and my speed increased a little more once I optimized them.

Leverage Browser Caching

Once I fixed the Optimize images problem I tackled the the leverage browser caching issue. I thought that was being handled by my Comet my caching plugin but it seemed it was falling somewhat short so I decided to try a different one. Enter WP Fastest Cache. That improved it a little more but created a .css issue. Still, the speed was improved. They had a paid premium version with a mobile function so I decided what the heck and bought it. Another speed increase.

Again some of the stuff was out of my control because they were being caused externally via affiliate links etc. Wherever I could I tried to resolve those issues resulting in another speed increase.

Minify JavaScript

Where the caching plugin could fix the JavaScript found on my blog it can’t fix external JavaScript which once again was coming from affiliate links. They use JavaScript in order to keep a record of stats. I decided speed was more important than stats so I opted for simple affiliate links.

Eliminate render-blocking JavaScript and CSS in above-the-fold content: A lot of this was taken care of by WP Fastest Cache but like I said earlier it created a couple of internal .css issued. The solution was installing another plugin, Autoptimize. After a lot of tweaking of that plugin I got the results you see in the image above.

The only things I couldn’t resolve were under the leverage browser caching; (expiration not specified) (20 minutes) (2 hours)

I could easily fix the first two by removing the Simple Share Button Adder but I decided the potential shares were more important than the small speed increase. As for the Google analytics issue, you would have thought that Google would have chosen to ignore that seeing as how they were causing it in the first place right? :wallbash_tb:

Google Fonts issue: My issue with Google Fonts, which is apparently built into WP, was a bit of a pain. Luckily Autoptimize was able to resolve that for me as well.

WP Speed and .htaccess: In your search for mobile speed you will probably come across a lot of sites that tell you to change your .htaccess file to allow for gzip compression or whatever. Your caching plugin should do that for you. I didn’t have to change mine at all.

As I said at the beginning of the post, all this came about because of my mate Mitch. I linked to the first of his quest for speed in the beginning of this post. You may also like to read The Quest For  Mobile-Speed Two and the Quest For Mobile-Speed Three.

What’s the mobile speed of your site like?

Digiprove sealCopyright secured by Digiprove © 2016

How To Secure Your WordPress Blog From Hackers

I really like the guys at Inmotion Hosting. Normally when your blog get puts a huge load on their server the host usually shuts you down. The then send you and email and tell you to fix the problem. On the weekend I was notified that Ez eSports Betting had suffered a brute force attack! Instead of the usual “Hey dude, your site is stressing out our server fix it or else” email the guys at Inmotion Hosting they temporarily disabled the login script.

Secure WordPressThis is so much better than taking your blog offline as you’re the only one affected. As for everyone else business goes on as usual. They also provided a link as to how you can prevent these type of attacks. As I wanted to make my WordPress blog as secure as possible I took their advice.

Secure WordPress From Devilish Hackers

As you can see I produced a step by step video as to how you can secure your WordPress blog from hackers. As some brute force attacks focus on your wp-admin and wp.login.php scripts the following fixes will require them to provide a username and password before they can have access to your wp-admin! This takes all the stress off the servers making for happy hosts, secure WordPress sites and disappointed hackers.

I give credit where credit is due so I’m going to link to the tutorial that helped me to secure my blogs. Now where there is nothing wrong with that tutorial there was a couple of points that I misunderstood which caused me some issues. My fault not theirs! So, I thought it a good idea to do my own version in the hope that other non techies can benefit from it.

Note, this will only work on self hosted WordPress blogs that have access to cPanel.

Secure WordPress Login Steps

Note, you should always make a backup of any file before you edit it.

  1.  Click on Password Protect Directories found under your security section of cPanel
  2. Select your document root and then click on go.
  3. Click on the wp-admin directory
  4. Check Password protect this directory, give it a name, then click save
  5. Click on Go Back
  6. Now select a strong username! I like to think of my username as an extension of my password. Not using your actual name or easy to guess words makes it that much harder for hackers to infiltrate your security
  7. You can use the password generator or invent your own difficult password. Use uppercase, lowercase, numerals and other characters to make your password as difficult as possible. My password always have more than 10 characters which I store in my password manager.
  8. Once you’ve entered your username and password you click Add/modify authorised user. If you now try to login to your wp.admin you will be prompted with a username and password screen.
  9. Now go back to cPanel and click on File Manager, Select the Document Root for your domain. Check Show Hidden Files (dotfiles), then click Go.
  10. Click on you wp-admin directory, highlight your .htacess file and click edit. Then add the following code to your .htaccess
    ErrorDocument 401 "Denied" ErrorDocument 403 "Denied" # Allow plugin access to admin-ajax.php around password protection <Files admin-ajax.php> Order allow,deny Allow from all Satisfy any </Files>
  11. Just in case you’re wp-admin doesn’t have an .htaccess here’s mine in it’s entirety.
     ErrorDocument 401 "Denied" ErrorDocument 403 "Denied" # Allow plugin access to admin-ajax.php around password protection <Files admin-ajax.php> Order allow,deny Allow from all Satisfy any </Files> AuthName "WPSecurity" AuthUserFile "/home/edit/.htpasswds/public_html/wp-admin/passwd" AuthType Basic require valid-user 

    Note, where mine says edit you would put whatever is that part of your cPanel as highlighted in the video. Don’t forget to click on save once you’re done.

  12. OK, now from the left-hand directory listing, click on public_html. Right-click on your .htaccess file, then click on Edit.
  13. Now paste the following code to your .htaccess
    ErrorDocument 401 "Denied" ErrorDocument 403 "Denied" <FilesMatch "wp-login.php"> AuthType Basic AuthName "Secure Area" AuthUserFile "/home/edit/.htpasswds/public_html/wp-admin/passwd" require valid-user </FilesMatch>

    Once again don’t forget to replace the ‘edit’ part of my code to reflect the information in your cPanel. When all is done click on save.

Your WordPress blog is now so much more secure than it was before you started this little exercise. Having said that there is one more bit of code that you add to make it even more bulletproofed. Once again Inmotion Hosting provided me with the solution to “limit WordPress admin login attempts by IP address, or referrer.”

As my IP is always changing I went for the “you can protect your WordPress site by only allowing login requests coming directly from your domain name. Simply replace with your own domain name

Most brute force attacks rely on sending direct POST requests right to your wp-login.php script. So requiring a POST request to have your domain as the referrer can help weed out bots.”

Here is the code to add to your .htaccess, the one you’re just finished editing.

ErrorDocument 401 "Denied" ErrorDocument 403 "Denied" <FilesMatch "wp-login.php"> AuthType Basic AuthName "Secure Area" AuthUserFile "/home/edit/.htpasswds/public_html/wp-admin/passwd" require valid-user </FilesMatch> # WordPress Security <IfModule mod_rewrite.c> RewriteEngine on RewriteCond %{REQUEST_METHOD} POST RewriteCond %{HTTP_REFERER} !^http://(.*)? [NC] RewriteCond %{REQUEST_URI} ^(.*)?wp-login\.php(.*)$ [OR] RewriteCond %{REQUEST_URI} ^(.*)?wp-admin$ RewriteRule ^(.*)$ - [F] </IfModule> # End WordPress Security

The new code is the one between the #Wordpress Security tags. Just make sure you replace with you’re own domain.
That’s it! Your WP blog is now a lot securer than it was. I’ve even deleted my “limit login attempts” plugin as it’s no longer needed removing some of the strain placed on my server.

I hope you’ve found this post useful. If so why not share it around. :smoke_tb:

Digiprove sealCopyright secured by Digiprove © 2015

Changing The Category Header On Your WordPress Blog

Do you remember the post I did on Changing The Headers On Your WordPress Pages? I was thinking the other day about how cool it would be to have different category headers for my blogs. Well, now that I’ve updated to FlexSqueeze2 I’m able to change the headers on my categories as well! How cool is that?  :drunk_tb:

Why Change Your Category Header?

Why changer your category headers? I’m so glad you asked.  :tongue_laugh_ee:  To me the most important reason for changing the image of your category headers is it shows your readers right from the start what each category is all about. They don’t say a picture is worth a thousand words for nothing you know.

Category header Victoria-Sports-Jokes-mobile

Then there is also the added SEO benefit. You get this by giving your header the appropriate SEO related (by using your keywords) name. Another reason I like is it makes my blog stand out from the rest by being different.

Apparently there is a plugin that does this but my blogs are already plugin top-heavy.

Anyway I’ve produced a video that shows just how easy it is to have different category headers. Just follow the easy steps listed below.

Steps To Having Different Category Headers

  1. First you have to design your header. I used The Logo Creator to make mine. It’s best to keep to the same dimensions as your original header.
  2. Next you upload it to you images directory.
  3. Then you go to the category section of your WordPress blog, (found in posts / categories) and click the edit button of the category that you want to have a new category header. When there look in the url for the ‘ID’ number and copy it down.
  4. Next go to your FlexSqueeze options and click on Custom CSS Settings. Once there you paste the following code.

    .category-29 #header {background-image: url(;}

    Note the ID in red and the url to your image in blue!

  5.  Next we paste the following code to remove the blogs title and tag line.

    .category-29 #titlelogo {display:none}

Once again note the category id in red.

I’ve also changed the category header on my Hot Sports Babes category. In time I hope to change all the category headers.

How To Change The Category Headers Of A WordPress Blog

That’s pretty well it. Once that is done you simply clear any cache plugin and you’re good to go.

Stay tuned for some of the other unique features being enjoyed by all FlexSqueeze2 owners.

Digiprove sealCopyright secured by Digiprove © 2015

About Peter Pelliccia"