Has your website become slow and your traffic has dropped for no reason? Is your website displaying unwanted ads? Are you seeing pop-ups that you didn’t insert? Maybe you need X-XSS-protection in WordPress.

This could be the result of an XSS attack on your WordPress site. These attacks are quite common but they have a devastating impact.

CVE Details recorded 9,903 major XSS attacks since 2009. But there’s no telling how many of these attacks have gone unreported.

Hackers use the XSS exploit to steal data, display their own advertisements (usually of illegal drugs or adult content), defraud your customers, among a long list of malicious activities.

But you can stop worrying because there are ways to easily protect your website against XSS. Today, we take a look at how to add X-XSS protection headers in WordPress as it will forcefully block any XSS attempts.

You’ll learn what these response headers are and how to implement them. Post that, we’ll also give you a few more WordPress security tips to make your WordPress website rock solid against XSS and any other attack!

TL;DR: Protect your WordPress website from XSS attacks and any other form of malware with our All-in-one MalCare Security Solution. Install the plugin on your WordPress website and rest assured your site is monitored and scanned regularly to protect it against any malicious attack.

[lwptoc skipHeadingLevel=”h1,h3,h4,h5,h6″]

What is XSS (Cross-Site Scripting) in WordPress?

Cross-site scripting (XSS) is a type of injection attack wherein hackers exploit security vulnerabilities that originates in user inputs on a website. A user input could be any area which accepts data from the website user such as a site search bar, a comments section, a contact form, or a login field.

They take advantage of what kind of information the user can enter into these fields in various ways. So, there are different types of cross-scripting attacks. Here, we’ll detail two of the most common XSS attacks:

Stored Or Persistent XSS Attack

This type of attack targets the visitors of a website. Let’s take a look at how this happens.

Let’s assume examplesite.com accepts user inputs on their website in the form of comments on blog posts. A visitor can share their thoughts and ask questions by leaving comments on a post. After the comment is submitted, it is sent to the database and stored.

Typically, this comments field should have configurations to validate the data before it’s sent to the database.

But if the configurations aren’t correct, it wouldn’t be able to distinguish between a regular text comment and a line of code.

So, let’s assume a hacker has figured out this site’s comments section accepts any input. They could enter a JavaScript code but the output would look like a regular comment. 

What the website owner may not notice is the hacker is able to enter a “Click me” button as well, which ideally should not be allowed.

Next, a regular visitor (the target) of the website lands on this page. If this user clicks on the button, the malicious code will run and infect the visitor’s browser. The hacker will then be able to extract data from the visitor’s browser cookies.

Cookies store all sorts of information such as stored login credentials, credit card information, or personal data. When you log into a website, you would see a pop-up like so, asking if you’d like the browser to remember the password: 

Now a regular user (the target) would usually have multiple tabs open on a browser such as Facebook, email, a shopping site, a work website, YouTube, etc. If a hacker is able to run an XSS attack, they would steal the cookies of all sites open on the browser. This is why it’s called ‘cross-site’. They use this information to defraud the customer or run bigger attacks.

Even though this attack doesn’t affect your website directly, it has severe repercussions. It puts every single one of your visitors in jeopardy. Plus, Google will be quick to blacklist your site and your web host will suspend your hosting account.

Reflective Or Non-Persistent XSS Attack

In this attack, hackers target the website itself to gain access. Let’s show you how this works:

Say your website has a search tab where customers can quickly find what they want. This tab should ideally accept only letters of the alphabet. But it hasn’t been configured correctly and it accepts special characters and numbers as well. The site’s search engine will not be able to differentiate between text input from the user and malicious code input by a hacker.

Once inserted, the malicious code travels to the website’s database and gets executed. When that happens, the hacker gains access to the website and can begin to run their malicious acts! Worse, they could use your website to launch bigger hack attacks like a DDoS attack.

Now we know just how severe an XSS attack can be and why we need to protect our websites from it. So let’s dive into why HTTP security headers prevent XSS attacks.

What Are HTTP Security Headers?

HTTP stands for Hypertext transfer protocol and defines how messages are formatted and transmitted over the internet.

Modern web browsers such as Google Chrome or Mozilla Firefox have HTTP response headers encoded in them. These HTTP secure headers usually consist of metadata – such as status error codes, content-encoding, content security, and cache control.

The response header instructs the browser on how it should act when it interacts with a website. For example, a user opens Google Chrome and visits a website, the HTTP headers play a role here in determining how the browser, the website and its web server communicate.

We’re going to explain one such HTTP response header to help you understand this better.

If you’ve set up an SSL or TLS certificate on your website, it means your website is accessible only over HTTPS (which is a secure connection that encrypts data as it’s being transferred). But hackers can find ways to access your site over HTTP. There are several scripts readily available on the internet which a hacker can use to open your site over HTTP and steal data.

To reinforce your SSL certificate and ensure your site is never accessed over HTTP, you can add a reponse header called ‘strict transport security’. This will force all the latest browsers such as Safari, Chrome and Firefox to communicate with your website over HTTPS only. This eliminates the possibility of content sniffing and packet sniffing.

If an attacker tries to open your site over HTTP, the browser simply won’t load the page.

There are different HTTP security headers you can add to your WordPress website. Today, we’re focusing on X-XSS Protection that will mitigate/prevent cross-site scripting.

How To Set Up X-XSS Protection in HTTP Security Header 

To set up HTTP Security Headers, you need to access and edit the .htaccess file and add lines of code. Altering WordPress files at any time carries a high risk. A slight misstep could lead to a completely broken website.

Hence, we strongly recommend taking a complete backup of your WordPress site. You can use the BlogVault plugin to take a full backup of your website in under a few minutes. If anything goes wrong during this process, you can quickly restore your website back to normal.

Step 1: Scan Your Website To Check If Header Exists

We recommend checking if your website already has the header enabled. You can check with your managed WordPress host or use a website such as securityheaders.com.

Enter your website’s URL and scan now. You’ll see a report like so: 

We can be sure there is no X-XSS protection header set.

Note: Most of the browsers have X-XSS protection enabled by default. But adding this security header to WordPress will instruct the browser to block XSS hack attempts.

Step 2: Access Your WordPress .htaccess File

Log into your WordPress hosting account. Here, go to cPanel > File Manager. 

Inside, you’ll find a list of folders. On the right panel, locate the public_html folder. You’ll find the .htaccess file here. 

Tip: In case you cannot see the .htaccess file, go to settings and select “show hidden files”.

Step 3: Insert The WordPress Security Header

To edit this file, simply right-click on it and you’ll see the option to edit it. 

Add the following line of code at the end of your .htaccess file:

Header set X-XSS-Protection “1; mode=block”

Save the file.

Step 4: Check If The HTTP Response Header Works

We recommend visiting securityheaders to scan your site to check if the header is working.

And that’s it. You’ve successfully added a layer of security to your website by implementing the security header to block XSS attacks.

Conclusion: Protection Against All Attacks

After implementing this WordPress security header, we’re confident your site is now safe against XSS attacks. But XSS isn’t the only vulnerability to worry about. Your website resides in a digital realm where it’s exposed to a deluge of risks such as hacks and malware infections.

You need to take ample security measures to block hack attempts and keep your website protected. Install MalCare to get all-round protection for your WordPress site. It will scan and monitor your website regularly. It also offers a firewall that will block malicious IP addresses. With MalCare installed, you can rest assured that your website is secured. You can check our guide on how to secure your WordPress site.

Protect your WordPress website with MalCare!