Manually configure SSL/TLS for a custom domain

If you're hosting your content on a custom domain, you have to secure it with an SSL/TLS certificate to make sure it's safe for your audience. In this article, we’ll explain the basics of SSL/TLS and help you manually configure your certificate.

What is SSL/TLS?

TLS, formerly known as SSL, keeps the connection between a web server and a browser encrypted and private. TLS also proves to visitors that you are the owner of the hostname a Foleon Doc is published on.

To check if a connection is private, simply enter a URL into your browser’s address bar and check if it automatically navigates to HTTP or HTTPS.

In the example below, you can see that the connection of foleon.com is secure. The URL starts with HTTPS and the lock icon in the address bar also represents a safe domain.

✅ HTTPS - A certificate is installed and the connection is private/secured.
❌ HTTP - No certificate installed and the site’s connection is not secured.

If a certificate is not installed, it’s possible that visitors will see a message stating that the website is not secure and won’t be able to continue. In the example below, you can see what this message might look like in Google Chrome.

Your domain setup and SSL/TLS

You have 2 options to host your Foleon content: using a (free) Foleon domain or your own custom domain.

• Use a (free) domain — If you use a (free) Foleon domain, your content is automatically secured with an SSL/TLS certificate by us.

• Use your own custom domain — If you're using a custom domain to host your content, you have to secure your Foleon Docs with an SSL/TLS certificate.

We generate an SSL/TLS certificate — for free — and automatically renew it. However, you can also choose to manually configure your certificate. In the next section, we’ll explain which steps to take for a manual SSL/TLS setup.

What do you need to manually secure your domain?

In order to make your custom domain secure with an SSL/TLS certificate, you will need the following files:

• A certificate (PEM-formatted). The file extension is usually .crt, .cert or .pem.

• A private key (without a password) with encryption algorithm RSA-2048

• Certificate intermediates (needed for image thumbnails when sharing the URL)

You can purchase a certificate at a certificate vendor (this doesn’t have to be your hosting provider). They might request a CSR (Certificate Signing Request) from you. Learn how to create a CSR in our article How to create a CSR (Certificate Signing Request).

How to manually configure your SSL/TLS certificate

If you haven't created a custom domain yet, that's where you'll need to start. 

In the Foleon Dashboard, click account in the left sidebar and go to domains. Click + new domain to get started.

Alternatively, go to the project you want to set up the hosting for. In project settings, scroll down to your domain setup. 

Click + new domain if you still need to set up a custom domain. 

If you want to manually add an SSL/TLS certificate to an existing custom domain you've already set up, go to the domains overview and click edit for the relevant domain. This will prompt the domain setup modal.

When you go through the custom domain setup, the third step covers the SSL/TLS certificate.

Once you select manually configure your SSL/TLS certificate, the certificate configuration button will appear.

In the SSL/TLS Configuration pop-up, you will see three fields: Certificate, Private key, and Intermediates.

In the video below, you can learn how to extract the codes from your certificate (using Atom.io). The relevant section starts at 0:34.

Here are a few free examples for extracting the core code:

• Atom - https://atom.io/

• Sublime Text - https://sublimetext.com/download/

• Visual Studio Code - https://code.visualstudio.com/

• Brackets - http://brackets.io/

As stated before, you will see three fields in the SSL/TLS Configuration pop-up. We go over each field below:

