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.
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.
Rather than using the <script> tag directly, we must use WordPress’s wp_enqueue_script function to include scripts on the page.
If you’re using WordPress 4.8+, remember to paste the code in ‘Text mode’ under ‘Text’ widgets.
Learn more about the differences between defer and async attributes here.
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?
This snippet will be handy if you happen to deal with Optins that are real monsters.
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.
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.
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 firsttimersonly.com. 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.
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 WordPress.com (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.
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 → Settings → General.
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.
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 → Settings → General). 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 http://www.yourdomain.com/?p=123. This structure gives no clue about the page either to your visitors or to search engines.
Consider an URL for example, http://www.yourdomain.com/things-to-do-after-wordpress-is-installed. 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.
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 Labnol.org 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. files.your-domain.com). 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 files.your-domain.com/uploads/ 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
Store uploads in this folder – /home/your-sub-domain/your-folder (Note: no trailing slash)
Full URL path to files – files.mariadanieldeepak.com/uploads (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 WordPress.com.
Download and activate the JetPack plugin. Once you activate the plugin, JetPack asks you to connect to WordPress.com. Click on 'Connect JetPack' to connect JetPack to your WordPress.com account.
If you don’t have a WordPress.com account, you will be provided an option to create an account. You can then connect JetPack with WordPress.com
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.
Hoo Hooh.. Congratulations, you have successfully enabled JetPack authentication for your WordPress website.
When you head over to your login page (http://your-website.com/wp-login.php), you should see a 'Login with WordPress.com' 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.
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
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.
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
Two-Step authentication enables an additional layer of security for your WordPress website. You can enable two-step authentication by visiting WordPress.com. 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 WordPress.com. This adds another layer of security. But this would require all of your existing WordPress users to create an account on WordPress.com
To permanently disable WordPress default login form, add the following line of code in your theme’s functions.php file.
/** Login via WordPress.com **/
add_filter( 'jetpack_sso_bypass_login_forward_wpcom', '__return_true' );
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
Installing and running WordPress
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 WordPress.org 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.
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.
You can check if your Windows machine is running 32-bit or 64-bit navigating to Control Panel → System and Security → System.
Step 03: Run the downloaded installer to install WampServer. WampServer 2.5 is 41.4 MB in size.
Step 04: The setup Wizard opens up with the version details and from here, the steps are self explanatory. Click 'Next' to continue.
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.
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.
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.
Step 08: You can click on 'Install' in the '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'.
Step 10: Leave the values to default in the PHP and mail parameters screen and click 'Next'.
Step 11: WampServer might ask you to allow access through Firewall and you must grant access to avoid any issues.
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.
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.
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.
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.
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_cicollation when creating database for WordPress. Also, WordPress.org 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'.
Now your database is ready for our local setup.
Setting Up WordPress
Step 03: Head to https://wordpress.org/download/ in your browser and download WordPress. At the time of writing this tutorial, WordPress 4.3.1 was the latest version released.
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'.
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).
Step 06: In the next screen, WordPress prompts you to get the following information.
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.
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.
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.
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…
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.
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.
Upon successful installation, you will be taken to the '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.