Product Listing Page (Number of Items Per Page)

WebStore
1

Hey guys,

So I am redoing our ‘Product Listing’ page. I have my html laid out, and have removed your guy’s code from the template. But when I use:

{ifThereAre products}
    {foreach product}
        // This guy here only outputs 18 items, not the 50 or so that should be displaying
    {endForEach}
    {ifNone}
    {endIfNone}
{endIfThereAre}

I only get 18 of the products (out of ~50). I’d use some of the scripts on code you guys had, but it does not work when you want to use sorting AND filtered search simultaneously.

I even tried removing the

SO, how can a guy get the foreach loop to spit out ALL of the results (and not just 18)? This way, I can just create my own pagination/sorting mechanism…

P.S. I need to be able to create my own loops for situations like this. How much will it cost us to gain the ability to create new and modify existing Nitro Script functions?

2

Hi Derek,

Looking at your store I see that your pagination is set to start at 20 items:

http://ws4301-4323.staging.nitrosell.com/Cables-%26-Adapters-Audio-Cables/

http://ws4301-4323.staging.nitrosell.com/store/administration/config_webstoreconfig.nsc#tab/9/cachedmatchesperpage

You can change this to a larger number, and even allow customers to select the number of items displayed (you choose the default). You may need to revert the template to get the code for this.

Regards,
Brendan

1 Like
3

Article on setting the number of items per page: Allow your shoppers to choose how many products are displayed on a page

1 Like
5

Thank you guys for the replies! I do need to ask, does filtered search, pagination and sorting all work when all three are active on our site? I was alerted to the fact that the “sort results” feature does not work when “filtered search” is active. When i checked this, I was able to confirm that a few NitroSell sites with ‘filtered search’ and ‘sort results’ features active did indeed have an issue sorting the results on the page. Though it seems that, recently, this has been fixed…?

So, I suppose the right question to ask is: is using the aforementioned features simultaneously stable/functional? Regardless if everything will work okay, I still really dislike having table-formatted elements on our site. Call me a control freak, but I simply wish for our code to be semantic and valid.

I would really like to swap out our current pagination with my own markup. In order to do so, I need to have the nitro script output ALL results. Can you please advise on how I can achieve this behavior?

Thanks in advance!

-Derek

1 Like
6

Hi Derek,

“sort results” feature does not work when “filtered search” is active.

This is fixed on beta.

I still really dislike having table-formatted elements on our site.

You can replace the markup with divs, just use the nitroscript elements for looping & data output.

In order to do so, I need to have the nitro script output ALL results.

Your best option here is to set the number of items displayed to a large number. (200 should cover most use cases.)

2 Likes
7

Thanks for the great info!

You can replace the markup with divs, just use the nitroscript elements for looping & data output.

Which (in this case) would be? I’ve asked similar questions in our WebStore tickets, but I was redirected to training.

I’ve seen loops like “{forEach something}” and “{forEvery X}” but I have never been able to create a custom NitroScript loop successfully. I’ve tried using Smarty’s docs to figure out how I can do various things in NitroScript, but to no avail.

8

All I have to reference right now is “{ns:displayNavigation}”, which I of course can find no documentation of, thus no idea how to change what this outputs :slight_smile:

9

Hi Derek,

Looking at your listing page template you have already adjusted the markup to use divs.

Regarding the {ns:displayNavigation} tag - there is no equivalent loop to generate this pagination.

Regards,
Brendan

10

Hi @brendan,

Thank you for the valueable information. I finally got around to implementing this into our template. You sir- are a rockstar. Thank you!

11

@brendan - One thing though, I’m having a little issue with the sorting now…

On the following page, I have the ‘#matchesperpage’ dropdown set to ‘48’, and I change the ‘Sort by’ dropdown to 'Price (Descending). With these settings, the ‘Sort by’ only sorts the first 35 items for some reason. I copied and pasted the exact js from the template Jim made for us. I’m wondering if I have the non-beta (fixed) script?

http://ws4301-4323.staging.nitrosell.com/Cables-%26-Adapters-Audio-Cables/?sort=price&order=DESC

Here is the script that is currently being used on our ‘Product Listing’ template…

<select name="sortfields" id="sortfields" onchange="updateSorting(this.options[this.selectedIndex].value)"></select>

<script >
var arrSortFields = {
  "name" : "Name",
  "price" : "Price"
};

var sCurrentSortField = "{pageproperty['sortfield']}";
var sCurrentSortOrder = "{pageproperty['sortorder']}";

var objSortDropdown = document.getElementById('sortfields');
for (var sField in arrSortFields) {
  objSortDropdown.options[ objSortDropdown.options.length ] = new Option( arrSortFields[sField] + " (Ascending)", sField+"/" );
  objSortDropdown.options[ objSortDropdown.options.length ] = new Option( arrSortFields[sField] + " (Descending)", sField+"/DESC" );
}
objSortDropdown.value = sCurrentSortField+'/'+sCurrentSortOrder;

function updateSorting(sortValue) {
var arrSorting = sortValue.split("/");

{if (pageproperty['pageid'] eq "search")}
if (arrSorting[1] == 'DESC')
  sortDesc(arrSorting[0]);
else
  sortAsc(arrSorting[0]);
{else}
window.location.href = "?sort="+arrSorting[0]+"&order="+arrSorting[1];
{endIf}
}
</script>

So the first 35 results are sorted accoring to their price, but the 36th item “restarts” the sorting.

12

Hi Derek,

http://ws4301-4323.staging.nitrosell.com/store/administration/config_webstoreconfig.nsc#tab/2/cacheddisablesubcatgrouping

This option was splitting the listing into subgroups by subcategory and sorting was being applied within those groupings. I’ve turned off the grouping now.

Regards,
Brendan

13

Oh shoot, that’s because I forgot to add the category headers! lol… Silly me. I can’t believe I forgot to add those puppies in there. Thank you for your assistance!

14

Hi @brendan, sorry to bother you again. But our sorting & filter combo do not work for some reason. I have filters hidden for now, but when visible, the sorting and filter combo do not work. Can you verify that the JS inline (Product Listing) is correct, that I am on the BETA branch still and that all is as it should be. The ‘pageid’ that messes up when filters and sorting are enabled is {pageid[‘search’]}. I hid them via removing the include (pageid=search) in the template.