• Field 1 - Certificate
  
  The certificate starts with -----BEGIN CERTIFICATE----- and ends with -----END CERTIFICATE-----, which need to be included in the code that you insert in the field.

  Below you can see what the code of a certificate looks like. Paste this in the Certificate field in the SSL/TLS Configuration pop-up.

  -----BEGIN CERTIFICATE-----
  
  MIIGUzCCBTugAwIBAgIQej0xgXu4s3LGVWQhepva1TANBgkqhkiG9w0BAQsFADCB
  
  kDELMAkGA1UEBhMCR0IxGzAZBgNVBAgTEkdyZWF0ZXIgTWFuY2hlc3RlcjEQMA4G
  
  A1UEBxMHU2FsZm9yZDEaMBgGA1UEChMRQ09NT0RPIENBIExpbWl0ZWQxNjA0BgNV
  
  BAMTLUNPTU9ETyBSU0EgRG9tYWluIFZhbGlkYXRpb24gU2VjdXJlIFNlcnZlciBD
  
  QTAeFw0xODA1MTQwMDAwMDBaFw0xOTA1MTQyMzU5NTlaMFoxITAfBgNVBAsTGERv
  
  bWFpbiBDb250cm9sIFZhbGlkYXRlZDEeMBwGA1UECxMVRXNzZW50aWFsU1NMIFdp
  
  HQRuMA0GCSqGSIb3DQEBCwUAA4IBAQCFpMAAJyzubsRFR//8gF+GLvoFUW9VGs/o
  
  NHvM+1u3f3269aeEQ2YSGw31G+zzrFz/TlFwHxWbFMr/f77OKdedKnYSgAp88iab
  
  VQCXtLN69x6Exnvu2I1PdNgXyfztJpOr2aeTyle4HJ4zUYWo1j4IjAFVbEthK4Dt
  
  50TfF7igkGkZJjJL5itqW6Wk4gzSGyFiQDIq0gAqE8+yy7ss7tOpBMmjXMzOZ2Gp
  
  JCzNFub8mJD5ao/HxeXHkH/NLPkzuDz2KVchwoj6R8AcncUz9/WUzDY7lqnYbIa6
  
  Qsye6bXddIs1zRRf+WMv/Mm+FW8nmMY8mNcDuWyd8nPFIytTmXu7
  
  -----END CERTIFICATE-----

  ⚠️ If your certificate files are delivered in the .PFX format, you need to convert these to .PEM or the files will not show correctly. We recommend taking this up with your certificate provider to avoid any mistakes in the conversion process. You can often request the files to be sent to you in the .PEM format.

• Field 2 - Private key
  
  The Private key starts with -----BEGIN PRIVATE KEY----- and ends with -----END PRIVATE KEY-----, which needs to be included in the code that you insert in the field.
  
  The private key,without a password, needs to be encrypted with the encryption algorithm RSA-2048.

   

  ⚠️ Only when the private key matches the certificate, will the option to Save appear. If the hostname of the certificate does not match the hostname of the private key, you will see an error message "The input appears to have a certificate but does not match the private key". If this is the case, we recommend checking your CSR and/or contacting your certificate vendor.

   

• Field 3 - Intermediates
  
  Codes from intermediates start and end with the same text as the actual certificate. This means that they will start with -----BEGIN CERTIFICATE----- and end with -----END CERTIFICATE-----, which need to be included in the code that you insert in the field.

  Usually, the intermediate certificates are attached to your certificate and private key. If not, you can likely download them from the website of your SSL/TLS vendor.

  ⚠️ It isn’t mandatory to upload the intermediates (CA-certificates) but we highly recommend it for a higher rating of your certificate. You will need intermediates if you want an image thumbnail to show when sharing your content on social platforms such as Facebook or LinkedIn.

  Check out the image below to see what this should look like in the SSL/TLS Configuration pop-up.

  

That's it! After you’ve correctly inserted your SSL/TLS certificate codes, you’ll get a success message.

You can go ahead and publish and share your Foleon Doc. HTTP traffic will be automatically redirected to HTTPS once we’ve processed and installed your certificate. This will be done within 30 minutes after successfully uploading your certificates.

How to renew your SSL/TLS certificate

If you decide to manually configure your SSL/TLS certificate, it will likely have an expiry date.

This means that you will have to renew your certificate when it's going to expire. Let's say your SSL certificate is due to expire on the 1st of January 2022. You will have to contact your SSL/TLS vendor again and inform them that you want to purchase a new certificate.

If you use the same SSL/TLS vendor, it's possible that they still have your CSR details. If this is the case, it's not necessary to create a CSR again (if the hostname of your project didn't change).

To renew your certificate, click edit and delete the previous code. Place the new information in the relevant fields and click save.