How to Hide Email Addresses on WordPress Websites to Protect from Bots

Email addresses displayed on websites can easily be harvested by spam bots, which can lead to an increase in spam and unwanted emails. To prevent this, it’s important to take steps to hide email addresses on your WordPress website. In this tutorial, we’ll explore two different methods for hiding email addresses on WordPress websites – using plugins and custom code – and provide step-by-step instructions on how to implement each method. By following these steps, you can help protect your email addresses and keep your inbox free from unwanted spam.

Option 1: Use a Plugin

There are several plugins available that can help you obfuscate email addresses on your WordPress website. One popular plugin is Email Address Encoder.

To use this plugin, follow these steps:

1. Log in to your WordPress dashboard and navigate to the Plugins > Add New page.
   
2. Search for “Email Address Encoder” in the search bar on the top right-hand corner of the page.
   
3. Install and activate the “Email Address Encoder” plugin.
   
4. Once the plugin is activated, all email addresses on your site will be automatically encoded and protected from bots.

Option 2: Add Custom Code to Your Theme Files

If you prefer not to use a plugin, you can add the code directly to your WordPress theme files. Here’s an example of how to use JavaScript to dynamically generate an email address in WordPress:

1. Open your WordPress theme’s functions.php file and add the following code:

function my_email_shortcode() {
	$email = 'contact@example.com';
	return '<span class="email"></span><script>document.querySelector(".email").innerHTML = "' . $email . '";</script>';
}
add_shortcode( 'my_email', 'my_email_shortcode' );
Code language: PHP (php)

2. This code defines a WordPress shortcode called [my_email] that will generate a span element with a class of “email” and use JavaScript to fill in the email address.
   
3. Save the functions.php file and open the post or page where you want to display the email address.
   
4. Insert the shortcode into your post or page using the following code: [my_email]
   
5. Style the span element to make it look like a regular email address in your theme’s CSS file. For example:

.email {
	display: inline-block;
	font-family: Arial, sans-serif;
	font-size: 16px;
	color: #000;
	text-decoration: none;
}
Code language: CSS (css)

This will display the email address on the page as “contact@example.com“, but it won’t be visible in the HTML code of the page, which makes it more difficult for bots to harvest the email address.

That’s it! Hiding email addresses on WordPress websites is important to protect them from spam bots. There are several ways to do this, including using plugins or adding custom code to your theme files. The Email Address Encoder plugin is a simple and effective option for most WordPress users. However, if you prefer not to use a plugin, you can use custom code to generate and display email addresses on your site. Either way, it’s important to take steps to protect your email addresses from bots to keep your inbox free of spam.

If you’re interested in an alternative method to protect contact information on WordPress websites, you can check out our tutorial on “How to Protect Email Addresses and Phone Numbers from Spambots in WordPress.” This tutorial demonstrates how to obfuscate contact information using custom code snippets without relying on plugins.