Migrate to Netlify Today

Netlify announces the next evolution of Gatsby Cloud. Learn more

ContactSign Up
Community Plugin
View plugin on GitHub

gatsby-plugin-trustpilot-widget

License Version Release GitHub package.json dependency version (dev dep on branch) GitHub package.json dependency version (dev dep on branch) Node.js Package

Description

Trustpilot widget for GatsbyJS.

Install

npm

npm install @dadoagency/gatsby-plugin-trustpilot-widget

Configuration

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 -->

Component Usage

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/>
		);
	}
}

Attributes

The component has optional attributes which the user can use to set the aspect of the TrustBox.

language

Sets the language of the locale and the language of the API.

Default Value

en

Note

If you set the language attribute you have to set the culture attribute too.

culture

Sets the culture of the locale.

Default Value

US

Note

If you set the culture attribute you have to set the language attribute too.

theme

Sets the UI theme of the TrustBox.

Values
  • light
  • dark
Default value

light

width

Sets the width of the widget.

Default Value

100%

height

Sets the height of the widget.

Default Value

52px

stars

Filters reviews by stars

Default Value

null (returns all reviews)

Adding New Widgets

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.

© 2024 Gatsby, Inc.