How To Display Google Adsense Using WordPress Widgets The Right Way?

Let us learn how to install & display Google Adsense ads using WordPress widgets without repeating the Google Adsense script.

One of my friends has a moderately big WordPress news blog and the load speed was awefully slow. He had asked me to see if I can help with loading pages faster.

One of the things I found to speed up his blog was to reduce the number of HTTP requests and by deferring Javascripts.

Google Adsense ads is his primary source of income and I was shocked by the way, he used the Google Adsense code, in his blog. I told him that there is a better way to use Google Adsense code in WordPress and here I’m writing this blog post.

If you’re likely to follow along, I assume that you already have a Google adsense account and you’re familiar with WordPress widgets.

Let us say, you have the following code from Google Adsense dashboard.

The adsbygoogle.js is a common Javascript file that is required on all the pages where you want to display the ads. So this should be made to load only once on the web page.

Rather than using the <script> tag directly, we must use WordPress’s wp_enqueue_script function to include scripts on the page.

Now that we have our Google adsense javascript enqueued, we can go ahead and use the ad snippet on WordPress widgets.

If you’re using WordPress 4.8+, remember to paste the code in ‘Text mode’ under ‘Text’ widgets.

Using Text Widget to server Google Adsense Ads
Using Text Widget to server Google Adsense Ads
Using Text mode under Text Widgets
Google Adsense Ad being served
Google Adsense Ad being served

Tada! We have set up everything for our Adsense script to start serving ads. In addition to this, we could defer loading the script, so that we can avoid the ‘Render blocking Javascript’ issue. Google has developed an online tool – Google PageSpeed Insights that will help you identify other such issues in your website.

Learn more about the differences between defer and async attributes here.

How To Hide Opt-ins In WordPress Using jQuery?

In this post I’ll share how I managed to hide an Optin, that did not hide as expected even after changing the settings in the OptinMonster plugin.

I’ve been working on one of the WordPress projects, that uses OptinMonster a lot. If you’re new to OptinMonster, then checkout OptinMonster’s website to learn what it is and what you can do with it.

What Problem Did I face?

The client wanted to show Optins only for logged-out Users yet the Optins’ were popping up even for logged-in users. Normally, we can use Optin Monster’s output settings to hide Optins to logged-in users. But in my case, this did not happen and the Optins continued to pop up for all users.

How Did I Solve?

Having tried the display settings in the Optin Monster plugin, I found from their docs that I could use their Javascript events API to stop Optins from popping up. I plugged the following snippet only to logged-in Users using wp_enqueue_script function and Conditional tags.

This snippet will be handy if you happen to deal with Optins that are real monsters.

How To Disable JetPack SSO In Local/Staging Site?

Are you unable to login while setting up a development environment from a production site that uses Jetpack’s Single Sign On(SSO)?

I was trying to set up a local (development) site for my personal blog. Since I enabled Jetpack’s SSO, the local site redirected to SSO page and took me to my live blog’s Dashboard page. So, I was looking for a way to disable Jetpack’s SSO.

Here is how to disable Jetpack SSO and login to your local/staging Admin dashboard.

Step 01: Disable the Jetpack plugin

You can rename the Jetpack plugin folder and this will disable the plugin without logging into the Admin dashboard.

Step 02: Access the login page

Once you disable Jetpack plugin, you can access the /wp-login.php (login page) of your local site.

Should You Unit Test Private Methods Of A Class?

Have you wondered if you have to write unit tests for private methods of a class? In this post, I’ll answer that question for you.

This question is answered with the context of WordPress in mind. But this serves as a general rule, irrespective of the language.

I fell in love, once again, with WordPress so much that I started contributing to few open source projects.

I began my contribution by fixing small bugs. Lately, when I was writing test cases for a WordPress plugin, I had this question, “Should we write unit test case(s) for the private methods of a class?”

I didn’t have an answer for a moment, but then I figured that the private methods are used by the public methods. By writing test cases for the public methods of a class, we cover testing the functionality of the private methods. So the answer my question is ‘No, we don’t have to write unit tests for private methods of a class’.

What Should You Do If A Private Method Warrants Testing?

