In this article we will cover the basics of editing a widget via the ReadyUp admin panel, this article will not explain how to integrate the widget onto your web platform.
- Log in to the ReadyUp Admin
- Select the Widgets option from the menu on the left side of the screen
- Select the widget you want to edit from the list or search for it using the bar on the top right
- Click on the widget you want to edit and you should see a new screen that looks like the image below. You can configure your widget with the panel on the left side of the screen, and preview the events that will be displayed with it on the right.
The table below describes each widget field on the page and gives examples for what type of information could be added.
|Widget Name||Descriptive name for the widget, this is not displayed publicly||ReadyUp Event Widget|
Minisite - Display the full filter bar in the widget.
Event Listing - Only show event cards, no filter options.
|Widget Scroll Mode||
Infinite - Upon scrolling to the bottom of the widget more events cards will load
Paginate - Events are divided into pages with a navigation bar on the bottom of the widget
|Theme||Choose between a dark or a light overall theme for the widget.||N/A|
|Button Color||Choose what color the buttons in the widget will be. Use the color picker or input a HEX color value.||#000000|
|Button Hover Color||Choose what color the buttons in the widget will be when a user hovers their mouse over them. Use the color picker or input a HEX color value.||#000000|
|Link Color||Choose what color the text links in the widget will be. Use the color picker or input a HEX color value.||#000000|
|Font||Select what font will be used in the widget. Fonts are provided by Google Fonts.||N/A|
|Attribution Style||Select what style to display the ReadyUp logo in the widget.||N/A|
|Attribution Color||Choose between the standard ReadyUp logo colors or an all orange version.||N/A|
Select a date range to display events from.
All Upcoming - Will get all future events.
Range Select - Allows you to choose a specific date range.
|Organizer||Select the Organizations whose events you want to display||Riot Games|
|Type||Select which types of events to display||Tournament|
|Location Type||Select if you want to display online or onsite locations||Online|
|Widget Status||Activate/Deactivate the widget||N/A|
When you are finished click the "Update" button in the bottom right corner of the widget config area. The page should reload and the preview should reflect any changes you have made.
In order to get the code for the widget so it can be integrated into your website or platform click the "Get Code" button and you will see a screen that looks like this:
You can copy the code and use it to add the widget to your website.