Managing HTTP Security Headers on WordPress Websites

Security is all we need. There are many ways to make your website a safer place on the Internet. Adding HTTP security headers is one more way to add an extra layer of security to your WordPressWordPressOpen-source content management system (CMS) that allows users to create and manage websites and blogs.
More About WordPress web project. In this article, we’ll take a closer look at the HTTP security headers, their types, and ways to add them to your site. 

If your website is powered by WordPress, you will have to follow security rules that will help protect your blog, online store, or any other business project. Since you will be dealing with sensitive information (for example, the transmission of passwords and customer billing information) during the operation of your site, it is best to always make sure that your WordPress installation is as secure as possible.

HTTP Security Header – What Is It? 

An HTTP security headerHeaderA visual and typographical band or menu commonly situated at the uppermost part of a website’s interface.
More About Header is a subset of HTTP headers exchanged between a web browserBrowserA software application that enables you to view and interact with websites.
More About Browser and the web servers, transmitting security-related aspects of the HTTP communication. 

When a user visits a specific site in their browser, the resource responds with the appropriate HTTP headers. These headers tell the browser how to interact with that particular site. Such headers most often consist of metadata, for example, the CacheCacheA temporary storage location that stores frequently accessed data to reduce load times.
More About Cache-control field to control caching, lists of HTTP status codes, and the method of encoding content in transit – Content-Encoding.

By using HTTP headers wisely, you can improve the security of your site and provide some degree of resistance to cyber-attacks. For example, if you add strict-transport-security, you can force the latest versions of Google Chrome, Firefox, and Safari to only interact with your site over HTTPS.

Modern web browsers support many HTTP headers that can improve the security of your websites and web applications to protect your project against clickjacking, cross-site scriptingScriptingThe process of creating a series of commands or instructions that are executed by a computer or software application.
More About Scripting, and other common attacks. HTTP security headers bring an additional layer of security to web resources while restricting web browsers and web servers’ behaviors once the website or web applicationApplicationA software program designed to perform specific functions or tasks on electronic devices, such as smartphones and tablets, computers, and smart TVs.
More About Application is running. Adding the right HTTP security headers to WordPress websites is a crucial aspect that means a lot for your website’s security. Similar to other things in the world, certain trends on which HTTP security headers are trendy and which of them are not relevant anymore. 

Top HTTP Response Headers 

Let’s take a closer look at some of the most well-known HTTP response headers that you can add to your WordPress website. 

HTTP Strict Transport Security (HSTS)

Even if you purchased, installed, and configured an SSLSSLSecure Sockets Layer is a cryptographic protocol that ensures secure communication between a client and a server.
More About SSL/TLS certificate, your site can still be accessed via regular HTTP. Hackers even have several special scripts that open the site using an unprotected protocol. Therefore, by using strict-transport-security, you force all modern browsers to “communicate” with the site exclusively via HTTPS. In this case, even if an attacker tries to open a WordPress site over HTTP, the browser will refuse to open the resource.

Let’s consider the following example: 

Strict-Transport-Security: max-age=63072000; includeSubDomains; preload

It transmits the following message to the visiting web browser – the current website and all its subdomains are HTTPS-only. Over the next 2 years (the max-age value in seconds), the web browser should access it only over HTTPS. The preload directive indicates that the website is listed among HTTPS sites. With preloading, you speed up the loading timeLoad TimeThe amount of time it takes for a webpage or app to load and become interactive for the user fully.
More About Load Time of the site and eliminate the risk of man-in-the-middle attacks when someone reaches the web page for the first time. 

Content-Security-Policy (CSP)

It’s a must-have HTTP security header for all WordPress websites. It’s a sure-fire way to protect your web resource against XSS attacks. With its help, you control permitted content sources. For example, the CSP to allow assets only from the local origin looks like this:

Content-Security-Policy: default-src ‘self’

