website logo
⌘K
Introduction
PORTAL
Agency Whitelabelling
PAGES
Pages - Accessing Page Data
Pagination Layouts
Page Templates
FORMS
Form Confirmation Pages
Adding a Progress Bar
Adding Custom CSS To Show Form Submit Process
Dynamic Content in Workflow and Autoresponder Emails
How to output Custom Field Set fields in a Form's Custom Layout
Custom JavaScript Validation for Forms
File Upload Previews
FAQ
CATEGORIES
Filtering WebApps and Modules by Categories
Outputting Categories on WebApp / Module / eCommerce Layouts
Outputting Category Fields in any Location
Category Detail Layouts
FAQ
COMPANY INFORMATION
Company Information
SITE SEARCH
Site Search
PUBLIC API/ZAPIER
Zapier - Formatting arrays correctly
Public API/Zapier Changelog
MODULES
Module Marketplace
Building Custom Modules
Siteglide Modules
Front-end Submit Modules
DATA STRUCTURES
Automations
Creating WebApps from the CLI
Field Types
WEBAPPS
Front-end Submit WebApps
Layouts
Search and Filtering
Understanding Custom Field Names and IDs
FAQ
CRM
User Details
User Secure Zones
Storing User's Favourite WebApp / Module Items
User's Form Submissions (Cases)
How Users Edit their Email and Password Front End
Editing a User's CRM record Front End with Custom Field Sets
CLI
Introducing Siteglide CLI
CLI Changelog
Secure Zones with CLI
Page Templates with Siteglide CLI
Pages with Siteglide CLI
Includes with Siteglide CLI
Managing Email Templates
Migrate - Manual Form setup
Migrate - Convert existing Forms
Liquid
Accessing Assets
Liquid Dot Notation
Using WebApp Collections- Tutorial
Using the current_user object with Secure Zones
Preventing Duplicate Content with Query Parameters- Canonical URL and Robots.txt
FAQ
GraphQL
Tutorial Overview
About GraphQL
Tutorial 1- Your First Query
Tutorial 2 - Pagination
Tutorial 3 - Filtering the Results
Tutorial 3 - Answers to the First Filtering Challenge
Tutorial 4 - Advanced Filtering
Tutorial 4 - Challenge Answers
Tutorial 5 - Using Liquid to run GraphQL queries on your Site
Tutorial 6 - Variables
Tutorial 6 - Answers to the Variables Challenge
Tutorial 7 - Sorting
Tutorial 8 - Building a Liquid API GET Endpoint Page powered by GraphQL queries
Best Practice and Performance
Module/WebApp Caching
Getting Started with Liquid Caching - to Reduce Server Response time and Improve Performance
Includes
ecommerce/checkout_standard
Frequently Asked Questions
Using Liquid Logic to Check if a field exists, or is empty on the Front End
How do I learn more about Liquid?
How to setup a multi domain start page
Docs powered by archbee 
10min

WebApp List Layouts

Syntax

When placed onto a page or a template, this liquid displays the WebApp items using the defined list Layout.

HTML
|

Parameters

Parameter

Description

id

the WebApp's ID

item_ids

output one or more WebApp items. For multiple ids comma separate them like so:  item_ids: '17559,17546'.

category_ids

output all items in one or more categories. Comma separate category ids to filter by multiple categories e.g:  category_ids: '17559,17546'.

show_all_sub_items

default is 'true' - When setting a category, this defines whether or not items should be shown if they are in sub-categories

layout

default is 'default.liquid' - 'layout' values are relative to the folder: layouts/webapps/My WebApp (webapp_1)/[layout name]

per_page

defines the number of items outputted on the page

show_pagnation

default is 'true' - defines if items should be paginated when the per_page is met.

ignore_pagination

default is 'false' - defines if the output should ignore pagination in the URL. This is useful when outputting fixed WebApp/Module items in a sidebar, that don't need to be affected when moving page number.

sort_type

defines the type by which items are ordered

sort_order

defines the order in which the type is sorted

collection

- default is 'false' - If you set it as collection: 'true' then any layout is suppressed. Data is accessible via

HTML
|

For Example, name would be:

HTML
|



Sorting by Custom Fields

When sorting by Custom fields, you'll need to refer to the field by its Custom Field ID. e.g. to Sort by the 2nd Custom Field created on webapp_1, you should set the Sort Order to: sort_order: "properties.webapp_1_2" We use this syntax to access the field directly in the database, in order to help increase Page Load performance.

Learn more about Custom Field IDs here: Understanding Custom Field Names and IDs - and when to use them

Default Fields

Field Name

Liquid Tag

Description

Item Name

{{ this['name'] }}

name of the FAQ

Slug

{{ this['full_slug'] }} 

url of the current item, relative to the layout

Weighting

{{ this['weighting'] }} 

weight of item, used for sorting

Release Date

{{ this['release_date'] }} 

release date of the item

Expiry Date

{{ this['expiry_date'] }} 

expiry date of the item

Enabled

{{ this['enabled'] }} 

enable/disable the item

Folder Structure

When you create a WebApp, default files are automatically created for you. WebApp list layouts are stored in the following folder structure, which you can view via Code Editor: layouts/webapps/My WebApp (webapp_ID)/

Within this folder you will find the following:

  • list/- the list layouts, used when outputting items as a section on a page
    • default.liquid - the default list layout

To create a custom layout file, right click on the list folder. Alternatively, you can edit the default file. All layout files must use the .liquid file extension, for example mylayout.liquid. Any files created within this folder will automatically become available in the dropdown selector when outputting a WebApp from the Toolbox

Updated 07 Dec 2021
Did this page help you?
Yes
No
UP NEXT
WebApp Detail Layouts
Docs powered by archbee 
TABLE OF CONTENTS
Syntax
Parameters
Sorting by Custom Fields
Default Fields
Folder Structure