Designer projectsCreator prototype
How to's
Design a custom list-view page

Creator prototype

How to's
Copy the whole content from one page to another
Copy / Paste elements
Design a FAQ
Design a console page layout
Design a search bar
Design a calendar
Add a background color to a page
Design a custom list-view page
Design a multi-step wizard
Starting with the right design
Drag elements
Why prototyping?
Copy the whole content from one page to another
Copy / Paste elements
Add a background color to a page
Community Design
Export to Aura or LWC
Creator User Interface
Export as PNG
Sharing a folder
Console View
Lightning Component Design
Suggesting mode
Center block elements inside a page
Adding comments
Data and Data table
Organizing designs into folders
Overview actions
Design a calendar
Design a console page layout
Lightning Flow Design
Center an element
Button
Design a search bar
Design a multi-step wizard
Lightning Application design
Path
Use Grid Alignment Settings
Set an active value on the Path
Add text next to another element
Standalone App Design
Copy / Paste from / to Modals
Modal box
Create blank space between fields
Use the navigator
Charts
Copy the whole content of a page
Configure Path Sales Coaching
Design a FAQ
Sharing a Creator project
Share with a public link
HTML Element
Design a custom list-view page
Link action
This article ONLY works when using Avonni Creator. Only customers with an active subscription that was activated on or before December 31, 2021 have access to Avonni Creator.
This article is only valid when working on a Creator project.

Design a custom list-view page

On a Lightning Application design, the list view page is set by default in the preview mode. However, you can disable it.

In some cases, you might need to create your own customizable list view page. Here's the steps to create a custom and editable list view page.

1. Drag a Page Header template

2. Customize the Header

  • Change the icon

3. Drag a Table element

4. Customize the table

  • Edit columns label
  • Edit the apparence
  • Drag elements to feed your table

Related


‍

Avonni Designer vs Avonni Builder comparison table

View all the differences between Avonni Designer and Avonni Builder.

COMPARISON TABLE

TABLE OF CONTENTS

Example H2
Example H3
Example H4
Example H5
h6
Example H6
Support

Contact us about anything you couldn’t find here.

Suggest an article
Article feedback
Product
Interface BuilderBuilding BlocksData SourcesPrototypingCustom BrandingInteractions
Use Cases
Data VisualizationData EntryClient PortalInternal ToolMobile App
Resources
Success PlansVideo GuidesHelp DocsBlog
Company
About UsProduct PricingJobsBecome a Partner