Embeddable Event Widget

Embeddable Event Widget

The Embeddable event widget addon allows you to add an events widget on your website by generating embed code.

Installing the Plugin                                                                               

The installation process is the same for all the add-ons offered by WP Event Manager. They can be installed automatically or manually.

  • Automatic Installation: You can install the plugin from the backend of your WordPress website. Click Here to see how you can install the plugin automatically.

  • Manual Installation: You can also install the plugin manually using SFTP or FTP tools. Click Here to see how you can install the plugin manually.

Watch the entire video for a better understanding.

How to Create an Embeddable Event Widget Form with Shortcodes?

After installing and activating the plugin, follow these steps to create the Embeddable Event Widget Form with shortcodes:

  1. Create a new page by following these steps: WP-admin >> Pages >> Add New.

  2. Add a title to it: “Embeddable Event Widget” or “Embeddable Event Listing”.

  3. Add the following shortcode to the content area:

[embeddable_event_widget_generator]

It is recommended that you insert the shortcode into the Text view of the visual editor to ensure it gets formatted correctly.

The Embeddable Event Widget’s [embeddable_event_widget_generator] shortcode will give the following output on the frontend of your website:

How to Generate the Widget Embed Code?                             

Installing the plugin means your website is prepared to generate the embed code with the [embeddable_event_widget_generator] shortcode.

One of the remarkable features of this widget is that you can easily specify the kind of events this code will display. You can use the fields that you can see in the above image to manage the widget behavior and specify the event type to display.

After mentioning the details, click on the “Get Widget Embed Code” option.

The Embeddable Widget Form Contains the Following Options

  • Keyword: Searches for the events that match the keywords provided.

  • Location: Searches for the events within a certain location.

  • Display Count: Controls how many events get displayed.

  • Show Pagination: Shows the next/previous pagination link in the widget to show more results.

  • Categories: Limits the events based on the selected categories.

  • Event Type: Limits the events based on selected event types.

After setting up the options for the Embeddable Event Widget, click on the “Get Widget Embed Code” button.

It will show two sections:

  1. Preview: Displays a preview of your widget.

  2. Code: Displays the code that you can paste wherever you want or into any website. It does not have to be a WordPress site to display the events.

How to Display Event Listings on a Facebook Page?              

We added this feature because we know how beneficial it is to promote your events on a popular social media platform like Facebook. You can easily reach out to your target audience on Facebook using the plugin.

Click on this link and follow the steps mentioned in that guide for displaying the event listings on a Facebook page.

Advanced: Overriding/Customizing the Widget Template Files      

For overriding or customization, template files can be found in the following directory:

wp-event-manager-embeddable-event-widget/templates/

To override a template file, follow the steps below:

  1. Create a directory named “wp-event-manager-embeddable-event-widget” under your theme folder.

  2. Copy the template file to the following directory:

/wp-content/yourtheme/wp-event-manager-embeddable-event-widget/

  1. Your theme will use all the template files from the /wp-content/yourtheme/wp-event-manager-embeddable-event-widget/ directory instead of the plugin’s template files:

/wp-content/plugins/wp-event-manager-embeddable-event-widget/

The following template files are available:

  • embed-code-generator-form.php: Contains the embed code generator form.

  • embed-code-css.php: Contains the CSS contained in the embed.

  • embed-code.php: Contains the main embed code script.

Remember: If you have overridden a template file and the plugin is frequently updated, you need to sync the template file with the new updates from the plugin’s template file for better functionality and new features.