Ecommerce Frontpage Collection Editing and Troubleshooting


Latest update: - Nat Dudley

Frontpage Collection Editing and Troubleshooting

Learn more about managing your Frontpage Collections on Vend Ecommerce with some of our frequently asked questions.

Click the links below to learn how to:

Important: Be careful when editing the HTML/CSS of your store. Removing the wrong lines could break your store and prevent customer access .


Removing the Placeholder products that appear on the front page:

The placeholder images appear because no products have been added to your Frontpage collection. Once you add a product to the frontpage collection then the placeholder products will be removed. To learn how to add products to your frontpage collection click here.


Frontpage collection does not appear in the collections list page:

This could be because the frontpage collection has been deleted. To fix this, create a new collection called 'frontpage' and add some products to this collection.


Change the heading of your frontpage collection (Default or Alpaca theme):

Important: We recommend this for advanced users only. Editing the wrong HTML/CSS can break your store and prevent customer access. Before proceeding you may want to take a backup of this text by saving it into a word document.

To do this navigate to Design -> Themes

Select your active theme

Click edit HTML/CSS

Under the locales section, select en.default.json.

Rename "Frontpage Collection" below to your new heading and save the change.


Display a different collection on your homepage:

Important: We recommend this for advanced users only. Editing the wrong HTML/CSS can break your store and prevent customer access. Before proceeding you may want to take a backup of this text by saving it into a word document.

If you want to use a different collection, other than the frontpage collection, on your homepage go to Design -> Themes

Select your active theme

Click edit HTML/CSS

Under the Templates section, select Index.liquid

and locate the following line:

{% for product in collections.frontpage.products limit:4 %}

Replace 'frontpage' with the name of the collection you wish to display. For example: {% for product in collections. new-arrivals .products limit:4 %}

Important: If the collection you are changing to has spaces in the title replace these spaces with hyphens when updating the above line. If you put any spaces in this line your frontpage will display an error and customers will not be able to access your store.


Display more than 4 products on the homepage:

Important: We recommend this for advanced users only. Editing the wrong HTML/CSS can break your store and prevent customer access. Before proceeding you may want to take a backup of this text by saving it into a word document.

To display more than 4 products on your homepage go to Design -> Themes

Select your active theme

Click edit HTML/CSS

Under the Templates section, select Index.liquid

and locate the following line:

{% for product in collections.frontpage.products limit:4 %}

Change the 'limit' number to a higher value. e.g change ' limit:4 ' to ' limit:8 '.


Removing the Frontpage collection from your homepage (Default or Alpaca theme):

Important: We recommend this for advanced users only. Editing the wrong HTML/CSS can break your store and prevent customer access. Before proceeding you may want to take a backup of this text by saving it into a word document.

If you are using the Default or Alpaca themes and prefer not to display your frontpage collection on your homepage you can remove it by navigating to Design -> Themes

Select your active theme

Click edit HTML/CSS

Under the Templates section, select Index.liquid

Save a copy of this block somewhere on a word document and then remove it:

Powered by Zendesk