New Arrivals Page

A page that generates a list of recent products sorted by the most recently added.


New Arrivals Page

Preparation Checklist

Before you start this tweak, it's a good idea to run through our preparation checklist below:

  • Read through the Getting Started to get a better sense of how the Control Panel, Database and Front End store interact.
  • Learn our recommended Simple Workflow. This makes the implementation process as easy as possible.
  • Create a new Staging Theme for this tweak. This allows you to preview any changes before they are visible to live customers.

Coding Instructions

Note: This function grabs a list of all products and sorts them by the most recent. So if the most recent product addition was 6 months ago, it will still be the "Newest Arrival".

Step 1: Duplicate the category template

Duplicate the existing category.template.html file within /httpdocs/assets/themes/[THEME-NAME]/templates/cms and rename it to new_arrivals.template.html.

Step 2: Edit the page type

At the head of the template, update [%SET [@page_type@]='category'/%] to [%SET [@page_type@]='new_arrivals'/%].

Step 3: Add the code into the template

Paste the following code into the template replacing the thumb_list function.

[%thumb_list type:'products' filter_category:'0' sortby:'new_arrivals' limit:'24' %]
    [%param template%][%VIEWBY type:'products' default:'[@templatethumb@]'%][%/VIEWBY%][%/param%]
    [%param *header%]
        <div class="[%VIEWBY type:'products' if:'eq' value:'list' if_true:'thumb_list' if_false:'thumb'%][%/VIEWBY%]">
            <section class="row products-row" aria-label="Products in category">
    [%param *footer%]

Step 4: Create a New Arrivals page

Create an information page named New Arrivals, and set the "Body Template" to new_arrivals.

Customising this section

More information on how to customise this section can be found within the Thumb List Documentation.

Was this article useful?

Be notified when this page is updated. Optional.