SSL in Studio

WordPress Studio includes support for HTTPS, allowing you to create sites with secure connections that more closely resemble production environments. This feature makes your local development experience more realistic and helps identify potential issues that might only occur with HTTPS.

Overview

The SSL support feature in WordPress Studio enables:

• Creating sites with HTTPS enabled
• Using custom domains with proper SSL certificates
• Automatic certificate management
• Browser compatibility without security warnings (when trusted)

How it works

WordPress Studio implements SSL support through the following components:

• Certificate Authority (CA): Studio creates its own Certificate Authority that signs certificates for your local sites.
• Domain Certificates: Each site with HTTPS enabled receives its own certificate signed by the CA.
• Certificate Trust: The system helps you trust the certificate on your operating system.
• HTTPS Redirection: Traffic is automatically redirected from HTTP to HTTPS for sites with SSL enabled.

Enabling HTTPS for a site

Note that HTTPS requires a custom domain, as it cannot be used with the default localhost address.

To enable HTTPS for a new or existing site:

1. Start by creating a new site or editing an existing site using the “Edit site” button on the Settings tab.
2. If creating a new site, toggle “Advanced setting” in the modal that appears.
3. Check the “Use custom domain” option.
4. If you have not already provided one, enter a domain name (must end with .local) or use the automatically generated one.
5. Check the “Enable HTTPS” option.

6. Click the “Add site” or Save button, depending on whether you are creating a new site or editing an existing one. 
7. When prompted, give your permission for Studio to modify the system hosts file. Studio will configure everything else automatically. 
8. For HTTPS connections, a root certificate authority will be generated and installed. On MacOS, you’ll need to manually install the certificate to avoid browser warnings. Refer to the guide below for more details.
9. Navigate to your site using the custom domain.

Certificate Trust by platform

Windows

On Windows, WordPress Studio automatically adds the CA to your system trust store. This process requires administrator privileges, so you may see a User Account Control (UAC) prompt when enabling HTTPS.

MacOS

On macOS, you need to manually trust the CA. To do this, find the certificate file that Studio automatically installs on your system:

1. Navigate to the Settings tab of the site with SSL enabled.
2. Click on the “Trust Certificate” link under Site Details.

3. This will open the folder containing the certificate file (studio-ca.crt). Double-click the file to install the certificate and automatically open the Keychain Access tool on your machine.
4. Locate the WordPress Studio CA certificate. You can filter the items by the word studio.

5. Double-click the certificate and expand the Trust section.
6. Set “Secure Sockets Layer(SSL)” to “Always Trust.” You can leave all other settings the same.

7. Close the dialog and enter your password to confirm.

Once the certificate is trusted, your browser will recognize it and indicate that your HTTPS sites are secure.

Troubleshooting

Browser security warnings

If you see browser security warnings when visiting your HTTPS-enabled site:

• Ensure you’ve trusted the WordPress Studio CA certificate on your system.
• Restart your browser after trusting the certificate.
• Clear your browser cache if warnings persist.