The MEC Elementor Shortcode Designer Addon is an extension of Modern Events Calendar (MEC) that allows you to visually design event shortcodes inside Elementor using drag-and-drop widgets.

It is mainly used to create custom event layouts without coding.

📌 ABOUT THE ADDON

This addon connects:

• 🗓️ Modern Events Calendar (MEC)
• 🎨 Elementor Page Builder

It lets you:

“Design how event listings look, directly inside Elementor, and generate shortcodes dynamically.”

Instead of static event layouts, you get a fully visual design system for event displays.

✨ KEY FEATURES

🎨 1. Visual Shortcode Design (Core Feature)

• Build event layouts using Elementor drag & drop
• Customize every event block visually
• Live preview while designing

🧱 2. Custom Event Layout Control

• Arrange event elements like:
  • Title
  • Date
  • Time
  • Location
  • Price
  • Featured image
• Full control over spacing, typography, alignment

🔍 3. Dynamic Event Filtering

• Filter events by category, date, location
• Add search fields inside layouts
• Show only selected event types

⚙️ 4. Shortcode Generation System

• Automatically generates MEC shortcodes
• Embed anywhere in:
  • Pages
  • Posts
  • Elementor sections

🧩 5. Elementor Widget Integration

• Uses MEC-specific Elementor widgets
• Works inside Elementor editor environment
• No need to manually write shortcode code

🎯 6. Search + Filter UI Builder

• Add search bar inside event layouts
• Filter events dynamically in frontend
• Improve user experience for large event sites

🎨 7. Styling Controls

• Typography customization
• Color schemes per event layout
• Spacing, borders, background control
• Responsive design settings

📱 8. Fully Responsive Design

• Mobile, tablet, desktop optimization
• Adaptive event grids
• Touch-friendly layouts

🏢 USE CASES

🎓 Education Institutions

• University event calendars
• Workshop scheduling pages

🏢 Corporate Websites

• Training & internal events
• Conference schedules

🎪 Event Companies

• Multiple client event displays
• Branded event pages

🏛 Government / NGOs

• Public event listings
• Campaign schedules

🧠 HOW IT WORKS (SIMPLE FLOW)

1. Open Elementor
2. Go to MEC Designer
3. Drag & drop event layout components
4. Customize design visually
5. Save design → generates shortcode
6. Paste shortcode anywhere on site