WP: Hello World Plugin

In this post, let’s look at how to create a simple “Hello World” plugin in WordPress. By “Hello World” I mean a “basic” plugin that does nothing special but you can upload and install it on your WordPress site.

Creating The Plugin

The first step is to create a plugin folder and plugin file with the plugin name. Let’s name our plugin hello-world-replace.

This means our folder structure would look like this: hello-world-replace > hello-world-replace.php.

Enter the following code in the main plugin file hello-world-replace.php

<?php 
/*
Plugin Name: Hello World
Plugin URI: https://csmumbai.com
Description: This plugin replaces all instances of "hello" with "Hello World"
Author: Omkar Bhagat
Version: 1.0
*/
 
function hello_world_replace( $text ) {
	return str_replace( 'hello', 'Hello World', $text );
}
 
add_filter('the_content', 'hello_world_replace');
 
?>

Save the file. Zip the folder. And the plugin is ready!

Testing The Plugin

To test the plugin, go to your site’s WP-Admin dashboard > Plugins > Add New and upload this zipped file.

Next create a post with hello text inside of it and publish it. Check the published version and you’ll find hello will be turned into Hello World.

That’s all in this post! 🙂

WP: Install WordPress Locally

There are different ways to install WordPress locally. Some of the popular ways are listed below. WordPress can be installed locally via –

  • MAMP (Mac, Apache, MysQL, PHP)
  • WAMP (Windows, Apache, MySQL, PHP)
  • XAMP (Cross-platform, Apache, MariaDB, PHP, Perl)
  • VVV (Varying Vagrant Vagrants)

Tutorials for the same can be found on their official sites or around the web (Google it). In this post, I’ll just cover one of the ways to install WordPress (which is by using MAMP).

For this, you’ll need to download MAMP and WordPress on your Mac computer. Next, install MAMP and run it.

Create a folder in your home folder, say wpdev and extract WordPress in there. Here’s how it will appear –

Next, open MAMP preferences, goto General tab and change the document root to the new folder we created, which is wp-dev.

Next, start all servers in MAMP (from the front/main screen which you see when you open MAMP).

This will open http://localhost:8888/MAMP/ in your web-browser. If it doesn’t, you can open it manually.

Next go to tools > phpMyAdmin > Databases. Enter a database name, say testdb1 and hit the create button.

Finally go to http://localhost:8888/wordpress/ where you will see a page to start installing WordPress. Go through the setup and enter the following database details when asked:

Once done, you’ll be asked for site details like site title, admin username/pass, etc. With that your WordPress installation will be complete.

Finally, you can access your site’s wp-admin dashboard at http://localhost:8888/wordpress/wp-admin/

That’s all! You have successfully installed WordPress on your local machine.

Setting Up Jetpack Developer Environment

Breaking the flow of Python posts I have made so far by writing a little bit about Jetpack (a product from Automattic, the company I work for).

This post covers how you can set up Jetpack Developer Environment locally. The first step is to install gitnode, npm, homebrew on your computer. Next install composer and yarn using homebrew as follows:

$ brew install composer
$ brew install yarn

Without Docker

Note: Skip this step if you’ll use the same docker dev environment that is used by Jetpack dev team!

Have a working WordPress installation with one of the popular local servers like MAMP, Vagrants, etc.

Clone Jetpack repo by going into the plugins folder wp-content/plugins/ in your WordPress installation and cd into it using cd jetpack.

Finally, enter yarn build and once that finishes, your Jetpack dev environment is ready.

With Docker

Download and install Docker on your machine. Next, simply clone the Jetpack repo anywhere on your computer and then cd into it using cd jetpack.

Next enter yarn docker:up. When that completes, your Jetpack dev environment will be ready. Just go to localhost in your web browser.

At this point, you’re all done. You can now start contributing to it.

Errors

If you run into any errors with yarn build or yarn docker:up, that’s probably because you cloned a forked repo which is not up to date with master.

To fix that, simply add a new remote called upstream that links to the original repo:

$ git remote add upstream https://github.com/Automattic/jetpack.git

And then fetch the updated code and merge it with your local master branch as follows:

$ git fetch upstream
$ git checkout master
$ git merge upstream/master

Now try yarn build again and everything should work just fine.