Script-src ‘self’ allows scripts from the local origin only. With the pluginPluginA piece of software that can be easily installed and activated on a CMS platform to enhance its capabilities.
More About Plugin-types directory, you can restrict plugin sources or object-src.

X-Frame-Options

The HTTP security header was first used in Microsoft Internet Explorer. With its help, you can protect your website from cross-site scripting attacks, including HTMLHTMLThe fundamental language used to create and structure content on web pages.
More About HTML frames. To apply protection to the current page against loading into iframes, use: 

X-Frame-Options: deny

It also supports the following values:

• sameorigin to allow loading into iframes with the same origin;
• allow-from to indicate specific URLs. 

You can also replace this HTTP security header with suitable CSP directives.  

Expect-CT

Expect-CT HTTP security header is used for certificate spoofing. Use it to indicate that only new certificates added to Certificate Transparency logsLogsRecorded events and actions that occur within a website or application.
More About Logs should be accepted:

Expect-CT: max-age=86400, enforce, 

    report-uri=”https://example.com/report”

The enforce directive instructs clients to refuse connections that violate the Certificate Transparency policy. The report-uri directive is optional and is used to indicate a location for reporting failures.

X-Content-Type-Options

The next type of security header is X-Content-Type-Options. Its beauty lies in the nosniff value, which prohibits content sniffing. By using this header, you can protect your site from MIME spoofing attacks.

The HTTP security header has just one directive:

X-Content-Type-Options: nosniff

Referrer-Policy

Feature Policy is an HTTP security header that allows site owners to enable or disable platform-specific features. Therefore, you, as the owner of the website, will be able to restrict some browser functions on your resource. It controls is and how much referrer information should be revealed on the webserver. For each individual feature, you have to specify whether it is disabled or enabled. Here is a list of these features: geolocation, midi, notifications, push, sync-xhr, microphone, camera, magnetometer, gyroscope, speaker, vibrate, fullscreen, and payment. 

Referrer-Policy: origin-when-cross-origin

In this example, the web browser will reveal complete referrer information only for the same-origin requests. The rest requests will receive only the origin data. 

Cache-Control

To take control of caching of specific pages on your site and ensure the confidential data is not in any caches, use the cache-control header. The typical example of using the header is: 

Cache-Control: no-store

Clear-Site-Data

Here comes another HTTP security header that lets you keep the data of your site private. The Clear-Site-Data header lets you make sure that the site’s confidential data is not stored by the web browser after a user logs out. 

Consider the following example: 

Clear-Site-Data: “*”

It will clear all browsing data related to a website, including cache, cooking, and storage. 

Feature-Policy

This header will come in handy to you if you want to deny access to certain browser features. For example, use the following header to ensure that the application doesn’t use the camera and microphone APIs:

Feature-Policy: microphone ‘none’; camera ‘none’

Deprecated HTTP Security Headers

X-XSS-Protection

It’s a non-standard header that was intended to be used for web browsers with XSS filter. It was intended to be used for filtering purposes. The header protected the projection of your site against JavaScriptJavascriptA high-level, dynamic, and interpreted programming language primarily used to create interactive and responsive user interfaces on web pages.
More About Javascript injection attacks through cross-site scripting. Here’s how it commonly sounds: 

X-XSS-Protection: 1; mode=block

The HTTP security header was easy to bypass, so it was deprecated. Besides, most modern-day web browsers do not use XSS filtering any longer. 

HTTP Public-Key-Pins (HPKP) 

Here comes one more example of deprecated HTTP security headers. It was introduced in Firefox and Google Chrome to prevent certificate spoofing. It featured a rather complicated mechanism, as part of which the webserver presented the web client with cryptographic hashes of valid certificate public keys for future communication. 

An HPKP example would look like this: 

Public-Key-Pins:

    pin-sha256=”cUPcTAZWKaASuYWhhneDttWpY3oBAkE3h2+soZS7sWs=”; 

    max-age=5184000

HPKP proved to be too complicated. When improperly used, it could completely disable the website access for the specified time (2 months in the example given above). 

