{{#courses}}
<div class="slick-carousel-item h-100" data-courseid="{{courseid}}" data-catid={{categoryid}} data-courseshortname="{{shortname}}">
    <div class="card-container">
        <div class="card">
            <div class="img-box">
                <img src="{{courseimage}}" alt="{{coursename}}">
                <p class="card-name">
                    {{{categoryname}}}
                </p>
            </div>
            <div class="card-body">
                <div class="card-content">
                    <p class="card-title ellips-item-2">{{{coursename}}}</p>
                    <p class="card-desc ellips-item-2">{{coursesummary}}</p>
                </div>
                <a href="{{courseurl}}" class="card-btn">
                    <button>View</button>
                </a>
            </div>
        </div>
    </div>
</div>

{{/courses}}