🔄Make changes dynamically

Sometimes, you might want to collect your feedback and bug reports from different sources/websites into one project. More often than not, the layout and design of each source is different, so in this guide, you will learn how to customize the same button for different sites.

1. Select the properties you want to change

UserHelp offer a selected amount of properties for each button that you can change. The properties are listed below:

Property	Definition	Data type
UserHelpButtonColor	The color of the button	any Hex color code
UserHelpButtonText	The text content inside the button	any String
UserHelpButtonColor	The color of the text content inside the button	any Hex color code
UserHelpPlacementMode	How the button is placed	"automatic" or "manual"
UserHelpAutomaticPosition	Defines the position of the button if placement mode is set to "automatic"	"bottomRight", "bottomLeft", middleRight, middleLeft "topRight" or "topLeft"
UserHelpManualContainerID	Defines the wrapper container's ID of the button if placement mode is set to "manual"	any String
UserHelpDarkMode	Whether to render the feedback form in dark mode	true or false
UserHelpLanguage	The language used in the feedback form	"en" (English), "fr" (French),"es" (Spanish), "ar" (Arabic), "hi-IN" (Hindi), "zh-Hans-CN" (Simplified Chinese)

2. Make your edits

After that, simply add each property that you want to change into the button by adding a new line after the UserHelpPublicProjectID property. Below is an example of altering a button's background color to black (i.e. #000000) even when the default button's color is something else.

<script>
    window.UserHelpPublicProjectID="6WVGQOqqz"
    window.UserHelpButtonColor="#000000"
</script>
<script src="https://run.userhelp.co" async></script>