Ways to Add HTTP Security Headers to WordPress 

To achieve the best effect from using HTTP security headers on your site, it’s better to get them set up on the webserver level. The results would be even better when you use Sucuri or Cloudflare DNSDNSA protocol that translates human-readable domain names into numerical IP addresses used by computers to locate each other on the internet.
More About DNS-level web application firewalls. 

Let’s consider how the most popular methods of adding HTTP security headers to WordPress work, and pick the best option for you. 

Sucuri

There are many WordPress security plugins available on the market. Sucuri is one of the top-rated ones without any doubt. If you use their website firewallFirewallA network security system that monitors and controls incoming and outgoing network traffic based on predetermined security rules.
More About Firewall service, you can add HTTP security headers without writing a line of code. 

To get started, you need to sign up for a Sucuri account (in case you do not have one yet). To register an account, you will need to answer several quick questions. You will be also provided with detailed documentationDocumentationThe process of creating, organizing, and maintaining written materials that provide information about a web project.
More About Documentation to get the maximum use of the service. 

• After signing up, you need to install and activate the plugin on your site. 
• After activation, navigate Sucuri Security » Firewall (WAF) and enter your Firewall APIAPIApplication Programming Interface serves as a bridge that enables different software systems to communicate and interact with each other.
  More About API key (available under your account on the Sucuri website). Click Save to apply the changes. 
• Navigate to your Sucuri account dashboard. Over there, click on the Settings menu and switch to the Security tab. 
• You will see three sets of rules. HSTS is set as the default protection, which will be applied for each set of rules. 
• Apply changes. Now Sucuri adds selected HTTP security headers in WordPress. 

Cloudflare

The service offers a free plan, but it lacks advanced security features. You will need to upgrade to the premium plan to get access to advanced features. 

• Install and activate the service on your site. Once activated, open the SSL/TLS page under your Cloudflare account dashboard and then switch to the Edge Certificates tab.
• Next, scroll down to the HSTS section and click the Enable HSTS’ button. It will reveal a popup with instructions on how to enable HTTPS on your WordPress site. Click Next and you will see options to add HTTP security headers. 

At this stage, you can enable HSTS, no-sniff header, apply HSTS to subdomains (if they are using HTTPS), and preload HSTS.

Htaccess

This method allows you to set the HTTP security headers in WordPress at the server level.

You must change. htaccess on your website. This is the server configuration file used by the most commonly used ApacheApacheA web server software widely used for hosting web applications.
More About Apache webserver software.

Just login to your website using your FTPFTPFile Transfer Protocol is a technology that allows users to transfer files between computers over a network.
More About FTP client or file manager app in your hostingHostingThe process of storing and serving website files on a remote server, making them accessible to visitors around the world.
More About Hosting control panel. In the root folder of your website, you need to find the .htaccess file and edit it.

This will open the file in a text editorEditorThe interface that allows you to write and format text, add images, embed media, and much more.
More About Editor. At the bottom of the file, you can add code to add HTTPS security headers to your WordPress site.

You can use the following code example as a starting point, it identifies the most commonly used HTTP security headers with optimal settings:

Don’t forget to save your changes and visit your website to make sure that everything is working as expected.

Bottom Line 

That’s it, we hope this article helped you learn how to add HTTP security headers in WordPress.

When a user visits the site through their browser, the server adds HTTP headers, including HTTP security headers, to the responses. HTTP allows you to add an extra layer of security to your WordPress site. They can help prevent common malicious activities that affect the performancePerformanceRefers to how fast a website or web application loads and responds to user interactions.
More About Performance of your website.

These headers tell the browser how to behave when communicating with the site. Basically, these headers are composed of metadata.

Now that you’ve added the HTTP security headers to your website. You can test your configuration using the Free Security Headers tool. Just enter your website URL and click the Analyze button.

It will then check your website’s HTTP security headers. and will show you a report. The tool generates a so-called quality tag, which you can ignore because most websites will get a B or C grade at best without affecting the user experience.