Install Render Better’s Shopify theme support code for custom hostnames

Render Better provides code for Shopify themes to help with the integration between Render Better and Shopify and to make it easier to control Render Better from within Shopify. During the onboarding to Render Better, the below code changes should be made to a Shopify theme before launching a Shopify site on Render Better.

Why is the support code needed?

During the installation of Render Better, your website’s primary domain is pointed at Render Better and a subdomain is created to point directly at Shopify. The subdomain is needed to pull the website content for Render Better to optimize (the HTML, CSS, JavaScript, images, etc.) and to redirect visitors to when they go to checkout (Shopify does not allow Render Better to sit in front of Shopify’s checkout page). Typically, that subdomain is a shop subdomain on your domain, such as shop.your-shopify-store.com, that is set up during your onboarding.

Provided the two domain set up, the Shopify theme support code is meant to ensure…

  1. … visitors don’t accidentally end up on that Shopify subdomain directly
  2. … cookies are properly shared between the Render Better site and the Shopify subdomain
  3. … search engines don’t index the Shopify subdomain

In addition to the above, the theme support code makes it easy to enable or disable Render Better and change a few of it’s settings through the Shopify Theme Customizer.

Steps to install the support code

Before you get started, it’s important understand the two domains needed by Render Better that have been set up for your site (as explained above) since they will need to be replaced in the code we provide in our support code installation instructions below.

Typically, these two domains will be:

  • Render Better Domain
    • Typically www.<domain>.com or <domain>.com
    • This is the domain that Render Better will be optimizing and where visitors will be sent
  • Shopify Subdomain
    • Typically shop.<domain>.com
    • This is the the Shopify subdomain, where visitors will be sent to checkout. Render Better will make sure visitors that aren’t currently checking out are sent to the Render Better domain.

Toggle each of the steps below and follow the directions provided to implement Render Better’s support code.

‣
Add the Render Better support snippet snippets/renderbetter-support.liquid
‣
Include the support code snippet in layouts/theme.liquid
‣
Replace instances of the canonical link tag
‣
Add the templates/robots.txt.liquid code
‣
Add the config/settings_schema.json code
‣
Add the Shopify Subdomain and Render Better Domain in the Shopify Theme Customizer

And you’re done! If you have questions, please reach out to success@renderbetter.com.