Even after covering the public method that uses the private method, if your private method warrants test to cover, then you should probably think of breaking the private method into smaller units. The basic rule is that a function must do only one specific thing.

In order to verify my understanding, I did a quick Google search and found that Brian, a software developer, had mentioned the same in his blog.

My First Pull Request

In this blog post, I’ll share with you how I ended up sending my first pull request in GitHub.

It all started with my eagerness to learn how WordPress sites and plugins are built. Learning becomes more and more challenging until we actually work on a technology we wanted to learn. So I decided to get my hands on WordPress.

Since I’m working full-time, I decided to spend few hours a week to learn and improve my WordPress skills. To begin with my learning journey, I started looking to work on a small WordPress project.

My exploration ended when I found an opportunity to work on a (tiny) bug in a WordPress plugin called Easy Retweet. This plugin allows you to add Tweet button to your WordPress site and it was originally developed by Sudar, a prominent web and WordPress developer.

Now that I have found a project, I had to set up my development environment to work. I remembered using Xampp to set up my development environment when I played with WordPress during college days. So Xampp was my preference.

But Sudar, the plugin author, recommended to use Vagrant and VVV to set up the environment. Honestly that’s the first time I’m hearing about Vagrant and VVV. Through repeated trial and error, I had finally set up my development environment using Vagrant and VVV. It took me a week though, to set it all right in my Windows machine.

Now that my development environment is ready, I have to get the actual plugin code to start working on it. Easy Retweet plugin (repo) is hosted at GitHub and I’m a total newbie when it comes to Git and GitHub. Thankfully, DevTipsShow and C0deporn YouTube channels helped me to quickly get started with both.

I forked the plugin repo and started to work on the plugin. Forking is creating your own repo to work on from the original one. After a couple of hours, I was able to fix the issue. The feeling you get when your code works as expected is almost beyond words.

After my changes are complete, I had to intimate the author and request to merge my changes with the original repo. In the GitHub world, this is called sending a pull request. That’s how I finally ended up sending my first pull request.

When my pull request was merged, I felt so excited and welcomed to the open source community.

I’m writing this post not to brag about how I did things, but as a reminder to myself to keep learning the web technologies as they evolve.

Now it’s time for me to hear from you. Have you sent your first pull request? If yes, then share your story and I would love to read.

Otherwise consider making your first contribution to the open source. If you need some resources to get started, check out As the name says, it is an initiative by Scott Hanselman and Kent C. Dodds for the first timers to take their baby steps towards open source.

What Should You Do After You Install WordPress?

Here is my favorite list of things to do right after the installation of WordPress to tighten the security and to improve the performance of your WordPress website or blog.

Have you ever wondered what should you do after installing WordPress? Before you hit the publish button for the first time, consider tweaking the following settings to improve performance and to harden the security your WordPress website.

I have sectioned the article based on where the settings have to be tweaked.

  • Tweaking settings in WordPress Admin Dashboard
  • Tweaking settings in (you read it right!)
  • Tweaking .htaccess file
  • Tweaking your themes’s functions.php file
  • Tweaking robots.txt file

Tweaking settings in WordPress Admin Dashboard

1.Change Your Site Title, Tag Line and Time Zone

Titles are the first thing that a person sees about your site in Google search results.

Patrick Sexton

Site titles and taglines are used to describe your website and are visible in search engine results when people search for your website. Site title generally describes your business name and tagline describes about your business in few words.

You can change site title and tagline by navigating to Admin Dashboard → SettingsGeneral.

Change Site title, tagline and timezone in the WordPress dashboard

In most themes, the site title and the tagline together becomes the content of the title tag. Generally, it is advisable to keep the content of the title tag short and preferably less than 70 characters as part of the search engine optimization.

Here is a guide to write better site title and tagline for your WordPress site and few tips to enrich your site title and taglines with keywords for search engine ranking.

Setting proper timezone is essential if you prefer to schedule your WordPress posts for auto-publishing. This setting ensures that the post is published at the expected time.

You can change the timezone settings in the same screen (Admin Dashboard → SettingsGeneral). Timezone settings are specified in UTC format and you can use an online converter to identify your timezone in UTC format.

