Embedding a website inside another is one way that attackers may try to steal information. To avoid having your website embedded into another, modern web browsers are equipped to read an X-Frame-Options header to determine if the embed is allowed.
By default, WordPress enables this header on admin and login pages, but leaves everywhere else up to you. Since the default WordPress behavior doesn’t cover the front-end of your site, things such as forms or login pages that are outside of your WordPress admin still need to be protected.
In this article, we’ll show you how to help protect the front end of your WordPress site from clickjacking attacks by using the X-Frame-Options header.
Recommended Alternative: Content-Security-Policy Headers
Although X-Frame-Options headers may still be necessary for supporting older browsers, the recommended method of enabling clickjacking protection on your WordPress site is to use the frame-ancestors directive within the Content-Security-Policy headers instead.
For more information on how to set these headers on your WordPress site, take a look at the following articles:
- For WordPress sites hosted at Pagely, you can set Content-Security-Policy headers in Atomic.
- For all other WordPress sites hosted elsewhere, you can use our code snippet example for adding Content-Security-Policy headers.
Enabling Clickjacking Protection (X-Frame-Options) with the Security Headers Plugin
- Begin by logging into your WordPress admin.
- Next, install and activate the Security Headers plugin.
- Now that the plugin has been installed, access the plugin’s option by hovering over Settings, then clicking on HTTP Headers on the left side menu.
- To enable the X-Frame-Options header, enable the checkbox labeled Restrict Framing of Main Site.
- Finally, save your settings by scrolling down to the bottom of the page and clicking on Save Changes.
