How to create CAROUSEL in shopify

<div class=”card col-md-12 mt-2″>
<div id=”carouselExampleControls” class=”carousel slide” data-ride=”carousel” data-interval=”100000″>
<div class=”w-100 carousel-inner mb-5″ role=”listbox”>

{% assign total = section.blocks.size | divided_by: 3 %}
{% assign count_mod = section.blocks.size | modulo: 3 %}
{% assign offset = 0 %}

{% if count_mod > 0 %}
{% assign total = total | plus: 1 %}
{% endif %}

{% for i in (1..total) %}

{% if forloop.first == true %}
<div class=”carousel-item active”>
{% else %}
<div class=”carousel-item”>
{% endif %}

<div class=”bg”></div>
<div class=”row”>

{% for block in section.blocks limit: 3 offset: offset %}

<div class=”col-md-4″>
<div class=”carousel-caption”>
<div class=”row”>
<div class=”col-sm-3 col-4 align-items-start”>
<img src=”{{ block.settings.icon | img_url: “300×300″ }}” class=”img-fluid”>
</div>
<div class=”col-sm-9 col-8″>
<h6 class=”mb-0″>{{ block.settings.heading }}</h6>
<p class=”mb-0″>Happy Customer</p>
</div>
<div class=”col-sm-12 content”>
<small>{{ block.settings.content }}</small>
</div>
</div>
</div>
</div>

{% endfor %}

</div>
</div>

{% assign offset = offset | plus: 3 %}

{% endfor %}

</div>
<a class=”carousel-control-prev” href=”#carouselExampleControls” role=”button” data-slide=”prev”>
<span class=”carousel-control-prev-icon” aria-hidden=”true”><i class=”fas fa-chevron-left”></i></span>
<span class=”sr-only”>Previous</span>
</a>
<a class=”carousel-control-next” href=”#carouselExampleControls” role=”button” data-slide=”next”>
<span class=”carousel-control-next-icon” aria-hidden=”true”><i class=”fas fa-chevron-right”></i></span>
<span class=”sr-only”>Next</span>
</a>
</div>
</div>
</div>