The Upload widget is used to allow entrants to upload entries into your contest. This widget is typically used in conjunction with the Registration widget if User Registration is required to enter your contest. All widgets are responsive in design so they will resize based on the size of the device displaying the widget.
To edit the Upload widget select Design for the specific contest and then select the Contest Widgets tab.
Then select "Edit" to modify the look and feel of the Upload widget.
The following options are then available to style your Upload widget:
Widget Title - This is just the name of the widget to help you identify the widget from the list of all widgets.
Background - This is the background colour for the Upload Widget
Field outline colour # - This is the colour of the field box outlines.
Field fill colour # - This is the colour of the field box fill
Upload success message - This is the message that is displayed after a user successfully uploads an entry and Entry Moderation is not enabled in the contest.
Entry moderation message- This is the message that is displayed after a user successfully uploads and entry and Entry Moderation is enabled in the contest.
Text Styling - The text styling and associated settings (Typeface, Weight, Size, Colour, Background Colour*, Shadow colour) is used to set the various fonts and button styling. *Note background colour only applicable to buttons.
iFrame width - This sets the widget of the widget to be displayed on the page. This can be expressed in either px or %. To maximise the width available to the gallery widget set this to 100%. This will allow it to be displayed correctly on mobile devices
iFrame height - Set this to the height of the gallery. Note if this is set too small the widget will display vertical scroll bars.
Embed code
The widget can be embedded in to the site by using the embed code.
Head/Footer embed code
The first code to embed includes the code that should be included in the header or footer section of your website.
In order to use this select the "Copy div to clipboard" option and then paste this code into the header or footer of your website. Then edit the code and paste the API key you registered ( refer: here ) earlier replacing the "Your API Key Here" text with your key. Make sure you keep the quotes around the API key.
Note that once you have done this for one widget you will not need to add this code for any other widgets as they all use the same header/footer embed code.
Widget embed code
Now that the header/footer code is inserted you can now place the embed code for the specific widget.
Copy the embed code by selecting the "Copy div to clipboard" button and place the code wherever you would like the widget to appear in your website.
Once this is complete review your site and if required adjust the widget styling to fine tune to match with your site.