Shopify SEO… Indeed, Shopify brings you the benefits of a polished conversion-focused platform. I should say it again – Shopify provides the fastest and easiest way to buy stuff online, probably. Especially when Shopify Accelerated Checkouts are in use. Shop Pay, Apple Pay, Google Pay, Amazon Pay are currently available in the selected countries.
Sometimes the benefits of using extremely optimized non-open-source solutions come at a price though.
Website speed and SEO issues are normally addressed on various levels:
- Content (images, image/text ratio, etc)
- Code (optimization, lazy-load, the asynchronous loading of the scripts, etc)
- Server-side (caching, redirects, compression, package versions, etc)
Considering Shopify SEO, you lack the ability to control server-related optimization. The company’s reps keep explaining that the software and infrastructure are already optimized for best performance and best SEO, however, this is where I have to disagree. And probably accept this is the case when you try to adjust and get most of the possible improvements applied.
In this post, I’ll make a recap of mostly specific Shopify SEO practices. So let’s start with the least platform-dependent recommendations.
Content
If SEO is the language you speak with the search engines, then schema, markup, structure, and stuff like CLS is the body-language, while your text and visual content represent the verbal interaction.
Your goal is to use the well thought and unique metadata for as many products as possible
It’s also a good idea to include the reassurance in meta-description: tell your client about the free shipping offer and your friendly money-back policy. Only make sure it takes no more than 20-25% of the whole meta-description to keep most of it unique.
The product-related meta-tags can be edited by going to Products -> All products -> Edit product -> Search engine listing preview (scroll down)
Do not forget about collections and pages metadata
For the homepage and collections meta-title and meta-description, aim to be less product-specific yet keeping it unique and avoid being spammy.
Collection SEO is changed by going to Products -> Collections -> Edit collection -> Search engine listing preview (scroll down)
Shopify home page SEO settings can be found in Online store -> Preferences:
Shopify an Open Graph tags (og-tags)
Open Graph, as well as other meta-tags, are normally added to the <head> of a website. In Shopify, Open Graph tags are mostly wrapped in Liquid tags. This is just one example of how it may look in your theme:
{%- assign og_title = product.title | strip_html -%}
With Shopify, many custom and premium themes compile these tags into a separate snippet included in the head of the theme.liquid file.
Some themes use the standard if/endif conditions like this:
{% if settings.enable_opengraph %}
{% if template contains ‘product’ %}
<meta property=”og:type” content=”product”>
<meta property=”og:title” content=”{{ product.title | strip_html | escape }}”>
{% for image in product.images limit:3 %}
<meta property=”og:image” content=”http:{{ image.src | product_img_url: ‘grande’ }}”>
<meta property=”og:image:secure_url” content=”https:{{ image.src | product_img_url: ‘grande’ }}”>
{% endfor %}
{% endif %}
{% endif %}
Open Graph tags affect how your page previews being shared on social networks.
Do not forget to test if the result looks as expected with Facebook Debugger
Images
I’ve seen it many times in my career: people fail to compress and optimize their graphic content for WEB. Yes, today most internet connections allow you to download megabytes of data within seconds, but mobile internet can sometimes be unstable while the mobile experience of your customers should be one of your top priorities.
Just follow these simple steps when you add pictures to your website:
- Always compress your images (TinyJPG and TinyPNG are good tools that serve the purpose)
- Use Image Optimizer app to compress your existing pics
- Do not forget the alt attribute with the descriptive “text version” of your image
- Avoid resizing the picture with HTML or CSS
More tips about the images SEO best practices can be found here.
Navigation
I have already mentioned it in my previous post. Navigation seems simple but it’s often messed up on many eCommerce websites. Avoid mixing the product category grouping criteria. Choose a single approach and keep it simple as it should be. Make it easy to navigate your content for both users and search engines.
Sitemap
This is a tricky one. In Shopify, sitemap.xml is generated automatically, but you have to remove password protection from your store (in case you’ve not gone public yet) before you start trying to find it where it should be: at yourdomain.com/sitemap.xml (even if you’re logged in or entered the password before).
Chances are, you are now reading this post because you googled “edit shopify sitemap”. The short answer for this query would be: you cannot.
There are several options though, depending on what you want to change in your sitemap.
However, if you need full control over your Sitemap, I recommend:
- Using a 3rd-party Sitemap app from Shopify Marketplace
- Having your Sitemap generated using the API
Both options would give you an external link with a new sitemap that you can then submit in your Search Console.
If you need help submitting a sitemap in Search Console, please get familiar with this instruction from Shopify.
Shopify SEO and Robots.txt
The robots file is another thing you cannot edit if you decided to enjoy the most known eCommerce platform. Just in case you’re not familiar with SEO at all, robots.txt is a file where you specify rules that tell search engines if you want to allow or disallow indexing of certain content.
I should say this is not something to worry about, since robots.txt file generated by the platform does not do any harm to your Shopify SEO efforts. It’s pretty standard and the rules in this file make perfect sense.
However, in some cases, your SEO agency may give you a fancy presentation with the list of recommendations they want you to apply to improve your ranking. It’s my humble opinion, but in most cases, you will never hit the perfect 100% here. So do not worry if you cannot access the actual robots.txt file to add all of the rules your search optimization specialist wants you to apply.
What you want to do here, is to tell search engines to skip indexing of certain URLs differently. Instead of modifying robots.txt file (which is much easier, but you don’t have this option anyway…), you would set the following tag for some URLs:
<meta name="robots" content="noindex" />
I’ll cover the most reported URLs here. So when your SEO consultant asks you to add the following rules to your robots.txt:
Disallow: *?limit=*
Disallow: *?pr_prod_strat=*
Disallow: *?SID=*
Disallow: *?variant=*
Disallow: *?tracking=*
Disallow: *?variant=*
Disallow: *types?*
Disallow: *vendors?*
Most of these things can be addressed by using the Shopify indexing management app like Sitemap & Noindex Manager
Shopify support would not give you any solution here and will probably suggest you try adding a rule in a liquid file like:
{% if handle contains ‘pr_prod_strat’ %}
<meta name=”robots” content=”noindex”>
{% endif %}
The problem is ‘pr_prod_strat’ is not a part of a handle. This approach works with some of the URLs you want to disallow but is not universal at all.
If you still do not want to install and pay for the 3rd-party app and want to do this filtering manually. Should me a DM on Instagram and I’ll help you out!
Pagespeed and Shopify SEO
Page speed optimization is a service that’s becoming very demanded lately. I attribute it to the fact your speed score is on the surface, especially with Shopify, where your speed score is always displayed in Online Store -> Themes -> Speed Score section.
More details as well as historical speed score can be found in Analytics -> Reports -> Behavior -> Show more -> Online store speed
It wasn’t the case before. Business owners and particularly solo eCommerce entrepreneurs have normally found out about the issues with their site speed after receiving reports from consultants or just out of curiosity. Now everyone is using tools like Lighthouse and GTmetrix and fight for the A grades.
Now, this is just my personal opinion and my industry-mates might disagree with me on this one… It’s much more efficient to focus on delivering quality products and content and providing exceptional customer service. This is what makes your brand unique and demanded.
If you find yourself in a red zone of under 49 (on Google Pagespeed), you are in a good company…
However, it doesn’t mean you have to neglect the speed and performance of your website. Not at all. But your primary focus should be user experience. Your speed score can be 10, but the website is still working super fast for the actual user. I do not try to say you should not aim for a better score though. If you can hit the higher one at the low costs, go for it. But if you have to sacrifice or wait for the perfect score to go live, postpone… That does not bring you the profits, but quicker actions and hypothesis testing do.
We’ve noticed some intermitted issues with Shopify CDN in certain locations (primarily Eastern Europe) which were not related to the internet connection of the client (different countries, e.g. Latvia and Ukraine, both on a stable 100Mbps+ internet). We’ve noticed that happening on multiple merchants. And switching to Shopify Plus doesn’t help here, since it is still using the same infrastructure.
I highly recommend using external CDNs like Cloudflare. That would also contribute to your speed score.
Another thing I recommend digging into is the so-called CLS or Cumulative Layout Shift. Sounds nerdy, right? Remember those sites where the content is jumping up and down while the page elements are loading? Or, here’s the example. You are buying a product so you want to click the “Add to cart” button and then when you’re just about to do it the button shifts just below your cursor because the product rating widget above loaded with delay. Even if Google hasn’t made CLS a part of Core Web Vitals, I can hardly imagine a person saying that button running away from you is what we call a good user experience.
Schema
Get familiar with Schema.org to make use of the benefits rich snippets may provide. With Schema you can include some extra information that may help you get featured within search results.
I highly recommend starting collecting product reviews as soon as possible. Not only it builds trust, but it also gives you a yellow advantage in the search results.
And just in case you need to add an extra hreflang tag
You can add an additional hreflang tag in your Shopify theme’s head liquid file. The idea is to hardcode the replacement of the domain name for another localized version of your store:
<link rel="alternate" href="{{ canonical_url | replace: shop.domain, 'www.us.store.com' }}" hreflang="en-US" />
In the scenario above we want to let engines know that the US version of the website is available at www.us.store.com, so we replace whatever our default shop domain is (shop.domain variable) with www.us.store.com.