Adding custom code snippets

Have you ever wanted to make AffiliateWP fit your exact needs, like adding a personal message to the affiliate dashboard or adjusting some design elements? If you’re wondering how to customize AffiliateWP without any risk to your site, this guide will walk you through it step by step.

With the help of the WPCode plugin, we’ll show you how to add custom code snippets quickly, safely, and all in one place.

Why Add Custom Code?

Adding custom code can help you make AffiliateWP truly your own. Whether you want to change styling or personalize the affiliate area, custom code snippets can bring those changes to life. But modifying code directly in the plugin files can be risky—if something goes wrong, it could make your site inaccessible.

Instead, we’ll use a safer approach by working with a code management tool called WPCode, which keeps your main files untouched while letting you organize and activate custom code snippets all from one place.

Using the WPCode plugin to add the code snippets

The first step is to install the WPCode plugin, which lets you easily add and manage code snippets without having to edit core files. WPCode gives you a dedicated area for adding custom code safely, so you can keep all your changes organized in one place.

To set up WPCode, go to your WordPress dashboard, navigate to Plugins > Add New, and search for WPCode.

Once you’ve found it, click Install Now and then Activate.

After activating the plugin, you’ll see a new menu item labeled Code Snippets in the dashboard.

This is where you’ll add and manage your custom code.

Adding PHP Code

Let’s try adding our first snippet of custom code to AffiliateWP. Imagine you want to add a welcoming heading at the top of the Affiliate Area to make it more engaging for your affiliates. This is a perfect use for a PHP snippet.

In your WordPress dashboard, go to Code Snippets and select Add New. Since you just installed the plugin, your list will be empty.

You’ll be taken to a screen where you can enter your custom code. Here, you can either add your own unique code or select a code snippet from the pre-made library. Hover on Add Your Custom Code (New Snippet), and click on the Add Custom Snippet button.

You’ll be taken to a screen where you can select the code type. Here you need to select PHP Snippet.

Start by giving your snippet a title, such as Affiliate Area Custom Heading—something that helps you remember what this snippet does.

In the code box, paste the following PHP code:

// Add a custom heading to the Affiliate Area
function custom_affiliate_area_heading() {
    echo '<h2>Welcome to Your Affiliate Dashboard!</h2>';
}
add_action('affwp_affiliate_dashboard_top', 'custom_affiliate_area_heading');

This code snippet adds a heading that appears at the top of the Affiliate Area. To ensure the snippet runs automatically, choose Auto Insert under Insertion options.

When you’re done, toggle the Active menu, and click the Save Snippet button.

Now, when you go to the Affiliate Area, you’ll see the custom heading welcoming your affiliates.

Adding Custom CSS

Now let’s say you want to adjust the color of the navigation tabs in the Affiliate Area. For this, we’ll use a CSS snippet that changes the text color, making the navigation tabs match your site’s design better.

In the WPCode dashboard, click Add New to create another snippet, and select CSS snippet.

In the code box, paste the following CSS code:

/* Change text color for all navigation tabs */
#affwp-affiliate-dashboard-tabs li.affwp-affiliate-dashboard-tab a {
    color: #333; /* Default text color */
}

/* Change text color for the active tab */
#affwp-affiliate-dashboard-tabs li.affwp-affiliate-dashboard-tab.active a {
    color: #3498db; /* Active tab text color */
    font-weight: bold; /* Optional: make active tab text bold */
}

Then, set Insertion to Auto Insert so the style applies across the AffiliateWP navigation tabs. Save and activate your snippet, and the navigation links in the Affiliate Area will now display with the updated colors.

---

That’s it! You’ve now added both PHP and CSS snippets to customize AffiliateWP, creating a more personalized experience for your affiliates. Using WPCode makes this process safe and simple, so you don’t have to worry about editing core files or managing complex code changes.