Edit A Widget – ReadyUp

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.

Field	Description	Example
Widget Name	Descriptive name for the widget, this is not displayed publicly	ReadyUp Event Widget
Widget Type	Minisite - Display the full filter bar in the widget. Event Listing - Only show event cards, no filter options.	N/A
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	N/A
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
Range Select	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.	N/A
Genres	Select the Genres you want to display	MOBA
Games	Select the Games you want to display events in	League of Legends
Organizer	Select the Organizations whose events you want to display	Riot Games
Type	Select which types of events to display	Tournament
Platforms	Select which Platforms you want to display events from	Xbox
Languages	Select what language the events you display should be in	English
Location Type	Select if you want to display online or onsite locations	Online
Participant	Select which participant you want to display events from	Cloud9
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.

Your Widget ID is displayed at the top of the page, the icon to the left of it will allow you to copy it to the clipboard for use with our Twitch Widget.

In order to get the code for the widget so it can be integrated into your website or platform scroll down to the "Website Code" 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.

Related articles