List elements provide a flexible way to display multiple records from your database using customizable layouts. Unlike Table elements, Lists offer more visual formatting options and can be arranged in multiple columns for enhanced presentation.
What You'll Learn
- How to create and configure List elements
- Ways to customize the layout and appearance
- Methods for adding and managing record details
- Techniques for implementing actions and static content
Basic Configuration
Source Settings
Configure which records appear in your List:
- Data Rules: Filter which records display
- Sort Order: Define default record ordering
- Record Limit: Set maximum number of displayed records
Tip: Use record limits to create focused displays like "Latest 5 Updates" or "Top 3 Customers"
Layout Options
- Single column (traditional list)
- Two-column layout
- Three-column layout
General Settings
- Hide empty fields
- Enable keyword search
- Allow data export (CSV, JSON, TXT)
- Custom empty state message
Content Management
Adding Content Types
1. Field Content
- Database fields from tables
- Connected record fields
- Calculated fields
2. Action Links
- View record details
- Delete records
- Navigate to other pages
- Trigger custom actions
3. Static Elements
- Section titles
- Descriptive text
- Visual dividers
- Instructions
Field Configuration
Label Options
- Hide labels
- Top alignment
- Left alignment
- Right alignment
Display Settings
- Custom label text
- Field formatting
- Connection links
- Styling options
Advanced Features
Search and Filtering
Keyword Search
- Full-record search capability
- Configurable search fields
- Reset functionality
Filter Options
- User Filters
- Custom filter creation
- Field-specific filtering
- Saved filter presets
- Filter Menu
- Predefined filter options
- Guided filtering experience
Pagination Controls
- Records per page (10, 25, 50, 100)
- User-adjustable display counts
- Top/bottom pagination placement
Record Actions
- View detailed information
- Edit record data
- Delete records
- Custom actions
- Page navigation
Customization
Visual Elements
- Custom field layouts
- Responsive design options
- Spacing controls
- Section dividers
Content Organization
- Drag-and-drop field arrangement
- Section grouping
- Visual hierarchy
- Content flow
Best Practices
Design Guidelines
- Maintain consistent spacing
- Group related fields
- Use clear action labels
- Consider mobile layouts
Performance Tips
- Optimize record loading
- Limit initial record count
- Use efficient filtering
- Cache common queries
Troubleshooting
Common Issues
- Layout misalignment
- Connection display errors
- Action link failures
- Filter malfunctions
Solutions
- Verify field connections
- Check action configurations
- Validate filter rules
- Test responsive layouts
Related Resources
- [Database Structure Guide]
- [Action Configuration]
- [Layout Best Practices]
- [Filter Setup Guide]
Note: Changes to List elements are immediately visible in the preview, allowing for real-time design validation.
Warning: Deleting a List element will remove associated child pages unless they're connected to other elements.