How to implement the testemonal script
Put this script anywhere on your site, for a performance increase, put it as close to the closing body tag as possible:
<script src="script.js" data-key="xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx" defer="defer"></script>
Then put this div where you want the slider to render:
<div class="testemonial-anchor" data-height="250px" data-width="100%" data-slidetime="5000" data-fadetime="600" data-headingtype="h2" data-importcss="true" data-microdata="true" data-strictstyle="false" data-overflow="false" data-stars="both"></div>
Data attributes:
- data-height: an absolute height that you want the slider to be rendered with, you can use any css measuring unit, the hight will automatically adjust if some slides are taller than the designated value. (default is 300px)
- data-width: an absolute width that you want the slider to be rendered with, you can use any css measuring unit. (default is 100%)
- data-slidetime: The time it takes before a slide switches to the next slide, measured in ms. (default is 6000)
- data-fadetime: The transition time inbetween two slides, measured in ms. (default is 600)
- data-headingtype: what type of html element do you want to use to display headings on the slider. (default is "h2")
- data-cssimport: you can set this to false if you dont want to import css for the slider, and do it yourself. (default is "true")
- data-microdata: you can set this to false if you dont want to automaticly insert reviews reviewscore micro data, setting this to false will disable star ratings from appearing in google search results. (default is "true")
- data-strictstyle: you can set this to true if you want the slider to not inherit styles from the rest of your page, and have a much stricter approach as to how things are styled on the slider, this cannot be true if data-importcss is set to false. (default is "false")
- data-overflow: set data-overflow to scroll if you want reviews that i bigger than your sliders height to have a scrollbar.
- data-stars: Choose what stars you want to display in the slider, the possible values are 'average' to only show the average star score, 'individual' to show the individual stars of each review only, 'both' the default option to show both the average and individual number of stars, 'none' to show no stars at all.