2.Change Your Permalink Structure

WordPress Permalink settings helps you modify the structure of your URL’s. The default WordPress permalink structure is This structure gives no clue about the page either to your visitors or to search engines.

Consider an URL for example, This URL states that the page is about things that you should do after installing WordPress, even before visiting the page. Both your visitors and search engines will engage more if WordPress permalinks are descriptive rather than clueless numbers.

So it is advisable to have pretty URL’s like the one shown above. You can change the WordPress permalinks to a lot prettier structure by heading to Settings → Permalinks.

Change WordPress permalink structure from WordPress Admin dashboard

Yoast’s guide to WordPress Permalinks will help you find a permalink structure suitable for your website or blog.

3.Move out the Media Folder

Amit Agarwal from suggests to move the default WordPress media folder (wp-content/uploads/) to a sub-domain to improve performance.

In order to achieve this, you need to create a sub-domain (ex. Once you create a sub-domain, create a folder to store your media files in your sub-domain and note the relative path to this folder.

For example, create a folder named 'Uploads' in your sub-domain. This way it becomes easier to back up. Also, your URL looks a lot cleaner with this structure.

If you had done it right, your URL will look like and your relative path will look something like public_html/your-domain/your-folder-name.

WordPress 3.5 removed the option to change the media upload path and URL. But you can use the Upload Url and Path Enabler plugin to enable these settings. Once you install and activate the plugin, the following two fields will be visible under Admin Dashboard → Settings → Media

Add Upload URL and Path Enabler plugin

Upload URL and Path Enabler plugin settings menu

  • Store uploads in this folder – /home/your-sub-domain/your-folder (Note: no trailing slash)
  • Full URL path to files – (Note: no trailing slash)

4.Enable JetPack authentication

JetPack authentication off-loads the user authentication from your server and allows users to login your self-hosted WordPress via

Download and activate the JetPack plugin. Once you activate the plugin, JetPack asks you to connect to Click on 'Connect JetPack' to connect JetPack to your account.

Install JetPack by plugin

If you don’t have a account, you will be provided an option to create an account. You can then connect JetPack with

There are two steps involved to enable JetPack authentication.

  • Once connected, head to Dashboard → JetPack and enable Single Sign On under the Performance & Security tab.
  • After enabling Single Sign On, go to Settings under JetPack tab in the dashboard to configure Single Sign On. Click on the Configure link and check the 'Match by Email' check-box. Click on 'Save Changes' to apply the changes.

Activate Single sign on from JetPack settings menu

Single sign on configuration page

Hoo Hooh.. Congratulations, you have successfully enabled JetPack authentication for your WordPress website.

When you head over to your login page (, you should see a 'Login with' button in your WordPress login form.

5.Install Yoast SEO plugin

Yoast SEO plugin can greatly help your WordPress website with search engine optimization.

Here is a YouTube video that walks you through the Yoast SEO plugin settings and you can customize it based on your needs.

6.Generate SiteMap

Sitemaps help search engines to index your website better. You can use Yoast SEO plugin to create sitemaps.

In order to create XML sitemaps using Yoast SEO plugin, navigate to Admin Dashboard → SEO → XML Sitemaps

If you don’t prefer to use Yoast SEO plugin you can still generate sitemaps using Google sitemap plugin.

7.Schedule Backup

Backup is very crucial for your WordPress website. Whether you wish to move to a different hosting provider or your website is hacked, restoring your website is impossible without a proper backup.

ValutPress from Automattic does a wonderful job when it comes to backing up your WordPress website or blog. But this is plugin is not free and it is worth every penny.

8.Use A Cache Plugin

WordPress recommends to use a caching plugins like W3 Total Cache or WP Super Cache to improve the performance of your WordPress website.

9.Delete Unused Themes And Plugins

As part of the WordPress housekeeping, ensure to remove unused themes and plugins once in every 3-6 months. Remember, you should never delete the default theme that comes with the version of your WordPress.

Tweaking WordPress Config File

10.Disable File Editing Inside WordPress

Disabling file editing inside WordPress saves you from worrying when an unauthorized person gains access to your WordPress website.

By default, WordPress allows you to edit your theme and plugin PHP files. You can disable this by including the following line in your wp-config.php file.

/** Disable file editing inside WordPress */
define('DISALLOW_FILE_EDIT', true);

You can find the wp-config.php file in the directory where you installed WordPress. All changes to wp-config.php file must be done above the following comment

/* That's all, stop editing! Happy blogging. */

Your Theme’s functions.php File

11.Turn off WordPress Login Hints

WordPress by default shows login hints when incorrect credentials are entered. This information is a security threat and we can stop WordPress from showing them.

Open your theme’s functions.phpfile and enter the following lines.

/** Disable WordPress Login Hints **/
function no_wordpress_errors(){
	return 'GET OFF MY LAWN !! RIGHT NOW !!';
add_filter( 'login_errors', 'no_wordpress_errors' );

12.Remove WordPress Meta Information

Meta tags provide information about your web pages to search engines.

However, there are few unnecessary meta information that WordPress provides by default, that might expose information that are unnecessary and vulnerable in the hands of a potential hacker. So, it is necessary to remove these meta tags from your website.

Add the following code to your theme’s functions.php file to remove the unnecessary meta tags.

remove_action( 'wp_head', 'feed_links_extra', 3 ); // Display the links to the extra feeds such as category feeds
remove_action( 'wp_head', 'feed_links', 2 ); // Display the links to the general feeds: Post and Comment Feed
remove_action( 'wp_head', 'rsd_link' ); // Display the link to the Really Simple Discovery service endpoint, EditURI link
remove_action( 'wp_head', 'wlwmanifest_link' ); // Display the link to the Windows Live Writer manifest file.
remove_action( 'wp_head', 'index_rel_link' ); // index link
remove_action( 'wp_head', 'parent_post_rel_link', 10, 0 ); // prev link
remove_action( 'wp_head', 'start_post_rel_link', 10, 0 ); // start link
remove_action( 'wp_head', 'adjacent_posts_rel_link', 10, 0 ); // Display relational links for the posts adjacent to the current post.
remove_action( 'wp_head', 'wp_generator' ); // Display the XHTML generator that is generated on the wp_head hook, WP version

13.Turn on two-step authentication using JetPack

Two-Step authentication enables an additional layer of security for your WordPress website. You can enable two-step authentication by visiting Login with your credentials and go to your profile by clicking on your avatar in the top right corner.

From your profile page, click on Security menu to enable two-step authentication. This is a simple process and you can easily enable two-step authentication.

Hooray! A big sigh of relief. Now your WordPress website is double secure.

Also, disable the default WordPress login form permanently and restrict users to login only via Single Sign On using This adds another layer of security. But this would require all of your existing WordPress users to create an account on

To permanently disable WordPress default login form, add the following line of code in your theme’s functions.php file.

/** Login via **/
add_filter( 'jetpack_sso_bypass_login_forward_wpcom', '__return_true' );

HTAccess File

14.Disallow Directory Listing

It is definitely a bad idea and a security threat to list files and folders when people browse your website. Depending on your web hosting, directory listing might be turned on/off by default.

In order to turn off directory listing, add the following line to your .htaccess file in your web host’s root folder.

Options -Indexes

Also, make sure to include a blank index.php file in your themes (/wp-content/themes/) and plugins(/wp-content/plugins/) folder.

Robots.txt File

15.Prevent Indexing Of Core WordPress Directories

Use a robots.txt file to disallow web pages that are not intended to be indexed by web robots. You can use a text editor like Notepad and create robots.txt file.

It is a best practice to disallow the following directories to be indexed by web robots.

User-agent: *
Allow: /wp-admin/admin-ajax.php
Disallow: /wp-admin
Disallow: /wp-content/plugins
Disallow: /wp-content/themes
Disallow: /wp-includes
Disallow: /readme.html

After you create the robots.txt file, place it in your root directory of your domain.

Please do leave your WordPress optimization tip as a comment below and I would love to hear from you.


Photographs font & grunge canvas are used in images.

How To Run WordPress On Your Local Windows Computer?

Installing WordPress on your local machine will improve your WordPress workflow despite you being a WordPress user or a developer. Let us learn how to install and run WordPress step-by-step on your local Windows machine.

Are you a WordPress user? Do you think it is a good idea to mess with your website which is used by your target customers or visitors? It is definitely not a good practice to do so.

But, what if you wanted to make some changes to your website/blog or wanted to play around with different themes and plugins? Wouldn’t it be nice to preview the changes, before you modify the actual website or blog?

In order to do that you either need WordPress running on a domain other than your actual WordPress site or on your local machine.

You can develop and test your WordPress website or blog on your local computer without spending a penny. Also, It saves you lot of time along the way.

In this blog post, let us learn how to install and run WordPress on your local computer.

I have divided this entire process into two sections

  1. Installing WampServer
  2. Installing and running WordPress

Installing WampServer

Why Do We Need WampServer?

WordPress runs on web servers that support PHP with version 5.6 or greater, MySQL with version 5.5 or greater and mod_rewrite Apache module. This might change as the WordPress core is updated and you can learn more from the on the requirements.

Now we know, we need a web server that supports PHP and MySQL, in our local computer to run WordPress.

WampServer allows us to create a server type environment from the comfort of our local computer. We can also achieve this setup by installing Xampp. But personally, I prefer Wamp, as it is very easy to use.

What Is WampServer?

WampServer is a web development platform for Windows machines. It is a software stack consisting Apache, PHP and MySQL. WampServer also includes PHPMyAdmin, an interface that lets you to easily manage MySQL databases via browser.

Wamp Server website

Let us install WampServer and get started with WordPress. At the time of writing this tutorial, WampServer 2.5 is the latest version and it includes PHP 5.5.12 and MySQL 5.6.17.

Step 01: WampServer 2.5 requires Microsoft Visual C++ Redistributable to be installed in your machine. You can check if Visual C++ Redistributable is already installed by navigating to Control PanelProgramsPrograms and Features. If not, you can download and install Microsoft Visual C++ before installing WampServer.

Checking Control Panel for installed Visual C++

Step 02: Download WampServer by visiting You can either choose 32-bit or 64-bit WampServer depending on your operating system (OS).

Download Wamp Server based on your system type

You can check if your Windows machine is running 32-bit or 64-bit navigating to Control PanelSystem and SecuritySystem.

Find your system type from Control Panel

Step 03: Run the downloaded installer to install WampServer. WampServer 2.5 is 41.4 MB in size.

Download Wamp Server to your local drive

Step 04: The setup Wizard opens up with the version details and from here, the steps are self explanatory. Click 'Next' to continue.

Installing Wamp Server - Setup wizard screen

Step 05: The next screen shows the License Agreement. You can read through the agreement and choose 'I accept the agreement'. Click 'Next' to continue.

Installing Wamp Server - License agreement screen

Step 06: In this screen, you can select the destination folder to install WampServer. I prefer to install it in the default directory. Click 'Next' to continue.

Installing Wamp Server - Setup directory screen

Step 07: In 'Select Additional Tasks' screen, you can choose to create Desktop and Quick Launch icons and when you are done, click 'Next' to continue.

Installing Wamp Server - Additional tasks screen

Step 08: You can click on 'Install' in the 'Ready to Install' screen.

Installing Wamp Server - Ready to Install screen

Step 09: The installer would ask you to choose your default browser. You can leave it to default and click 'Open'.

Installing Wamp Server - Choose default browser screen

Step 10: Leave the values to default in the PHP and mail parameters screen and click 'Next'.

Installing Wamp Server - PHP mail params screen

Step 11: WampServer might ask you to allow access through Firewall and you must grant access to avoid any issues.

Installing Wamp Server - Windows Firewall security alert

Step 12: Check the 'Launch WampServer 2 now' checkbox in the 'Completing the WampServer 2 Setup Wizard' screen. Complete the installation by clicking on the 'Finish' button.

Installing Wamp Server - Setup complete wizard

Hooray! WampServer is now installed on your machine and you can observe a new 'W' icon in the taskbar.

Checking WampServer After Installation

Once we complete WampServer installation, the first thing we need to do is to check if WampServer is installed properly.

Wamp Server taskbar icon

Navigate to http://localhost/ on your favorite browser or left-click on the WampServer icon and choose 'Localhost'. If Wamp functions properly, we should see the Server Configuration page. The Configuration page gives us information on the extensions installed, server version information and few tools for managing the local server.

Localhost screen after Wamp server installation

Installing And Running WordPress

Let us now get to the interesting part and install WordPress.

Setting Up Database

Step 01: Let us start by setting up a database first. We can use PHPMyAdmin tool to create databases.

Navigate to PHPMyAdmin in your browser by typing http://localhost/phpmyadmin. You can also find this tool in the server configuration page under the 'Tools' section. The server configuration page loads up when you type http://localhost/ in your browser.

Open PHPMyAdmin in browser

Step 02: There are two things that we must consider when creating a MySQL database for WordPress - the database name and the collation.

WordPress and Hackre recommend to use utf8_general_ci collation when creating database for WordPress. Also, recommends to use the same database name as your live WordPress site for your local database. This allows us to easily move the local database to the live server.

For this tutorial, I’m going to create a database with the name 'danielsblog'.

To create a database with the recommended collation, click on 'Database' tab and enter the name of the database. Select utf8_general_ci as the collation and click 'Create'.

Create MySQL database using PHPMyAdmin

Now your database is ready for our local setup.

Setting Up WordPress

Step 03: Head to in your browser and download WordPress. At the time of writing this tutorial, WordPress 4.3.1 was the latest version released.

Download WordPress from

Step 04: Extract the downloaded file to 'www' folder found inside the directory where you installed WampServer. I had installed Wamp in the default directory and my 'www' folder would be found in 'C:\wamp\' directory.

You can rename the extracted folder to 'yoursitename'. This way you can keep it organized and can run multiple local sites without confusion. I have renamed to 'danielsblog'.

Renaming downloaded WordPress

Local WordPress sitename

Step 05: Open up your browser and type http://localhost/yoursitename. Now you should see a page asking to select the language. Select your preferred language and click 'Continue'. I prefer to use English (United States).

Open local site to setup WordPress

Installing WordPress - Language select screen

Step 06: In the next screen, WordPress prompts you to get the following information.

  • Database name
  • Username
  • Password
  • Database host

Installing WordPress - Keep database info ready screen

Database name – If you remember, we created the database using PHPMyAdmin by providing a database name. Enter the same database name while creating the Configuration file. I have created a database with the name 'danielsblog'.

Username, Password and Host – MySQL ships with the default root account. 'root' is the username and there is no password set for this account. The database host for this account is 'localhost'. You can check this by navigating to http://localhost/phpmyadmin/ in your browser and click on 'mysql' database in the left pane. Clicking on the 'user' table will list all the users in the table.

MySQL user table screen

Now that you have all the information, click 'Let’s go' to continue in the WordPress setup screen.

Step 07: You will be asked to enter the database information in the following screen.

Installing WordPress - WordPress database info screen

It is a best practice to change the default WordPress table prefix to avoid brute force attacks. Similar to database name, you can use the table prefix values from your live WordPress site. This makes the process easier when you move the local database to your live server. If you prefer to leave it to default, then click 'Submit'.

WordPress creates a configuration file called wp-config.php in the root folder and saves these information in it.

Installing WordPress - wp-config file

Step 08: In the next screen, you should get the following message.

All right, sparky! You’ve made it through this part of the installation. WordPress can communicate with your database. If you are ready, time now to…

Installing WordPress - Run the install screen

Click on 'Run the install' and you will be taken to the Welcome screen.

Step 09: In the Welcome screen, WordPress will ask you for the following information.

  • Site Title
  • Username
  • Password
  • Email
  • Privacy

Enter the above information and you can uncheck 'Allow search engines to index this site' checkbox as this is a local website. Click on 'Install WordPress' to complete WordPress installation.

Installing WordPress - Site information screen

Upon successful installation, you will be taken to the 'Success' screen.

Installing WordPress - Installation success screen

Congratulations, your local WordPress website is now ready. You can login and start playing around.

How does a local WordPress setup improve your workflow? Please do let know me know in the comments.