Here a basic tutorial on how to hide email address on website using JavaScript. This method helps to protect your email address from being easily harvested by bots.
Create a new HTML file:
Start by creating a new HTML file for your web page. You can use a simple text editor like Notepad or any code editor of your choice.HTML Structure:
Set up the basic structure of your HTML file.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Your Website</title>
</head>
<body>
<!-- Your website content will go here -->
</body>
</html>
-
Add the JavaScript code:
Insert the following JavaScript code within the
<head>tags of your HTML file.
<script type="text/javascript">
// Function to generate the email link
function generateEmailLink() {
var user = "your-email"; // Replace with your email username
var domain = "your-domain.com"; // Replace with your email domain
var mailtoLink = "mailto:" + user + "@" + domain;
// Set the href attribute of the anchor tag to the mailto link
document.getElementById("emailLink").setAttribute("href", mailtoLink);
document.getElementById("emailLink").innerHTML = user + "@" + domain;
}
</script>
-
Insert the email link:
In the
<body>section of your HTML file, insert an anchor tag where you want the email address to appear.
<p>Contact us at <a id="emailLink" href="#" onclick="generateEmailLink();">Loading...</a></p>
-
Call the function:
At the end of your HTML file, call the
generateEmailLinkfunction to generate the email link.
<script type="text/javascript">
// Call the function to generate the email link
generateEmailLink();
</script>
Replace placeholder values:
Replace "your-email" and "your-domain.com" in the JavaScript code with your actual email username and domain.Test your page:
Save your HTML file and open it in a web browser to test if the email link is working correctly.
Remember that determined users can still find ways to extract email addresses from websites. This method simply adds a layer of protection against automated bots.
Top comments (0)