Solved

How to create an HTML sitemap for my online store?

matloobsahmal
Tourist
11 1 0

Hi,I am trying to add HTML sitemap page on my shopify store.I have listed all the products and blogs but not sure how to list all pages of store aswell in html sitemap? Please share the code if anyone have ,thanks in advanceScreenshot_44.pngScreenshot_45.png

Matloob Sahmal
Accepted Solutions (3)

Jason
Shopify Expert
11194 225 2285

This is an accepted solution.

Create a linklist (menu) with the pages you want to show - and in your preferred order - and loop over that instead. 

★ I jump on these forums in my free time to help and share some insights. Not looking to be hired, and not looking for work. http://freakdesign.com.au ★

View solution in original post

PaulNewton
Shopify Partner
6339 579 1348

This is an accepted solution.

A sane alternative is to use an app like usemechanic to script a sitemap generator using the shopify api that then adds the generated file to the theme.

 

Jasons method of linklists will give the most control, especially in art-direction,  but suffers from having to manually create and manage all such links as it will not auto-update when new pages, or other resources,  are created .(there is no native menu api for automating this either)

 

https://shopify.dev/api/liquid/objects#pages 

 

<ul>
  {%- paginate pages by 50 -%}
      {%- for p in pages -%}
          <li>{{p.title}}</li>
      {%- endfor -%}
      {{ paginate | default_pagination: next: 'Older', previous: 'Newer' }}
  {%- endpaginate -%}
</ul>

 

 

 

Also don't forget policies, maybe the collections-list page /collections, and or things like vendor/product-type pages.

https://shopify.dev/api/liquid/objects/shop#shop-policies 

 

 

Do note that for things like collection/all , anecdotally , a store could have perf issues from having overly large collections of products

https://community.shopify.com/c/shopify-design/load-more-than-1000-products-on-a-collections-page/m-... 

 

In which case you may want to look at stuff like the map filter for optimizations, using the theme inspector tool to evaluate a possible perf problem.

https://shopify.dev/api/liquid/filters/array-filters#map

 

 

{% assign collection_titles = collections | map: 'title' %}

 

 

 

Or use an app.

 

 

 

Save time & money ,Ask Questions The Smart Way


Confused? Busy? Get the solution you need paull.newton+shopifyforum@gmail.com


Problem Solved? ✔Accept and Like solutions to help future merchants

Answers powered by coffee Buy Paul a Coffee for more answers or donate to eff.org


View solution in original post

matloobsahmal
Tourist
11 1 0

This is an accepted solution.

Thanks @Jason  for helping us.I have added your code and it is working for all Pages.if i have to add it for collections,products and blogs aswell how can i use it?Thanks in advance 

Matloob Sahmal

View solution in original post

Replies 5 (5)

Jason
Shopify Expert
11194 225 2285

This is an accepted solution.

Create a linklist (menu) with the pages you want to show - and in your preferred order - and loop over that instead. 

★ I jump on these forums in my free time to help and share some insights. Not looking to be hired, and not looking for work. http://freakdesign.com.au ★

PaulNewton
Shopify Partner
6339 579 1348

This is an accepted solution.

A sane alternative is to use an app like usemechanic to script a sitemap generator using the shopify api that then adds the generated file to the theme.

 

Jasons method of linklists will give the most control, especially in art-direction,  but suffers from having to manually create and manage all such links as it will not auto-update when new pages, or other resources,  are created .(there is no native menu api for automating this either)

 

https://shopify.dev/api/liquid/objects#pages 

 

<ul>
  {%- paginate pages by 50 -%}
      {%- for p in pages -%}
          <li>{{p.title}}</li>
      {%- endfor -%}
      {{ paginate | default_pagination: next: 'Older', previous: 'Newer' }}
  {%- endpaginate -%}
</ul>

 

 

 

Also don't forget policies, maybe the collections-list page /collections, and or things like vendor/product-type pages.

https://shopify.dev/api/liquid/objects/shop#shop-policies 

 

 

Do note that for things like collection/all , anecdotally , a store could have perf issues from having overly large collections of products

https://community.shopify.com/c/shopify-design/load-more-than-1000-products-on-a-collections-page/m-... 

 

In which case you may want to look at stuff like the map filter for optimizations, using the theme inspector tool to evaluate a possible perf problem.

https://shopify.dev/api/liquid/filters/array-filters#map

 

 

{% assign collection_titles = collections | map: 'title' %}

 

 

 

Or use an app.

 

 

 

Save time & money ,Ask Questions The Smart Way


Confused? Busy? Get the solution you need paull.newton+shopifyforum@gmail.com


Problem Solved? ✔Accept and Like solutions to help future merchants

Answers powered by coffee Buy Paul a Coffee for more answers or donate to eff.org


matloobsahmal
Tourist
11 1 0

This is an accepted solution.

Thanks @Jason  for helping us.I have added your code and it is working for all Pages.if i have to add it for collections,products and blogs aswell how can i use it?Thanks in advance 

Matloob Sahmal

Abhijeet4
Shopify Partner
1 0 0

Hey @matloobsahmal How do I display more that 1000 products in the template ?

please do help in that

matloobsahmal
Tourist
11 1 0

try it "

<ul>
  {%- paginate pages by 50 -%}
      {%- for p in pages -%}
          <li>{{p.title}}</li>
      {%- endfor -%}
      {{ paginate | default_pagination: next: 'Older', previous: 'Newer' }}
  {%- endpaginate -%}
</ul>
Matloob Sahmal