Rich-text Reply

Hiding product counts in filters

chris_tranchina 06-09-14

Hiding product counts in filters

Is is possible to suppress counts displayed next to a product link in faceted navigation? We have a set of filters on a page that display a link to narrow on a product/attribute, with a count displayed next to it (number of associated listings the user will see with that selection). The count is not contained within the linked text.


Ex: Currently


Product 1 (1234)

Product 2 (2345)

Product 3 (3456)


Want to test:


Product 1

Product 2

Product 3


With each selection, the page refreshes, those product lists recalculate, and display new numbers. It's easy enough to remove them from a single initial page view, but it doesn't carry over to the next page view. Additionally, there are about 20 categories that need this applied to, to test the change to the entire set of filters.

We are tyring to understand whether or not those counts are helpful to users and/or influence a user to click on them in any way.


Any help on how we might accomplish this or examples of how this has been done before would be great, thanks!


Re: Hiding product counts in filters

Can you post a link to the page you are trying to run this test on?
Gary 06-09-14

Re: Hiding product counts in filters

Hi Chris!

This is a great question and honestly will depend on the structure of your page.

Have you tried clicking on the element in the Optimizely Editor and selecting 'Remove'?

If so, the standard line of code Optimizely will generate should look like the following (in the Code Editor):

$(".YOUR_SELECTOR_HERE").css({"display":"none", "visibility":""});

If these numbers have a class shared between them, we can adjust the text in the above code that reads ".YOUR_SELECTOR_HERE" to target all of the other codes as well by using the shared class. This is called a CSS Selector.

However, you mention that the page will 'refresh'. If the entire page refreshes, then the experiment would run again (assuming this is activated on pageload). Rather, is this a ajax call that will only refresh that content? If so, we can bind the above line of code to run EVERY TIME the Ajax call completes, using the following ajaxComplete jQuery code:

window.$(document).ajaxComplete(function() {
//PLACE Your Variation Code Here;

Does this help?
- Gary
Optimizely - Turning the World's data into action