Widgets
Overview
Prosper's referral widget is the front-end component served to our merchant's websites. Widgets can be designed and customized using Prosper's dashboard. Widgets make up the visual component of every Prosper referral, as opposed to campaigns which are the contextual component.
Creating a widget
To create a widget, go to your dashboard's Widgets page and click the Create Widget button. You will then be prompted to name your widget, name it something that will help you remember it.
Widget Language
After naming it, you will then be prompted to come up with some language for your widget:
| Language Property | Explanation |
|---|---|
Call to Action | the main text appearing on the first step of your widget. |
Completion Message | the end text appearing on the last step of your widget. |
Default Editable Message | the template message consumers will be offered to share with their friends. |
Widget Colors
Next, you will be prompted to decide on colors for your widget:
| Color Name | Explanation |
|---|---|
Color | the background color of your widget |
SecondaryColor | the text color in your widget |
HoverColor | the background color of your widget while hovered (only while collapsed) |
IconColor | the color of the icons in your widget |
ButtonColor | the color of buttons in your widget |
ErrorColor | the color error messages would appear as in your widget |
InitialLicenseColor | the color of Prosper's license on the first step of your widget |
SendButtonArrowColor | the color of the arrow on the send button in your widget |
Widget Sizing
We recommend leaving this section untouched, until you have more experience with deploying Prosper to your website.
Next, you will be prompted to decide on sizing for your widget.
| Size Name | Explanation |
|---|---|
Custom Height | the heights of your widget (in pixels) when it is collpased, and expanded |
Corner Radius | the measurement of how round your widget's corners are in pixels. 0 would be square |
Primary Font Size | the font size in pts for all headers and titles |
Secondary Font Size | the font size in pts for non header text |
Tertiary Font Size | the font size in pts for error messages, licenses, and other miscellaneous texts |
Congratulations! you have created your first widget. You can now create more widgets, take a short break (well deserved), or blast ahead and start creating your first campaign.