Embedded widgets allow you to display mentions curated in a collection on your own website. You have to create a collection before creating a widget for this collection. The following steps describe the process of creating a widget.
Creating a Widget for a Collection
To start with, access the Collections App in the App Switcher.
Find the collection you want to include in a widget and click on the three dotted icon which reveals a pop-up options menu. Select “Embed”.
NOTE: Ensure the contents of your collection are ready for sharing. You can edit collections and mentions included in them by selecting “Edit” from the options menu.
Customizing Your Widget
In the “Embed Widget” window, you can customize your widget before posting. The preview on the right-hand side reflects the changes made on the left-hand side panel. Use this as a guide when customizing your widget.
The following customization options are available here:
In the Layout section you can set the following options:
- Display Collection Name - Toggle on/off for displaying collection name on widget
- Display Logo - Toggle on/off for displaying organization’s logo
- Display Mention Introduction - Toggle on/off for program name, program logo, and timestamp for displayed mentions
- Display Transcription - Toggle on/off to display or hide mention transcripts
In the Properties section you can change the dimensions of the widget to fit the page destination.
In the Tags section you can specify tags for your collection to make it easier to find.
HEX values are 6 digit codes that express color. You can explore colors and generate codes by accessing the following sites:
Generating Widget and Adding It to Destination
When you have finished customizing your widget, click on “GENERATE” located at the bottom right hand corner of the window.
A snippet of code will be generated and will appear at the bottom of the window. Copy and paste this snippet into your website’s code for it to appear on your selected web page.
When a code snippet has already been generated for the widget, “UPDATE” appears instead of “GENERATE”. Make sure you click “UPDATE” after you make any changes to the widget. This updates the link so it reflects the most recent iteration of the widget.
Add the code snippet to your page and voila!
If you have any questions or comments, please email [email protected].