# .htaccess file

The .htaccess file is a simple configuration file used by Apache-based web servers. It lets you control key settings for your website, such as redirect rules, caching, security headers, and more — all without needing access to the server’s main configuration.

For Elements sites, you can use .htaccess to improve security (via headers like CSP and X-Frame-Options), enforce HTTPS, enable compression, and make your site more robust.

Below is a basic, recommended starting point for your .htaccess file.

```
# Enable URL rewriting (required for pretty URLs, redirects, etc)
<IfModule mod_rewrite.c>
  RewriteEngine On
</IfModule>

# Security Headers
<IfModule mod_headers.c>
  Header always set X-Content-Type-Options "nosniff"
  Header always set X-Frame-Options "SAMEORIGIN"
  Header always set Referrer-Policy "strict-origin-when-cross-origin"
  Header always set Permissions-Policy "geolocation=(), camera=(), microphone=()"
  Header always set Strict-Transport-Security "max-age=63072000; includeSubDomains; preload"
</IfModule>

# Enable Gzip compression
<IfModule mod_deflate.c>
  AddOutputFilterByType DEFLATE text/plain text/html text/xml text/css application/javascript application/json
</IfModule>

# Disable directory listing
Options -Indexes
```

### Adding an .htaccess file to your website in Elements

Right-click inside the page of your project and choose `New File` from the contextual menu. Name the file `.htaccess` and ensure it is in the root of your website.

<figure><img src="https://3876014504-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNy6AECEVH2p4eFDicpM1%2Fuploads%2FrERvf951baesyvF3b3I2%2FCleanShot%202025-07-15%20at%2010%E2%80%AF.34.46%402x.png?alt=media&#x26;token=795bf5ac-1d51-4292-b512-0440b1978d31" alt=""><figcaption></figcaption></figure>

### Pretty URL's in the Elements CMS

See also; [Pretty URL's](https://docs.realmacsoftware.com/elements-docs/elements-app/cms/pretty-urls) on using the .htaccess rules to rewrite how urls are displayed in the CMS.

### CSP (Content Security Policy)

CSP is a security feature implemented via HTTP headers that tells the browser which content it’s allowed to load (like scripts, styles, images, etc). The main goal is to prevent attacks like cross-site scripting (XSS) and data injection by controlling what sources are considered safe.

You can test the security headers for your website at: <https://securityheaders.com>

```
# Enforce HTTPS
<IfModule mod_headers.c>
  Header always set Strict-Transport-Security "max-age=63072000; includeSubDomains; preload"
</IfModule>

# Prevent MIME-type sniffing
<IfModule mod_headers.c>
  Header set X-Content-Type-Options "nosniff"
</IfModule>

# Prevent clickjacking
<IfModule mod_headers.c>
  Header always set X-Frame-Options "SAMEORIGIN"
</IfModule>

# Control referrer information
<IfModule mod_headers.c>
  Header set Referrer-Policy "strict-origin-when-cross-origin"
</IfModule>

# Control browser features
<IfModule mod_headers.c>
  Header set Permissions-Policy "geolocation=(), camera=(), microphone=()"
</IfModule>
```