trustpilot

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick-theme.min.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.css"/>
<style>
/* Din CSS-kod */
</style>

<div class="box" id="aus-tp-slider">
<!-- Din HTML-kod -->
</div>

{% capture prevArrow %}
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="prev_arrow">
<circle class="arrow-slider-circle" cx="12" cy="12" r="11.5" stroke="#8C8C8C"></circle>
<path class="arrow-slider-shape" fill="#8C8C8C"
d="M10.5088835 12l3.3080582-3.02451041c.2440777-.22315674.2440777-.5849653 0-.80812204-.2440776-.22315673-.6398058-.22315673-.8838834 0L9.18305826 11.595939c-.24407768.2231567-.24407768.5849653 0 .808122l3.75000004 3.4285714c.2440776.2231568.6398058.2231568.8838834 0 .2440777-.2231567.2440777-.5849653 0-.808122L10.5088835 12z">
</path>
</svg>
{% endcapture %}
{% capture nextArrow %}
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="newxt_arrow">
<circle class="arrow-slider-circle" cx="12" cy="12" r="11.5" stroke="#8C8C8C"></circle>
<path class="arrow-slider-shape" fill="#8C8C8C"
d="M10.5088835 12l3.3080582-3.02451041c.2440777-.22315674.2440777-.5849653 0-.80812204-.2440776-.22315673-.6398058-.22315673-.8838834 0L9.18305826 11.595939c-.24407768.2231567-.24407768.5849653 0 .808122l3.75000004 3.4285714c.2440776.2231568.6398058.2231568.8838834 0 .2440777-.2231567.2440777-.5849653 0-.808122L10.5088835 12z">
</path>
</svg>
{% endcapture %}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<script type="text/javascript" src="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>
<script>
jQuery(document).ready(function($){
$('.aus_review_slider').slick({
infinite: true,
slidesToShow: 3,
slidesToScroll: 1,
autoplay: true,
arrows:true,
autoplaySpeed: 5000,
prevArrow: `<button type="button" class="slick-prev aus-prev">{{ prevArrow }}</button>`,
nextArrow: `<button type="button" class="slick-next aus-prev">{{ nextArrow }}</button>`,
responsive: [
{
breakpoint: 900,
settings: {
arrows: false,
centerMode: true,
centerPadding: '40px',
slidesToShow: 2
}
},
{
breakpoint: 600,
settings: {
arrows: false,
centerMode: true,
centerPadding: '40px',
slidesToShow: 1
}
}
]
});
});
</script>

{% schema %}
{
"name": "Custom Trust Pilot",
"class": "aus-section",
"limit": 1,
"settings": [
{
"type": "text",
"id": "heading",
"label": "Heading",
"default":"Uitstekend!"
},
{
"type": "richtext",
"id": "content",
"label": "Content",
"default":"<p>Gebaseerd op 827+ reviews </p>"
}
],
"blocks": [
{
"name":"Review Widget",
"type":"richtext",
"settings": [
{
"type": "select",
"id":"rating",
"label":"Rating",
"default":"5",
"options": [
{
"value": "5",
"label": "Five Star"
},
{
"value": "4",
"label": "Four Star"
}
]
},
{
"type": "text",
"id": "verified",
"label": "Verified",
"default":"Verified"
},
{
"type": "text",
"id": "review_title",
"label": "Review Title",
"default":"Snelle verzending!"
},
{
"type": "richtext",
"id": "review_content",
"label": "Review Content",
"default":"<p>Ik had mijn pakketje vorige week besteld en ik kreeg dezelfde avond nog een mailtje dat mijn pakket al verzonden was. Erg tevreden! </p>"
},
{
"type": "text",
"id": "review_time",
"label": "Review Time",
"default": "28-02-2023"
},
{
"type": "text",
"id": "customer_name",
"label": "Customer Name",
"default":"Jhon K."
}
]
}
],
"presets": [
{
"name": "Custom Trust Pilot"
}
]
}
{% endschema %}