XML and HTML sitemaps on Shopify are equally important.
They help search engines index your website and help users navigate it, so you’ll want to make sure you get both of these set up on your website.
But what’s the best way to add and manage them?
As a sales and marketing specialist at Magical Apps, I surveyed about 600 Shopify store owners earlier this year to learn how I can help them get more out of their websites.
One of the biggest complaints I heard from merchants was that there wasn’t enough time in the day to spend on technical website updates and upgrades. Some knew what sitemaps were. But many didn’t. And most had no interest in becoming an expert. They have a business to run.
So, I know that turn-key solutions are valuable to merchants like you. Because your time is valuable.
Solution
The best way to add an XML or HTML sitemap to your website is to use an app that can either guide you through the process or create the sitemap for you.
To come to this conclusion, I spent some time learning about the native and app-based solutions available for adding sitemaps on Shopify. Here’s a summary of my findings:
- XML sitemaps cannot be created natively. But they can be created from scratch.
- App solutions for XML sitemaps will help you take advantage of the Shopify-generated sitemap. This saves you time and effort.
- HTML sitemaps can be created natively, but you’ll need to be comfortable with coding to build one within Shopify.
- App solutions for HTML sitemaps can get you up and running with a custom HTML sitemap in just minutes.
Below, I will review all of the options for creating an XML sitemap and HTML sitemap natively, and then share what app solutions exist.
Native Solutions for Adding a Sitemap to Shopify
Lack of True Native Support
It is possible to add a sitemap natively on Shopify, but there isn’t a very clear-cut way to do this on your own.
The process for creating an XML sitemap and an HTML sitemap differs, so we can look at both of these separately.
XML Sitemap
Custom XML Sitemap
Shopify does not support the creation of custom XML sitemaps natively. Shopify automatically creates XML sitemaps for all its stores and doesn’t allow any modifications. By standardizing the sitemap, Shopify can be sure its users are always getting the essentials.
If you want to create your own custom XML sitemap, you will need to:
- List all the URLs for each page of your website
- Code each URL in XML format. You will likely want to use a text editor like Notepad or Sublime Text.
- Host the sitemap with a traditional host or cloud hosting like Amazon. This is because Shopify will not allow you to upload a custom XML sitemap.
- Submit your XML Sitemap to search engines.
Shopify-Generated XML Sitemap
Shopify has outlined a process for submitting your XML sitemap to Google.
To submit your XML sitemap, you must first verify your website with Google. You’ll need to access your Google Search Console.
You’ll be asked to choose a property type which I’ve noted below.
- Domain. Choose this if you have a third-party domain that has not been transferred to Shopify.
- URL Prefix. Choose this if you have a domain that you purchased through Shopify, or a “my.shopify.com” domain.
After that, you’ll be prompted to verify ownership using one of several methods.
If you have Google Analytics set up, you can select this option and Google Search Console will check your website for the tracking code. If it’s properly installed and you have the correct permissions, Google Search Console will verify you as the owner.
If you do not have Google Analytics installed, then the next best option is the HTML tag option which is still fairly straightforward.
Click on the HTML tag option. You’ll need to copy this HTML tag, then go to your Shopify’s theme admin panel, and click Online Store > Themes > Actions > Edit Code.
In the layout section, click theme.liquid, and paste the code on a new line under <head>.
Casey from Shopify goes over this step in more detail and shows you how you can verify your website using the HTML tag option.
Go back to your Google Search Console and select “Verify”. Once your site is verified, you’ll have access to your full dashboard on Google Search Console.
Next, click on “Sitemap” in your console and add your XML sitemap link. The basic default sitemap for your website provided by Shopify can be accessed by adding the suffix /sitemap.xml to your domain in your URL.
For example, www.domain.com/sitemap.xml
If you’ve done this correctly, Google will clearly display “Success”.
This might seem intimidating if you’re not used to editing code, but I can tell you it’s more simple than it looks. I am by no means an experienced web developer, and when I learned how to do this myself it only took me about 10 minutes to follow these instructions.
HTML Sitemap
At the time of writing, there are no native features within Shopify that allow you to easily build a custom HTML sitemap.
Setting up an HTML sitemap natively will require you to edit code and potentially source or create your own code snippet if you want the sitemap to update automatically in the future.
- First, you’ll need to create a new page template for your sitemap. From your Shopify admin dashboard, go to Online Store > Themes > Actions > Edit Code and under the Templates directory, click “Add a New Template”. This will create a new template page which will be used specifically for the sitemap.
- Next, you’ll need to copy the basic layout. Copy all of the content from the page.liquid template and paste it into your new template page. This will copy over the look and feel of the rest of your website.
Now, you can add sitemap content. There are two ways to do this:
- The first option is to manually add all of the links. It might help to have all of these links organized on a separate doc to make this process easier, however you can expect this to take a lot of time.
- The other option is to create a code snippet that will automatically generate a list of all the products and collections.
I am unable to verify the functionality of any third-party custom code snippets. But if you’d like to see an example, you can view this forum for a code snippet that Adds HTML Sitemap to Footer of Website.
Once that’s done, create a new page named “Site Map,” and apply the custom template you’ve just created.
Which native solution do you recommend?
XML Sitemap
- Small- to Medium-sized Stores: Shopify-generated XML sitemap
- Large, Complex Stores & Tech-Savvy Merchants: Custom XML Sitemap
If you want to create your own custom XML Sitemap, you’ll need to be comfortable with coding and hosting the sitemap yourself as Shopify doesn’t allow any modifications to the existing sitemap.
This might be the way to go for SEO developers who need more control over how their content is presented to search engines, especially for large and complex stores.
If you have a small or medium-sized store, submitting the Shopify-generated XML sitemap is the way to go.
HTML sitemap
If you’re thinking of setting up an HTML sitemap yourself, I would recommend automating this process with a custom code snippet.
Manually updating it anytime you have website changes can take a lot of time and effort.
Shopify doesn’t provide a direct code snippet for creating a custom HTML sitemap in any of their guides because sitemap needs can vary from store to store. Larger stores have different needs from smaller stores and will organize their content in unique ways.
If you source or create a code snippet yourself, you’ll need to be comfortable with Shopify’s Liquid template language to generate dynamic content.
App Solutions for Adding a Sitemap to Shopify
Although Shopify doesn’t have an easy way to add a custom sitemap to your website natively, the good news is that apps can do this for you automatically. You’ll never need to worry about your sitemap again.
Here are some apps that you can consider:
Magical XML/HTML Sitemap
- Provides link and guide to create and submit your XML sitemap
- Provides a custom HTML sitemap with a simple builder and flexible options
- One simple plan includes all features
SEO Sitemap Builder
- Fast and easy one-click HTML sitemap
- Basic HTML customization
- No product limitations
Sitemapper Pro SEO Sitemap
- Locale-based XML sitemaps
- Multilingual XML and HTML sitemaps
- No-index and no-follow features
Custom XML Sitemap Builder Pro
- Fully custom XML and HTML sitemaps
- Ideal for stores with thousands of products
- Reporting features and helpful stats
Read our comparison of the 4 best Shopify Sitemap apps to get deeper insight into what these apps offer.
Which app solutions do you recommend?
Given everything I’ve learned about the importance of submitting an XML sitemap and the benefits of having an HTML sitemap, I would recommend using an app that does both for you.
Magical XML/HTML sitemap is the best overall app for small and medium stores looking to get set up with a simple HTML sitemap or submit their XML sitemap within minutes.
Pricing is simple and includes everything. You won’t have to worry about being asked to upgrade for additional features after installing.
You can download the app and read How to Setup an XML and HTML Sitemap on Shopify Stores With the Magical Sitemap App for detailed instructions.
Using an app is the fastest and easiest way to create and manage your sitemaps.
Setting up an XML sitemap natively and keeping it updated regularly requires a lot of technical skill and time. For HTML sitemaps, the process of setting this up natively is even more cumbersome as it requires coding skills and manual updates.
Apps simplify this process by providing tools that help you locate your XML sitemap, create your HTML sitemaps quickly, and enable easy ways to update and manage them. Most store owners will get what they need from the Shopify-generated XML sitemap.
Overall, Shopify apps will save you time and effort, which is crucial for store owners who need to focus on running their business rather than coding and technical website updates.
Magical XML/HTML Sitemap
Easily add customizable XML/HTML sitemaps, improve navigation, and start ranking higher on Google with the Magical XML/HTML Sitemap app.