If you really want your website to look and behave the way you want, you have 2 main possibilities. Add a lot of plugins or add custom code. While the first solution is often easier to set up, it can become a performance nightmare. Therefore, in some cases, you will have to add some code to add a custom feature to your WordPress website.

Luckily, this guide will make it easier for you and explain everything you need to know to do so. Even if you’re not a developer. And, before we begin, here’s a general rule you should follow when deciding whether or not you should install a plugin :

If you plan on using less than 10% of a plugin’s features, don’t install it and look for other solutions

This one is from me, you’re welcome

1|Install Code Snippets

On the internet, if you run searches on how to add custom features to your WordPress website, a lot of answers will tell you to add the code to your theme’s functions.php file. Don’t do that !

Not only will it become messy over time as you add more code, but it will also run this code everywhere. Even if it’s not needed. Instead, you can use a free plugin called Code Snippets that presents many benefits :

• It lets you organize your code in small snippets
• You can enable or disable your code snippets at any time
• It lets you decide if the code runs on the backend, frontend or both
• You can export/import your code snippets from a staging website to the live one
• If the code is wrong, this plugin will prevent it to run and crash your website.

For all these reasons, we advise you to use this lightweight and free plugin.

2|Understanding WordPress Hooks

You don’t need to be a developer to understand this guide. In addition, you don’t need to know PHP in order to use it. But if you want to add a custom feature to your WordPress website, you need to understand some concepts. If you learn these, you’ll be much more capable of finding the code you need.

WordPress relies heavily on hooks. Some might even say that hooks is the main WordPress feature. In fact, hooks are what allow WordPress to be highly and easily customizable.

Definition : Hooks are a way for one piece of code to interact/modify another piece of code at specific, pre-defined spots. They make up the foundation for how plugins and themes interact with WordPress Core, but they’re also used extensively by Core itself.

To simplify it for you, let’s put it that way. All WordPress and plugin developers add doors in different places where you can add your own code and change a specific behavior.

1|Hook Creation

Developers can add 2 types of hooks into their code : Actions and Filters.

• an action takes the info it receives, does something with it, and returns nothing. In other words: it acts on something and then exits, returning nothing back to the calling hook.
• a filter takes the info it receives, modifies it somehow, and returns it. In other words: it filters something and passes it back to the hook for further use.

Here’s an example of a filter

$value = apply_filters('the_name_of_my_filter', $data_sent);

With the above line, the developer created a hook called ‘the_name_of_my_filter‘ which will send the $data_sent information. The result will be stored into $value.

2|Plug into a hook

If you want to add more information or add a custom feature, you will probably have to use an existing hook and add your code to it.

If we look at the above filter, here’s how to plug into it

add_filter('the_name_of_my_filter', 'theNameOfYourFunction');

Here, you said that you want to call the code from theNameOfYouFunction function inside this existing hook. However, that’s half the job done. You still need to add your custom function.

function theNameOfYourFunction($data)
{
    /** Add your custom code or feature here */
    return $data;
}

That’s it, your code will be called every time the hook is called. This is still a bit obscure ? No problem, it will all become clear with the following examples

3|Add a custom feature to your WordPress website

Now that you know how hooks work, it’s time to use this knowledge with some real examples. First, I’ll give you some examples. Afterwards, I’ll give you some hints on how to find custom code matching your needs on websites like stack overflow.

1|Give users a specific role when they register

In this code, we’ll give the “vip” role to users when they create an account on your website. If the user role doesn’t exist, we create it.

/** When a user creates an account, WordPress uses the 'user_register' action hook */
\add_action('user_register', 'addVipRole');

/** At this point, the user is already created, we only need to change his role */
function addVipRole($userId)
{
    /** First, we make sure that the user exists */
    if( $user = \get_user_by('ID', $userId)) {
        /** We set the role we want to give to the user */
        $role = 'vip';
        /** We test if the role exists. Otherwise, we create it */
        if (!\wp_roles()->is_role($role)) {
            $role = \add_role('vip', __('VIP User', 'testdomain'));
        }
        /** Now we give the role to the user */
        $user->set_role($role);
    }
}

Comments in the code explain everything you need to know with this code.

2|Display a message on the WooCommerce product page

You can’t modify most WooCommerce pages the way you want and build your own versions of these pages. This is why, if you want to display specific content on WooCommerce pages, you have to do it by using hooks.

With this small piece of code, we’ll add a “Hello World” message under the product short description

/** We plug into the 'woocommerce_before_add_to_cart_form' hook */
\add_action('woocommerce_before_add_to_cart_form', 'addCustomMessage');

/** We add our specific message */
function addCustomMessage()
{
    /** We use the PHP echo function to display our message */
    echo "Hello World!";
    
}

That’s as simple as that. If you want to display other information or run a shortcode, it’s also possible. All it takes is some research.

3|Add a custom field on the WooCommerce’s user profile

If you want customers to have the possibility to fill in some extra fields into their profile, this piece of code will help. You don’t need to install another plugin for this.

The code may look a bit bigger than previous examples but there’s a good reason to it. When you let customers fill data that will be saved in your database, you need to be sure that the data is safe and corresponds to the type of data you want.

/** For the my account details page, we need 2 functions, one to display the new field and one to save the data */
\add_action('woocommerce_edit_account_form', 'myaccountDetailForm');
\add_action('woocommerce_save_account_details', 'myaccountDetailSave');

function myaccountDetailForm()
{
    $userId = \get_current_user_id();
    $key    = "billing_birth_date";
	$label = __("Date of birth", 'woocommerce');
	// If the user already filled this value, we need to read it to display it
	$value = \esc_attr(\get_user_meta($userId, $key, true));

	echo "<p class='woocommerce-form-row woocommerce-form-row--wide form-row form-row-wide'>";
	echo "<label for='{$key}'>{$label}</label>";
	echo "<input type='date' class='woocommerce-Input woocommerce-Input--text input-text' name='{$key}' id='{$key}' value='{$value}'></p>";
	// If you want, you can also add some custom description under your custom field
	echo "<p class='woocommerce-form-row woocommerce-form-row--wide form-row form-row-wide'>If you fill your date of birth, you'll earn a gift for your birthday</p>";
	echo "<div class='clear'></div>";
}

function myaccountDetailSave($userId)
{
    $key    = "billing_birth_date";
	// This part is very important. When reading a field entered by a user, you need to sanitize it to make sure it's safe
	$birthday = !empty($_POST[$key]) ? \wc_clean($_POST[$key]): '';
	if( !empty($birthday) )
	{
		$date = \date_create($birthday);
		if (empty($date)) {
			\wc_add_notice(__("Invalid date format for date of birth",'woocommerce'), 'error');
			$birthday = false;
		}
		$today = \date_create();
		if ($date >= $today) {
			\wc_add_notice(__("You must enter your date of birth, not your next birthday", 'woocommerce'), 'error');
			$birthday = false;
		}
	}
	if( $birthday !== false ) {
		\update_user_meta($userId, "billing_birth_date", $birthday);
	} else {
		\wc_add_notice(__("Invalid date format for date of birth", 'woocommerce'), 'error');
	}
}

That’s as simple as that. If you want to display other information or run a shortcode, it’s also possible. All it takes is some research.

4|Useful Resources

Business Bloomer Visual Hook Guide : You will find there a lot of hooks you can use to display information or add your own content on a lot of different pages. It’s a very useful resource, especially if you’re using WooCommerce.

Stack Overflow : This website is commonly used by a lot of developers and it has a great community. They’re also willing to help people that are not developers and give you step by step guides. You will find a lot of useful code snippets there.