To embed a Hub widget,
  1. Inside Hub setup, go to Landing page.
  2. Under the embeddable widget, Hub widget.



  3. Click on Hub Widget
  4. Click on the Get embeddable code to view the embeddable link.

  5. Click on the Copy button.

    image.png

  6. Paste the code in your HTML webpage inside the tag.
  7. The Hub widget will be visible on your website. Any updates to the hub will automatically be reflected in the hub’s widget.
To customize the hub widget, you can use the following custom classes,  
Variable Description
`custom-event-hub-name`Title of the event/webinar
`custom-event-hub-description`Description of the event/webinar inside the popup
`custom-event-hub-time`Timings of the event/webinar on the listing page and inside the popup
`custom-event-hub-status`Current status of the event (Upcoming, Completed, etc.)
`custom-event-hub-background`The background color of the whole widget.
`custom-event-hub-card-background`The background color of the event/webinar listing card
`custom-event-hub-modal-speaker-name`Name of the speaker inside the popup
`custom-event-hub-modal-speaker-description`Designation and company name of the speaker
`duda-event-hub-header-active-tab-text`The text string for the selected tab
`duda-event-hub-header-tab-text`The text strings for the unselected tabs

`duda-event-hub-register-button-text`The register button next to the event or webinar. To override, add `!important` tag as shown below:

.duda-event-hub-register-button-text{
  color: yellow !important;
}