Layout
The PushFeedback button is highly customizable, allowing you to customize its behavior to suit your application's needs. This page lists all available properties you can use to adjust the behavior and appearance of the PushFeedback button in your application.
Usage
To customize the properties, you need to set the appropriate attributes on the <feedback-button>
element in your HTML. For example:
<feedback-button project="YOUR_PROJECT_ID" button-style="dark" hide-icon="true">Feedback</feedback-button>
Properties
The table below lists all the available properties you can set:
Property | Description |
---|---|
project | Required Type: string The project ID. |
button-position | Type: string Default value: default Available values: default , bottom-right , center-right Position of the button. |
button-style | Type: string Default value: default Available values: default , dark , light Style of the button. |
custom-font | Type: boolean Default value: false When set to true , the Inter font will not be loaded. Useful if your site already uses a different font, enabling a quicker load time. |
hide-email | Type: boolean Default value: false Whether to hide the email input. |
email-address | Type: string Initial value for the email input field. |
hide-icon | Type: boolean Default value: false Whether to hide the button icon. |
hide-screenshot-button | Type: boolean Default value: false Whether to hide the screenshot button. |
modal-position | Type: string Default value: center Available values: center , sidebar-right , sidebar-left , top-right , top-left , bottom-right , bottom-left , center-right , center-left Position of the feedback modal. |
hide-privacy-policy | Type: boolean Default value: true Whether to hide the privacy policy checkbox. |
privacy-policy-text | Type: boolean Default value: I have read and expressly consent to the terms of the <a href='https://pushfeedback.com/privacy'>Privacy Policy</a>. Privacy policy text. |
rating | Type: number Default value: None Rating selected by default. Available values: 1...5. In thumbs mode, 0 means thumbs down and 1 thumbs up. |
hide-ratings | Type: boolean Default value: false Wether to hide the ratings input. |
rating-mode | Type: string Default value: thumbs Available values: thumbs , stars Type of rating system. |
sessionId | Type: string Default value: Autogenerated Identifies the current user session. By default, this value is autogenerated if not provided. You can override it to specify a custom session ID, which can be useful for tracking or linking specific sessions across different analytics tools. |
Examples
Here you'll find practical examples to guide you in customizing the PushFeedback button for various use cases.
Change the button style
Create a floating button
Add the widget to any button
Like / dislike buttons
Change modal position
info
For an optimal viewing experience of this demo, select the 0.25x zoom level on CodePen.