Calendar Event Details

What You'll Learn

This article shows you how to customize the information displayed when users click on calendar events. You'll learn how to select which fields appear in the popup, organize their layout, and add interactive elements to enhance your users' experience.

Understanding Event Details

Event details are shown in a popup when a user clicks on an event in your calendar. These details provide additional information about the record beyond what's visible directly on the calendar.

Configuring Event Details

To configure what information appears in your event details popup:

1. Access the Calendar Element settings
2. Select the "Event Details" section
3. Use the tabs (General, Fields, Actions) to customize different aspects of the popup

Managing Fields

The Fields tab allows you to select which information from your record appears in the popup.

Adding and Removing Fields

1. In the "Manage Fields" section, you'll see how many fields are currently added (e.g., "7/37 added")
2. Use the field list (grouped by table) to select which fields to display
3. Check the box next to fields you want to include (e.g., Programs/Grant, Grant Amount, Application Date)
4. Uncheck fields you want to remove
5. Use "Add All" or "Remove All" buttons to quickly select or deselect all fields

Organizing Field Display

You can drag fields in the preview to change their order in the popup. The order in which fields appear in the list determines their display order in the event details popup.

Searching for Fields

For tables with many fields, use the search box at the top to quickly find specific fields.

Static Components

At the bottom of the field list, you'll find the option to add a Static Component. This allows you to add formatted text, images, or links that aren't directly tied to your data fields.

To add a static component:

1. Click the "+ Static Component" button
2. Configure the component in the dialog that appears
3. Save your changes

Field Display Settings

When you select a field, you can configure additional settings for how that field displays in the event details:

• Show or hide field labels
• Format values (especially for numbers, dates, and times)
• Apply conditional display rules
• Add custom CSS styles

Accessing General and Actions Settings

General Tab

Use the General tab to configure:

• Layout options for the popup
• Title formatting
• Overall style settings

Actions Tab

The Actions tab allows you to add interactive elements:

• Edit button
• Delete button
• Custom action buttons
• Link to detail pages

Best Practices

• Select essential fields: Include important information but avoid cluttering the popup
• Organize logically: Group related fields together (dates with dates, amounts with amounts)
• Consider mobile users: Remember that popups need to be usable on smaller screens
• Add actions: Where appropriate, include links or buttons that allow users to take action on the record

Relationship to Detail Elements

Calendar Event Details function similarly to the Detail Element in Knack. If you're familiar with configuring Detail Elements, you'll find many of the same options available for Calendar Event Details.

Tip: For more advanced formatting options and capabilities, consider linking events to a dedicated detail page rather than relying solely on the popup.

By carefully configuring your event details, you can provide users with important information at a glance while keeping your calendar interface clean and uncluttered.