Feedback widget for Antora
Here's a step-by-step guide to help you install PushFeedback in your Antora project.
Before you begin, you'll need to have the following:
- A PushFeedback account. If you don't have one, sign up for free.
- A project created in your PushFeedback dashboard. If you haven't created one yet, follow the steps in the Quickstart guide.
- An Antora project.
To integrate the PushFeedback widget into your Antora site:
Modify the UI bundle:
If you're using a custom UI bundle for your Antora project, navigate to the UI bundle's directory.
If not, you'll first need to clone Antora's default UI bundle.
git clone https://gitlab.com/antora/antora-ui-default.git
head.hbsfile, which is usually under
src/partials, and insert the following code:
<!-- Initialize the PushFeedback widget -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/pushfeedback/dist/pushfeedback/pushfeedback.css">
<script type="module" src="https://cdn.jsdelivr.net/npm/pushfeedback/dist/pushfeedback/pushfeedback.esm.js"></script>
footer.hbsor the specific file where you'd like the feedback button to appear. Just before the closing tags in that file, add the following snippet:
<feedback-button project="<YOUR_PROJECT_ID>" button-position="bottom-right" modal-position="bottom-right" button-style="light">Feedback</feedback-button>
<YOUR_PROJECT_ID>with your project's ID from the PushFeedback dashboard.
Build the project:
- If you're using a custom UI, make sure to re-bundle it and then run the Antora command to build your project.
- If you cloned the default UI, you'd have to integrate it as a local UI and then run Antora with the
--ui-bundle-urlflag to point to your modified local UI bundle.
Once it builds successfully, verify that the feedback button appears and functions correctly on your site.
For more about customization and additional features exploration, check out the Configuration section.
Need assistance? We're here to help! Reach out to us at PushFeedback Support.