Prestige Theme: Sub-Collection and Breadcrumb help

PurpleHouse
Visitor
3 0 0

Hello, 


I am using the Prestige Theme and trying to work out how to add Sub-Collections and breadcrumbs. I know in order to accomplish what I am looking for it will need to be added within the code of my theme.
I'm hoping to add sub-collections, and sub-sub collections if possible, so my URL reads something like: 

https://your-store.myshopify.com/collections/sub-collection/sub-sub-collection/name-sub-collection 

I am transferring my store over from Squarespace and that is a feature that they have that helped a lot with my SEO.

I have a lot of categories, sub categories, and sub-sub categories within my store and would like to keep them as close to that as possible. (Category Example: Weddings -> Signs -> Table Signs)  I have already added my collection tree in the Menus in Navigation to show the different categories/sub-categories/sub-sub categories and made them each a mega-menu.

Also, as of now, my theme says it has "breadcrumbs" and they are turned on, but the breadcrumbs are not showing and I don't understand why.

My last question is: within my "shop" on Shopify it does not show the sub-categories or sub-sub categories, is there a way to fix this? (see 2nd attachment)


Attached is an example of my website now, on Squarespace, showing the URL, categories/sub categories/sub sub categories, and the breadcrumbs that I am hoping to replicate on my new Shopify store as closely as possible.

Website Example.png

 

(2nd attachment) Sub-categories & sub-sub categories not showing on Shopify website - no breadcrumbs - See left side of screenshot

Shopify example.png


Thank you so much for taking your time to read through this and for your help! I hope I provided enough information. 

 

 

Replies 4 (4)

oscprofessional
Shopify Partner
15846 2371 3074

Hello @PurpleHouse,
The store is password protected, could you share your store password.

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing
PurpleHouse
Visitor
3 0 0

Sure! I haven't transferred my domain yet so my url is a temp one:

https://d26b57-3.myshopify.com/password

Password: Password2324

oscprofessional
Shopify Partner
15846 2371 3074

Hello @PurpleHouse,
To add sub-collections and breadcrumbs to your Prestige theme in Shopify, you'll need to make modifications to the theme code. Here's a general guide on how to accomplish this:

  • Access Theme Files: Log in to your Shopify admin panel and navigate to Online Store > Themes. Find your Prestige theme and click on "Actions" > "Edit code."

  • Modify Collection Templates: Locate the collection template files within the theme code. These are typically named something like collection.liquid or collection-template.liquid.

  • Update Breadcrumbs: Within the collection template files, you'll need to add code to generate breadcrumbs. Breadcrumbs typically show the hierarchical path to the current page. You can use the Shopify Liquid code to generate breadcrumbs dynamically based on the collection hierarchy.
    Here's an example of how you can generate breadcrumbs:

 

<div class="breadcrumbs">
    <a href="/">Home</a>
    {% for collection in collection.all_parents %}
        <span class="separator">/</span>
        <a href="{{ collection.url }}">{{ collection.title }}</a>
    {% endfor %}
    <span class="separator">/</span>
    <span class="current">{{ collection.title }}</span>
</div>

 

  • Implement Sub-Collections: To create sub-collections, you'll need to organize your collections in a hierarchical structure within the Shopify admin. Then, you can modify the code in your collection template to loop through and display sub-collections accordingly.

Here's a basic example of how you can display sub-collections:

 

<ul class="sub-collections">
    {% for sub_collection in collection.children %}
        <li><a href="{{ sub_collection.url }}">{{ sub_collection.title }}</a></li>
    {% endfor %}
</ul>

 

  • Test and Customize: After making the necessary changes, be sure to save your theme files and then test your collections to ensure that sub-collections and breadcrumbs are displayed correctly. You may also need to customize the styles to match your theme's design.

If there is anything that needs to be clarified or included, please let us know.  We will surely help you. 

Have a nice day!

 

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing
PurpleHouse
Visitor
3 0 0

Thank you for your help! 


Is there a way to add the breadcrumbs into the collection-banner.liquid and where within the code would it go? So it shows where I've circled? 

collection banner.png

 

For the Sub-Collections, the options I have within my "templates" are: list-collections.json, collection.home.json, or collection.json. Would I add that within one of those or would I need to create a new template? Also, would this give me the desired URL structure?