This feature is available to our Premium customers.
Many teams have purchased custom domain names for their websites and they want to use them with their SwimTopia / Team Topia (non-swim) websites. As we wrote in our blog post regarding our Enhanced Custom Domain support, supporting custom domain names while providing a high level of security has usually required making some trade-offs.
With the launch of Cloudflare’s free Universal SSL service, we’re now able to provide the best of both worlds: full custom domain support and top-notch security.
Covered in this Article:
What is Cloudflare and Why Should We Use It?
Cloudflare is a terrific online service that protects and accelerates websites, including many well-known sites like Etsy, Reddit, Yelp and Salesforce.com.
Cloudflare works by managing the DNS service for your website. The DNS service they provide is world-class with a global network of data centers and an easy-to-use administrative interface.
Switching your DNS service to Cloudflare does require some configuration changes at your domain registrar (such as Namecheap, Hover, GoDaddy or Register.com) but does not require you to transfer your domain name to be managed by Cloudflare (although they do offer that service as well), and you don't need more than the FREE service they offer.
➧ Why should you set up a free Cloudflare account?
Configuring your SwimTopia or Team Topia (non-swim) site to work with Cloudflare will not only enable you to use a custom domain name "natively" (without redirection to your "example.swimtopia.com" or example.teamtopia.com URL), but should make your site faster and provide insightful analytics and an additional layer of protection against denial-of-service and other threats sometimes faced by websites.
» Note: Setting up a free Cloudflare account is required to properly configure a custom domain without redirection, to be used by default with your SwimTopia / Team Topia site.
Cloudflare Setup Steps
» Tip: If you plan to use a custom domain, make sure you have access to a volunteer with knowledge in this arena. Each team is responsible for setting up, and managing its own custom domain configuration. We can try to help clarify the steps provided, but cannot access your custom domain setup to do any steps on your behalf. We provide a Troubleshooting Setup Issues section at the bottom of this article, with an option to reach out for help as needed.
➧ Step 1: Buy a Domain Name
If you haven't already, you’ll need to purchase a domain name from a domain registrar such as Namecheap, Hover, GoDaddy or Register.com. Once you have a domain secured, proceed to step two.
➧ Step 2: Add Custom Domain to your SwimTopia or Team Topia (non-swim) Site
This step requires the Manage: Website administrative privilege.
From your Team Management console (Manage Team), go to Website > Site Settings > Advanced. Input the desired domain for your site in the custom domain name field.
» Note: the domain name for the site must include a subdomain such as www as in www.example.com.
This step lets SwimTopia know that any requests it receives for this domain name should go to your website. It does not point your domain name to your SwimTopia site. For that, additional configuration is required, starting with setting up a Cloudflare account in step three.
➧ Step 3: Setup Cloudflare Account
Visit www.cloudflare.com and set up a new account if you do not have one already.
» Tip: Generally, you should set up this account using an email address that can be handed over to a future team computer administrator.
Once you have added an email address, selected a username and password and agreed to the terms of service, you should be guided through a Cloudflare setup wizard, starting with step four.
➧ Step 4: Add Domain to Cloudflare
In the “Add a website” step of the Cloudflare setup wizard, you should input the domain name for your website, something like example.com and click “Add Website”.
If you already use this domain for email or other services, Cloudflare will start by importing your existing domain configuration so that any existing services will continue to work with Cloudflare. When that process is done, you will verify and configure your records in step five.
➧ Step 5: Choose a Cloudflare Plan
In most cases, the Free plan is all that is needed to use CloudFlare and your custom domain with your SwimTopia website.
➧ Step 6: Configure your Cloudflare DNS records
Once Cloudflare has completed importing your existing records, you should review them to confirm your settings for email (denoted by MX records) and other services are intact. If you only use the domain for your website, you may only have one or two records.
At this point, you will need to add a new CNAME record to map “www” (or any other subdomain you chose) to a special DNS name corresponding to your SwimTopia or Team Topia website subdomain. This special DNS name should be set to your team's SwimTopia / Team Topia subdomain followed by ".dns.swimtopia.com" (or ".dns.teamtopia.com"). For example, if your team's SwimTopia site was “example.swimtopia.com” you would input the DNS mapping name as "example.dns.swimtopia.com" as shown below.
The Cloudflare service should be enabled by default, as in the above image. If not, click the cloud icon to enable it.
» Note: if your imported domain configuration already has a record for “www” you will likely need to delete any of those to replace it with the configuration above.
➧ Step 7: Make sure SSL setting is “Full”
Double-check the “SSL/TLS” settings for your site and make sure the SSL option is set to “Full”. This will ensure all traffic to your website is encrypted end-to-end. "Full" (not "Full (strict)") is the only supported SSL/TLS encryption mode.
» Note: it may take several minutes for this change to take effect. If you are experiencing “too many redirect” errors when trying to access your site, it is likely because the SSL setting is set to “Flexible” instead of “Full”. If you are experiencing "Error 525: SSL handshake failed" errors, it is likely because the setting is "Full (strict)" instead of "Full".
➧ Step 8: Add a page rule to redirect your root domain
Generally, if someone types your root domain (e.g. http://example.com) you will want it to work just the same as if they had typed the ‘www’ subdomain (e.g. http://www.example.com). To support this we need to set up a Page Rule to redirect all requests sent to the root domain (without the ‘www’) to the equivalent ‘www’ subdomain. This is a good practice for your website visitors but is also recommended practice for search engine optimization.
Under Rules > Page Rules, click the Create Page Rule button:
Add a new rule with the following settings:
(This rule will intercept all web requests to the root domain and redirect it to the www subdomain equivalent.)
URL Pattern: example.com/*
Pick a setting: Forwarding URL
Forwarding Type: 302 - Temporary Redirect
Destination URL: https://www.example.com/$1
» Note: Be sure to replace example.com in the above examples with your own domain name. The https:// is very important. The $1 will make sure any other path info in the URL is also transferred to the 'www' subdomain.
➧ Step 9: Add a root domain DNS record
With a Page Rule in place to route all root domain traffic to the secure 'www' subdomain, we need to add a root domain DNS record so that CloudFlare can process that rule. Return to the DNS section of the Cloudflare configuration and add the below:
To do this, under the DNS settings for your domain, add a CNAME record mapping ‘@’ to your SwimTopia or Team Topia website subdomain, such as ‘example.swimtopia.com’ as shown above. (The ‘@’ symbol indicates this is a root domain rule).
» Tip: Make sure Cloudflare is enabled on the root domain rule as indicated by the “Golden Cloud” icon.
***********************************************************
➞ GoDaddy Customers - Important Notes
If your DNS was set up through GoDaddy, it's possible there will be additional top-level records that can interfere with your SwimTopia site loading properly. If there are any CNAME or A records that point to a specific IP address you will want to remove them.
An IP address is an identifier like 172.16.25.41 that identifies a single device on the network. Your SwimTopia or Team Topia site isn't hosted on a single server, but instead "in the cloud" with multiple virtual servers that are added/removed automatically as traffic goes up and down. Thus your SwimTopia / Team Topia service is never accessed via a specific, static IP address.
That said, if you use your custom domain for email it will very likely have one or more MX records in your configuration with IP addresses. Don't remove those!
Also, ➞ See Custom Domains: GoDaddy “Forward with masking” Not Supported if using this option.
***********************************************************
➧ Step 10: Disable Rocket Loader
**VERY IMPORTANT:** CloudFlare offers a feature called RocketLoader that combines and compresses Javascript on your site for faster loading. This feature can have side effects, however, and can cause some issues with some SwimTopia functionality. We strongly recommend you disable Rocket Loader. To do so, go to the Speed tab in Cloudflare and set Rocket Loader to Off.
➧ Step 11: Update your name servers
The last step of the Cloudflare setup wizard is to log in to your account at your domain registrar and update your name servers to configure your domain name to use your newly configured Cloudflare service.
Cloudflare will provide names for 2-4 name servers. You will need to use these to update the name server configuration in your domain registrar account.
The process for making this change is different for each provider. We've provided links to the support articles for some popular domain providers below.
» Note: updating your name server configuration can take 24 hours or longer to take effect, but often takes much less time.
After completing this final step, you just need to wait for the name server changes to take effect and your domain should route through Cloudflare and to your SwimTopia site.
Cloudflare will automatically procure and manage a SSL-certificate for your domain. These certificates are required to protect the data transmitted to and from your site, and are typically expensive and require a complex purchase and setup process. Cloudflare automates that process and provides an SSL certificate free of charge, but this process also may take up to 24 hours to complete.
» Note: If your name server configuration updates before your Cloudflare SSL certificates are ready you may find that your site is accessible via your custom domain but with an SSL certificate warning/error. This error should go away as soon as the automated SSL certificate installation process is completed.
➧ Bonus Step: Submit Support Ticket to "Use Custom Domain by Default"
Once your site is up and running with your custom domain, it will be accessible via either your custom domain (e.g. www.example.com) or your SwimTopia or Team Topia subdomain (e.g. example.swimtopia.com or example.teamtopia.com).
After you've gone through the trouble to set it up, you probably want to make sure your custom domain is always used for all requests.
➞ Create a support ticket requesting that we “enable your custom domain by default”. (this is only possible with a Cloudflare account set up correctly)
When we receive this request, we will verify your custom domain configuration and flip a switch to make all requests to your SwimTopia or Team Topia subdomain redirect to your custom domain. In addition, all auto-generated emails, such as registration confirmation messages, will link to your custom domain instead of your SwimTopia or Team Topia subdomain after this change.
» Note: Your team administration console will always be accessible via either your custom domain or your subdomain (e.g. https://example.swimtopia.com/manage). This provides a failsafe in the event your custom domain registration unexpectedly expires, or something else happens that makes your custom domain unreachable. You'll always be able to access your team management console — including the ability to remove the custom domain configuration under Website > Advanced > Settings if you need to.
Troubleshooting Setup Issues
When a domain is added to Cloudflare, Cloudflare will try to automatically copy any current settings for that domain into the Cloudflare configuration. If you are seeing any issues with your domain, the issue may be that Cloudflare copied the existing DNS configuration.
➧ How can you tell if this is the issue?
- You can tell this if you open your custom domain and it goes to your old site, not your new SwimTopia or Team Topia (non-swim) site.
- You can also use a network tool called "whois" at https://www.whois.com/ to search your custom domain and see if it's configured to use Cloudflare, which it likely is if you've performed all the steps above. This would be another clue that somehow the configuration that points to your custom domain got copied into your Cloudflare configuration.
This would lead us to believe that in addition to the settings you added when following the steps above, there was an additional DNS configuration that was copied during the initial import, and this imported setting is overriding the configuration to point your domain to your SwimTopia site.
➧ Still need help?
Without seeing your Cloudflare account we don't know if our hunch is correct, but we can confirm this if you submit a support ticket with a screenshot of the "DNS" screen from your Cloudflare account. If we can see those details, we should be able to figure out why the Cloudflare to SwimTopia / Team Topia connection is not happening as expected.
It should look something like the screenshot below:
hcmanagewebsitesitesettingsadvanced
Comments
2 comments
Works like a charm, thank you very much!
If you have any problems setting up a custom domain, please reach out to help@swimtopia.com for assistance.
Please sign in to leave a comment.