How to Fool-Proof Your SSL Setup: Integrating Cloudflare with WHM/cPanel and Resolving Browser SSL Errors

Having a fully functioning SSL (Secure Sockets Layer) certificate is essential for maintaining the security of your website, protecting data transmission, and ensuring your site displays correctly across all browsers. However, integrating SSL certificates between Cloudflare and WHM/cPanel, and avoiding common SSL browser errors, can sometimes be tricky. Here's a step-by-step guide on how to fool-proof your SSL setup and eliminate browser SSL issues by integrating Cloudflare and managing SSL in WHM/cPanel.

How to Fool-Proof Your SSL Setup

Step 1: Configure Cloudflare for SSL

Cloudflare acts as a reverse proxy, managing traffic to your website, which can sometimes lead to SSL misconfigurations. To avoid common errors, ensure the SSL settings in Cloudflare are correctly configured.

1. Create an Edge Certificate

   • Log in to your Cloudflare dashboard and select the domain for which you want to enable SSL.

   • Navigate to the SSL/TLS tab and enable Universal SSL under the Edge Certificates section. This will create an SSL certificate for your domain that covers traffic between the visitor and Cloudflare’s edge servers.

   • Enable Universal SSL, you will see when you click the button this will show.

     

     

   • 
     

2. Select SSL Mode: Full

   • In the SSL/TLS Overview tab, you’ll see options to configure your SSL encryption mode. Make sure you select Full mode.

     • Full mode encrypts traffic between Cloudflare and your origin server using your own SSL certificate on the server.

   • If you select "Flexible", only traffic between the user and Cloudflare will be encrypted, but not the traffic between Cloudflare and your server.

     • 

3. Configure DNS Settings

   • Head to the DNS section of Cloudflare, and ensure that both the A record and www CNAME for your domain are set to not proxied (indicated by a grey cloud, rather than the orange cloud that represents proxied). This allows Cloudflare to manage the SSL connections without causing browser SSL warnings.

     • 

Step 2: Configure SSL on WHM/cPanel

To ensure your SSL certificate is functioning correctly between Cloudflare and your origin server, you'll need to set up SSL on your hosting server using WHM/cPanel. Here's how:

1. Generate a Private Key (in cPanel)

   • Log in to your cPanel account.

   • Under the Security section, click SSL/TLS.

   • Select Generate, view, upload, or delete your private keys and create a new private key. This private key will be used to secure the CSR (Certificate Signing Request) and eventually the SSL certificate.

     • 

     • 

2. Create a CSR (Certificate Signing Request)

   • After generating the private key, return to the SSL/TLS menu and select Generate, view, or delete SSL certificate signing requests (CSR).

     • 

   • Fill in the required information, including the domain name you want the certificate for, and generate the CSR. You will need this CSR when you apply for an SSL certificate, whether you're purchasing one or using a free SSL provider like Let’s Encrypt.

     • 

3. Install SSL Certificate via Manage AutoSSL

   • For users who want to automate SSL certificate installation, go to the Manage AutoSSL section in WHM.

   • From there, ensure Let’s Encrypt is enabled, and AutoSSL will automatically issue and install SSL certificates for your domain(s).

     • 

   • WHM will regularly check and renew the SSL certificates as long as AutoSSL is active, ensuring that your certificate doesn’t expire unexpectedly.

Step 3: Resolving Common SSL Browser Issues

After integrating Cloudflare and installing the SSL certificate on WHM/cPanel, you may still encounter browser SSL issues. Here’s how to resolve them:

1. Check Mixed Content Errors

   • Even with SSL enabled, your website may have mixed content errors if not all elements (e.g., images, scripts, CSS) are loaded over HTTPS. This issue can be resolved by ensuring all resources are served via HTTPS. Most Content Management Systems (CMS) like WordPress have plugins that can automatically convert HTTP resources to HTTPS.

2. Ensure SSL Certificate is Trusted

   • Sometimes, browsers may flag an SSL certificate as untrusted. Ensure your SSL certificate is installed properly and is signed by a trusted Certificate Authority (CA) like Let’s Encrypt or Comodo. You can verify the validity of your certificate by using online tools like SSL Labs to check its configuration.

3. Update Domain Configuration

   • If your SSL certificate is new, some DNS settings may not have propagated fully. Allow up to 48 hours for full propagation. Also, make sure that HTTPS redirection is enabled to redirect all HTTP requests to HTTPS. This can be configured in cPanel or Cloudflare.

4. Check SSL Settings in Cloudflare

   • If you’re seeing SSL warnings, recheck your SSL mode in Cloudflare. Full or Full (Strict) is recommended for end-to-end encryption, while Flexible may cause issues since it doesn’t encrypt traffic between Cloudflare and your server.

5. Free SSL checker

By integrating Cloudflare with WHM/cPanel and setting up SSL correctly, you can ensure that your website is fully protected and free of browser SSL issues. Start by enabling Cloudflare Universal SSL, choose the Full SSL mode, and ensure that your DNS records are properly configured. On the server side, use AutoSSL or manually install an SSL certificate to ensure your origin server is protected. By following these steps, you’ll create a fool-proof SSL setup that protects your visitors’ data and keeps your website running smoothly.

Resources :

1. WHM

2. Cloudflare

3. SSl Shopper

4. SSL Labs