Elementor Shortcode Designer Addon

The Elementor Shortcode Designer Addon is a powerful tool for Modern Events Calendar (MEC) that allows you to create fully customized shortcodes. By using Elementor’s drag-and-drop interface and specialized widgets, you have limitless possibilities for displaying events with your preferred style and positioning.

Initial Setup & Requirements

Before you begin, ensure your environment meets the following requirements:

• MEC Lite or Pro: This addon works with both versions (version 6.0 or higher).

• Elementor: You must have Elementor installed and active (version 3.0 or higher).

• System Requirements: Your server should run at least PHP 7.4 and WordPress 5.0. Additionally, the ‘allow_url_fopen’ property must be enabled on your server for the addon to function correctly.

• Enable Post Type: Navigate to Elementor > Settings > General and check the box for MEC Designer. This enables the post type required to create designs.

Pro Tip: If you encounter an error before entering the Elementor editor, go to WordPress Settings > Permalinks and click Save Changes to refresh your site’s links.

Creating Your Custom Design

To build a new layout, you first need to create the design template within the MEC Designer hub.

1. Navigate to WordPress Dashboard > MEC Designer and click Add New.

2. Enter a Title for your design and save the page.

3. Click the Edit with Elementor button to open the visual builder.

4. Use the specialized Elementor Shortcode Designer widgets, the standard MEC widget, or the Inner Section Widget from the sidebar to build your layout.

If you have difficulty finding a distinguishing layout for your target, check out the Best Selection of Events Website. Get some ideas on fully taking advantage of the Modern Events Calendar Elementor Shortcode Designer Addon. 

5. Customize typography, colors, and spacing for every widget to match your brand.

6. Once satisfied, click Publish or Update.

Assigning and Displaying Shortcodes

After creating a design, you must assign it to a functional MEC shortcode to display it on your website.

1. Go to WP Dashboard > M.E. Calendar > Shortcodes and click Add Shortcode.

2. In the Skins section, select Shortcode Designer from the dropdown.

3. In the Style section, choose the specific design template you created in the previous step.

4. Configure Display Options:

    ◦ Event Limits: Set the maximum number of events to be shown.

    ◦ Search Form: Activate the MEC Search Form and its filtering features within the shortcode.

    ◦ Event Display Mode: Choose between Modal or Separate Window for how event details open.

    ◦ Map Integration: Select Show Map on Top if you wish to display a map above your event list.

5. Deploy: Copy the generated shortcode and place it on any page or post.

---

Customization & Advanced Features

The addon provides extensive control over how your event data is presented:

• Unlimited Layouts: Create as many unique shortcode designs as needed for different areas of your site.

• Widget-Based Design: Unlike the Shortcode Builder Addon, which focuses on live placement, the Shortcode Designer Addon focuses on the granular styling of elements within the shortcode items themselves.

• Search Functionality: You can add exclusive search and filtering functions directly into your custom layouts to enhance user experience.

Use Cases (When This Addon is Useful)

• Unique Branding Requirements: Perfect for users who need event lists to match a highly specific website aesthetic that standard skins cannot provide.

• Complex Layout Needs: Ideal when you need to position specific event details (like date, location, or custom fields) in non-standard locations using Elementor’s grid system.

• Feature-Rich Event Displays: Useful for adding custom search filters and maps directly into a tailored event gallery.

Situations This Addon May Not Be Ideal

• Non-Elementor Sites: This addon is specifically designed for Elementor and will not provide a drag-and-drop experience for other page builders like Divi or WPBakery (though those can still be used for other parts of the site).

• Simple Setup Needs: If you are happy with the default MEC skins, this addon may add unnecessary complexity to your workflow.

• Live Previewing during Placement: For users who want to see live previews of events while embedding shortcodes into pages, the MEC Elementor Shortcode Builder Addon is a more appropriate tool.

Troubleshooting for Beginners

• Error 500 in Elementor: This usually indicates a server configuration issue. Ensure you are using the latest version of the addon, and increase your PHP memory limit to 512MB in your wp-config.php file.

• Widgets Not Loading: Double-check that ‘allow_url_fopen’ is enabled on your server. If it is disabled, contact your hosting provider to enable it.

• Missing “MEC Designer” Option: Ensure you have enabled the post type under Elementor > Settings > General.

• Addon Not Updating: If you don’t see an update option in Plugins > Installed Plugins, verify that your license is correctly activated or manually download the latest version from the Webnus dashboard.

FAQ