2. Display Options

The Eventful Plugin Display Options tab gives you full control over how events appear on your site. You can adjust grid responsiveness, style elements, toggle fields, and enable pagination. Options are organized into four sections:

General #

1. Section Title – Show or hide the layout’s section title.
2. Column(s) – Define the number of columns for each device type: large desktop, desktop, tablet, landscape mobile, and mobile.
3. Margin Between Columns – Set horizontal spacing between columns (default: 20px).
4. Same Height – Force all items/slides to equal height.
5. Border – Apply borders with custom width, style (solid, dashed, dotted, double, inset, outset, groove, ridge, none), and color.
6. Border Radius – Round the corners of each item.
7. Box-Shadow – Enable shadow effects.
8. Box-Shadow Values – Adjust X/Y offset, blur, spread, shadow color, and type (Inset/Outset).
9. Inner Padding – Set spacing inside each item’s container.
10. Background – Set background and hover colors.
11. Featured Events Background – Assign special background/hover colors for featured events.
12. Preloader – Enable hiding items until the page fully loads.

---

Template Styles – Custom #

The Template Styles section allows you to fully control how individual event items are structured and displayed inside a layout. This is where you define layout type, content positioning, and visible event elements.

1. Template Type – Choose whether to build your layout manually or use a ready-made design.
   • Custom – Build a fully customized event layout using individual content fields.
   • Pre-made Templates – Instantly apply a pre-designed layout with predefined styling and structure.
2. Event Content Position – Control where the event details appear relative to the event image.
   • Default – Uses the standard layout structure.
   • Right – Displays event content on the right side of the thumbnail.
   • Left – Displays event content on the left side of the thumbnail.
   • Overlay – Displays content over the event image for a modern, visual look.
3. Content Fields – Eventful provides modular content fields that you can show, hide, and reorder. Each field includes specific style and layout options.

Event Thumbnail #

1. Thumbnail – Show/Hide event thumbnail.
2. Size – Choose original uploaded image or standard WordPress sizes.
3. Replace With – Replace thumbnail with image, video, or audio.
4. Border – Customize thumbnail border.
5. Border Radius – Round thumbnail corners.
6. Zoom Effect – Options: None, Zoom In, Zoom Out.
7. Image Mode – Apply grayscale: off, grayscale on hover, always grayscale.
8. Lazy Load – Enable lazy loading for performance.
9. Thumbnail Background – Add a background color.
10. Margin – Control spacing around the thumbnail.

Event Title #

1. Title – Show/Hide event title.
2. Title HTML Tag – Choose heading tag (h1–h6, p, div).
3. Limit Character – Restrict character length.
4. Title Margin – Adjust spacing around the title.

Event Meta Fields #

1. Meta Fields – Show/Hide event meta.
2. Add New Meta – Select meta types: Venue, Organizer, Price, Event Time, Taxonomy.
3. Meta Separator – Choose between space, dot, line, slash, or backslash.
4. Event Meta Margin – Set margin for meta container.
5. Margin Between Event Meta – Fine-tune spacing between individual meta items.

Event Content #

1. Event Content – Show/Hide content.
2. Content Display Type – Options: Full, Excerpt, Content with Limit.
3. Content Length Type – Words or Characters.
4. Words Length – Limit by length.
5. Event Content Margin – Spacing for the content block.
6. HTML Tags – Allow all, strip all, or allow selected tags.
7. Ellipsis Points – Customize the symbol for truncated content (default “…”).
8. Read More – Show/Hide “Read More” link.
9. Read More Type – Button or Text Link.
10. Read More Label – Customize button/link text.
11. Read More Color – Style text, hover, border, and background.
12. Read More Button Border – Border styling for button version.
13. Button Padding – Adjust spacing inside the button.
14. Event Read More Margin – Spacing for the read more element.

Event Social Share #

1. Sharing Media – Select platforms (Facebook, WhatsApp, Twitter, LinkedIn, etc.).
2. Icon Shape – Circle, Rounded, Square, or Icon Only.
3. Custom Color – Toggle to customize icon and background colors.
4. Alignment – Left, Center, or Right.
5. Margin – Control outer spacing.

---

Custom Fields #

Eventful Pro allows you to add and display custom fields from your events. This feature gives you more flexibility to showcase additional event details such as event type, ticket info, or any extra metadata you want your visitors to see.

1. Custom Fields – Select the custom field you want to display. The dropdown will list all available fields registered in your system.
2. Icon Before Name – Choose whether to display an icon before the field name.
3. Custom Field Name (Show/Hide) – Toggle to show or hide the field name. If disabled, only the field value will be displayed.
4. Customize Field Name – Add the field name by entering your preferred label.
5. Show Colon – Enable or disable the colon symbol (:) between the field name and value.
6. Select Plugin – Eventful Pro supports multiple custom field plugins. Choose which source you’re pulling fields from:
   • Auto Detect (recommended)
   • Advanced Custom Fields (ACF)
   • Pods
   • Toolset
7. Embed Audio, Video, or Image – If the field contains embeddable content (e.g., audio, video, images, tweets), check this option to display the media inline. 👉 See supported content list
8. Margin – Set the margin around your custom field content. Values can be defined for top, right, bottom, and left spacing (in px).

🔹 Tip: You can add multiple custom fields by clicking Add New Custom Field, giving you full control to display as much event-related data as you need.

Template Styles – Pre-made Templates #

The Pre-made Templates option allows you to quickly apply professionally designed event layouts without building everything from scratch. This is ideal if you want fast results with consistent styling.

1. Template Type (Pre-made Templates) – Choose Pre-made Templates to use ready-made event card designs provided by Eventful.
2. Template Style – Select which pre-designed template style you want to display.
3. Theme Color Shims – Control accent colors for events using Theme Color Shims.
4. Alignment – Set the alignment for event meta content inside the template.

---

Pagination #

1. Pagination – Enable or disable pagination.
2. Pagination Type – Choose Load More Button (Ajax), Ajax Number Pagination, Infinite Scroll, or No Ajax (Normal).
3. Pagination Type for Mobile – Set a different type for mobile devices.
4. Load More Button Label – Customize button text (default: Load More).
5. Ending Message – Message shown when no more events are available.
6. Load More Button Color – Full styling options (text, hover, background, border).
7. Alignment – Align pagination to Left, Center, or Right.
8. Items Per Page – Define number of events shown per page.

💡 Tip: Combine Content Fields and Template Styles to create truly unique event layouts — for example, a clean grid with overlay titles, custom background for featured events, and Ajax “Load More” pagination.