Trustpilot widget for GatsbyJS.
npm install @dadoagency/gatsby-plugin-trustpilot-widget
Edit your gatsby-config.js.
module.exports = {
plugins: [
{
resolve: `@dadoagency/gatsby-plugin-trustpilot-widget`,
options: {
username: "USERNAME",
business: "BUSINESSUNIT_ID",
},
},
],
};
The username and business fields are required.
You can get the data from the TrustBox in your businness panel on Trustpilot
<!-- TrustBox widget - Review Collector -->
<div class="trustpilot-widget" data-locale="en-US" data-template-id="TEMPLATE_ID" data-businessunit-id="BUSINESSUNIT_ID" data-style-height="52px" data-style-width="100%">
<a href="https://en.trustpilot.com/review/USERNAME" target="_blank" rel="noopener">Trustpilot</a>
</div>
<!-- End TrustBox widget -->
Import the component TrustpilotReviews in your component.
import {List, MicroStar} from "@dadoagency/gatsby-plugin-trustpilot-widget";
Use it in your code as component.
class MyComponent extends React.Component {
render() {
return (
<List
language="en"
culture="US"
theme="light"
width="100%"
height="52px"
stars="3"
/>
<MicroStar/>
);
}
}
The component has optional attributes which the user can use to set the aspect of the TrustBox.
Sets the language of the locale and the language of the API.
en
If you set the language attribute you have to set the culture attribute too.
Sets the culture of the locale.
US
If you set the culture attribute you have to set the language attribute too.
Sets the UI theme of the TrustBox.
light
dark
light
Sets the width of the widget.
100%
Sets the height of the widget.
52px
Filters reviews by stars
null
(returns all reviews)
You can easily add more widgets by duplicating the most recently edited widget in src
, setting its template
to the widget's template ID (which you should define in src/templates.js
), and exporting it in index.js
.
If you commit your changes with a commit message starting with feat
, the npm package for this repo will have its version bumped and the new version published automatically.
(c) 2020, Dado Agency (Pty) Ltd; Pittaca S.r.l.s.