Building your Event App with all the features and information attendees need to network, have fun, and engage is worth every minute of effort. What if you want to spread some of that information beyond the Event App to your website or partner websites? Widgets to the rescue! 🦸♀️
Widgets are a great way to drive registration by giving unregistered site visitors an idea of what to expect from your event. Embed a widget to highlight your key speakers and sessions, give your top sponsors a shoutout, and more!
Create a widget
In your Event or Community navigation bar under ‘Event App’ or ‘Community’, click Promote, then Widgets, then New Widget. In the modal that appears, click the Feature Type drop-down and select the feature you want to use to create the widget.
Features include:
Agenda
Speakers
Sponsors
Exhibitors
Custom List
The process to create a widget is identical for each feature type, so this article's images only show the 'Speakers' feature type.
Select items
After selecting the feature type, enter a widget name. This name appears above the items in the widget when you embed it.
Next, click the Add... button. In the new modal that appears, check the box next to the items you want to show in the widget, up to 100 items. If you have multiple instances of the same feature, the Feature Name column shows which feature each item is part of. When you're done adding items, click Add... to close the modal.
Back in the New Widget modal, the items you added appear in the Selected area. Click and drag the six-dot cluster to change the order in which items appear in the widget. Click the Settings (⋯) icon next to an item to remove it from the widget.
Click Save Changes to finish creating your widget. 🎉 Repeat these steps as needed to create as many widgets as you want.
Manage widgets
Widgets you've created appear on the Widgets page. Click the Copy Widget Code button to embed the widget in your website, or click the Settings (⋯) icon to edit item selections, preview, or delete the widget.
Widget preview and appearance settings
Click the Settings (⋯) icon next to a widget, then click Preview. On the preview page, there are several ways to tailor the widget's appearance:
Show Header - Uncheck this box to hide the event icon, name, and date that appear at the top of the widget by default.
Show Background - Uncheck this box to hide the white or black background that appears behind widget elements by default. Since hiding the background makes the widget transparent, your website's background will appear behind widget items instead.
Show Display Name - Uncheck this box to hide the widget's display name.
Show Tracks (Agenda only) - Uncheck this box to hide the track bubbles from the widget.
Show Speakers (Agenda only) - Uncheck this box to hide the speaker icons and names from the widget.
Widget View (except Agenda) - Choose between Grid View or Carousel View. Grid View shows up to the first nine items in rows of three. If there are more than nine items in the widget, users can scroll to reveal more items. Carousel View shows the first three items, and users can click arrows on either side of the widget to reveal more items.
Dark Mode - Active this toggle to switch to a dark background and text to white.
💡 Keep in mind, if you activate dark mode or remove the background, carefully inspect how the widget works with your website after you embed the widget.
As you adjust settings, the preview below updates to reflect your selections.
Click Save Changes at the bottom of the page after you're done adjusting settings.
Copy widget codes
On the Widgets page, simply click the Copy Widget Code button to instantly copy the code and embed it in your website. We'll trust that you or someone you work with knows how to do that. 😉
Widgets in practice
After you embed a widget in a website, add items to or remove items from the widget at any time, and the widget updates automatically. No need to re-copy the widget code. 🙌
💡 Keep in mind, new feature items are never automatically added to widgets. You must manually select items.
Widgets set to the Carousel View show the first three items, as illustrated in the image below. Arrows on either side of this view let website visiters scroll to reveal more items. Widgets set to Grid View show up to the first nine items, and users can scroll freely within the widget to reveal more items.
The speakers, sponsors, exhibitors, and custom list widgets are view-only, so clicking on items doesn't reveal more information. However, when a website visitor clicks on a session, a small modal appears where visitors can read the full session description.
Now you know how to create content widgets. Did you know you can also embed your Webex Events Registration ticket options?
Questions? Chat with us or email support@socio.events