Supply Theme Sidebar quirk--help please!

Highlighted
New Member
3 0 0

Hi there,

I'm not a coder by training but I'm really good at following directions, so I'm hoping someone can help me understand some behavior in the Supply Theme sidebar.

My store is getting closer and closer to being ready for release, but I'm trying to iron out some of the details of things (and still run an existing brick & mortar gift store business).

My business has 2 main trees of thought process for navigation. 

  1. A traditional Departments tree where items are grouped into categories you might see on a department store floor plan.
  2. A Gift Finder tree where we look at the customer's needs to push things from different Departments in front of their view so that they can see our suggested items for a given scenario.

So Supply looked like what the doctor ordered for a store with thousands of products across a variety of product types (I'm currently published to over 400 products and working furiously to get at least a representative sample of the whole store).  A customer can look at our suggestions and narrow in on items from the different group tags in the side bar. 

BUT, the sidebar wants to combine the group tags and doesn't show that your initially selected tag is "checked."

So let's look at wedding gifts (password:daskow)

If I click on any of the left-hand group tags, it will narrow to that group. GREAT.  BUT (and lets use Frames as an example), clicking on frames to Narrow it down to Frames works to just look at Frames, but you can't "uncheck" it to look at a different suggested collection or the whole wedding gift collection without hitting the back button on your browser (which does not seem intuitive to me).

pearlgrant_2-1603740655010.png

I get that it's inclusive in that it allows you to drill down into items so that you can hone in on something from Collection_Frames and Color_silver (so that any non-silver frames would not be shown).  But if a customer now wants to look at non-Frame items, they can't just "uncheck" frames (because it isn't checked to begin with) and click on Barware.  Clicking on Barware searches for Frames + Barware (which comes up with nothing since no products inhabit both collections).  I can then uncheck Barware, but not the initially selected Frames.

Is there a coding solution?

I hope that this was clear and not too wordy....

 

0 Likes
Highlighted
New Member
3 0 0

My guess is that I'm looking for something to be done to this little bit of code in the collection-sidebar.liquid:

    <script>
    $(function() {
      var filters = $('.advanced-filter'),
        el,
        elGroup,
        elHandle,
        activeTagInGroup;

      filters.on('click', function(e) {
        el = $(this);
        elGroup = el.data('group');
        elHandle = el.data('handle');
        activeTagInGroup = $('.active-filter[data-group="'+ elGroup +'"]');
        // If the tag clicked is not already active and its group contains an active tag, we will swap tag within the group.
        if ( !el.hasClass('active-filter')  && activeTagInGroup.size() ) {
          e.preventDefault();
          location.href = location.href
            // swap tag
            .replace(activeTagInGroup.data('handle'), elHandle)
            // go back to page 1
            .replace(/(&page=\d+)|(page=\d+&)|(\?page=\d+$)/, '');
        }
      });
    });
    </script>

the comment about active tags in group makes me think it is in the direction of the functionality i'm looking for.  I just want it to ALWAYS replace within a group--allowing a customer to switch between groups without having to reload the original collection page sans filtering.

So please and thank you if you can help!!

0 Likes