Installation

How to enable Edgemesh Server Preview on your site
 Edgemesh Server is currently in early access preview.  Contact your Edgemesh representative to see if you are eligible for the early access program.
Enable Edgemesh Server with Edgemesh
The first step to setting up Edgemesh Server for your site is getting in contact with your Edgemesh Representative and having your domain whitelisted and enabled. Ensuring this is done prior to setup will reduce the amount of downtime from switching over to Edgemesh Server.  You will need to provide Edgemesh with your primary domain and the domain or address to proxy to.
Forward your DNS to Edgemesh
To finish your Edgemesh Server setup, you need to point your primary domain to Edgemesh's Proxy Service. Each DNS provider will have slightly different interfaces/methods to do this:
Delete any existing DNS records (A or CNAME) that point to your primary domain.
Create a CNAME record for your primary domain and point it to proxy.edgeme.sh.
If your DNS provider does not support CNAME Flattening, a naked domain (@) might not work.  If this is the case please use www as the CNAME.
Additional Requirements for Shopify
Create your Checkout Domain
Shopify requires that your checkout is resolved with them.  The first step is to create a CNAME record for your checkout and point it to Shopify.  Let's call it checkout.
All DNS providers a slightly different, so you will have to determine how to do this for your hosting provider:
Create a CNAME record for your checkout subdomain.
Point the CNAME to shops.myshopify.com.
Set the TTL to Auto or 1 Hour.
Add Checkout Domain to Shopify
Now that the DNS is done, lets go to your Shopify Admin and update the custom domain.
From your Shopify Admin, go to Online Store > Domains.
Click Connect Existing Domain.
Enter your new checkout domain (checkout.yourstore.com).
Click next.
Wait for the SSL Certificate to be issued.
Promote the new checkout domain to the primary domain.
Add Redirect Script to Theme
Go to Layout > theme.liquid and add the following script below the {{ content_for_header }} tag. Replace yourstore.com with your primary domain.
<script id="ems-redirect" type="application/javascript" src="https://yourstore.com/ems-redirect.js"></script>
Your website will now be redirected to Edgemesh Server when an external link sends them to another URL that resolves to your shop.  
Solving Common Caveats 
Your Shopify Edgemesh Server installation is complete.  Depending on your theme, there may be some additional changes required to get full functionality.  Any server side liquid variables might end up being cached and therefore need to be moved to the client side. Below is a list of common problems and their solutions:
Cart Badge Icon
Cart badge icons are commonly powered by the {cart.item_count} liquid variable.  To get this feature working again, it needs to be moved to the client side. The following is an example of how to achieve this.
Given the liquid icon button:
<a class="cart-button">
    {% if cart.item_count > 0 %}
        <span class="icon icon-circle">
            {% cart.item_count %}
        </span>
    {% endif %}
    <span class="icon icon-cart"></span>
</a>
Add a classes to control element visibility.
.hidden {
    display: none;
}
Update the icon to not depend on liquid variables.
<a class="cart-button">
    <span id="cart-button-badge" class="icon icon-circle hidden"></span>
    <span class="icon icon-cart"></span>
</a>
Create a snippet called cart-button-badge.
<script type="text/javascript">
  // Fetch the cart
  fetch('/cart.js').then(res => res.json()).then(cart => {
    
    // Get the cart button element
    const cartButtonBadge = document.getElementById('cart-button-badge')
    
    // Based on the item count, render the badge
    // This will differ based on your theme
​
    if (cart.item_count > 0) {
    
      // Make the badge visible
      cartButtonBadge.classList.remove('hidden')
      
      // Update the count value
      cartButtonBadge.innerHTML = cart.item_count
      
    } else {
    
      // Hide the button badge element
      cartButtonBadge.classList.add('hidden')
      
    }
  })
</script>
Add the snippet to your main theme file's <head> element.
<% render 'cart-button-badge' %>
Now your cart button badge is rendered client side and you can take advantage of Edgemesh Server's enterprise grade caching without losing any functionality.
Integrations - Previous
Google Analytics
Next - Edgemesh Server (Preview)
Dynamic Fragments
Last updated 3 weeks ago