Categories List #2
Site administration -> Appearance -> Alpha -> Block #
Last updated
Site administration -> Appearance -> Alpha -> Block #
Last updated
You can use any HTML block area to use a preset. You can even add an HTML preset anywhere on the page. There are fully customizable and reusable.
<div class="content">
<div class="courses">
<div class="rui-course-card-deck mt-2">
<div class="rui-course-card" role="listitem" data-region="course-content">
<div class="rui-course-card-icons">
<div class="rui-icon-container">
<span class="rui-icon-container"><img class="icon" alt="Guest access" title="Guest access" src="https://roseathemes.com/alpha/1/theme/image.php/alpha/enrol_guest/1676737926/withoutpassword"></span>
</div>
</div>
<div class="rui-course-card-wrapper">
<a href="#" tabindex="-1">
<figure class="rui-course-card-img-top" style="background-image: url(https://roseathemes.com/alpha/1/pluginfile.php/290/course/overviewfiles/course-img-5.jpg);"></figure>
</a>
<div class="rui-course-card-body">
<div class="d-flex mb-1">
<h4 class="rui-course-card-title mb-1">
<a href="#" class="aalink coursename">
Biology Foundation Course
</a>
</h4>
</div>
<div class="d-inline-flex mt-2">
<div class="rui-course-cat-badge">
Expert
</div>
</div>
</div>
</div>
<div class="rui-card-course-contacts">
<a href="#" class="rui-card-contact rui-user-Teacher" data-toggle="tooltip" data-placement="top" title="System Administrator - Teacher">
<img src="https://roseathemes.com/alpha/1/pluginfile.php/5/user/icon/alpha/f1?rev=19158" class="rui-card-avatar" alt="System Administrator">
</a>
<a href="#" class="rui-card-contact rui-user-Teacher" data-toggle="tooltip" data-placement="top" title="Sophia Fox - Teacher">
<img src="https://roseathemes.com/alpha/1/pluginfile.php/178/user/icon/alpha/f1?rev=10889" class="rui-card-avatar" alt="Sophia Fox">
</a>
</div>
<div class="rui-course-card-footer">
<a href="#" class="rui-course-card-link btn btn-primary">
<span class="rui-course-card-link-text">Get access</span>
<svg width="22" height="22" fill="none" viewBox="0 0 24 24">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M13.75 6.75L19.25 12L13.75 17.25"></path>
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M19 12H4.75"></path>
</svg>
</a>
</div>
</div>
<div class="rui-course-card" role="listitem" data-region="course-content">
<div class="rui-course-card-icons">
<div class="rui-icon-container">
<span class="rui-icon-container"><img class="icon " alt="Guest access" title="Guest access" src="https://roseathemes.com/alpha/1/theme/image.php/alpha/enrol_guest/1676737926/withoutpassword"></span>
</div>
</div>
<div class="rui-course-card-wrapper">
<a href="#" tabindex="-1">
<figure class="rui-course-card-img-top" style="background-image: url(https://roseathemes.com/alpha/1/pluginfile.php/270/course/overviewfiles/course-img-4.jpg);"></figure>
</a>
<div class="rui-course-card-body">
<div class="d-flex mb-1">
<h4 class="rui-course-card-title mb-1">
<a href="#" class="aalink coursename">
Gods and Kings: The Art History of Mesopotamia and Arabia
</a>
</h4>
</div>
<div class="d-inline-flex mt-2">
<div class="rui-course-cat-badge">
Expert
</div>
</div>
</div>
</div>
<div class="rui-card-course-contacts">
<a href="#" class="rui-card-contact rui-user-Teacher" data-toggle="tooltip" data-placement="top" title="System Administrator - Teacher">
<img src="https://roseathemes.com/alpha/1/pluginfile.php/5/user/icon/alpha/f1?rev=19158" class="rui-card-avatar" alt="System Administrator">
</a>
<a href="#" class="rui-card-contact rui-user-Teacher" data-toggle="tooltip" data-placement="top" title="Sophia Fox - Teacher">
<img src="https://roseathemes.com/alpha/1/pluginfile.php/178/user/icon/alpha/f1?rev=10889" class="rui-card-avatar" alt="Sophia Fox">
</a>
</div>
<div class="rui-course-card-footer">
<a href="#" class="rui-course-card-link btn btn-primary">
<span class="rui-course-card-link-text">Get access</span>
<svg width="22" height="22" fill="none" viewBox="0 0 24 24">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M13.75 6.75L19.25 12L13.75 17.25"></path>
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M19 12H4.75"></path>
</svg>
</a>
</div>
</div>
<div class="rui-course-card" role="listitem" data-region="course-content">
<div class="rui-course-card-icons">
<div class="rui-icon-container">
<span class="rui-icon-container"><img class="icon " alt="Guest access" title="Guest access" src="https://roseathemes.com/alpha/1/theme/image.php/alpha/enrol_guest/1676737926/withoutpassword"></span>
</div>
</div>
<div class="rui-course-card-wrapper">
<a href="https://roseathemes.com/alpha/1/course/view.php?id=10" tabindex="-1">
<figure class="rui-course-card-img-top" style="background-image: url(https://roseathemes.com/alpha/1/pluginfile.php/215/course/overviewfiles/course-img-3.jpg);"></figure>
</a>
<div class="rui-course-card-body">
<div class="d-flex mb-1">
<h4 class="rui-course-card-title mb-1">
<a href="https://roseathemes.com/alpha/1/course/view.php?id=10" class="aalink coursename">
Lectures on Greek History and Culture
</a>
</h4>
</div>
<div class="d-inline-flex mt-2">
<div class="rui-course-cat-badge">
Expert
</div>
</div>
</div>
</div>
<div class="rui-card-course-contacts">
<a href="#" class="rui-card-contact rui-user-Teacher" data-toggle="tooltip" data-placement="top"
title="System Administrator - Teacher">
<img src="https://roseathemes.com/alpha/1/pluginfile.php/5/user/icon/alpha/f1?rev=19158" class="rui-card-avatar" alt="System Administrator">
</a>
<a href="#" class="rui-card-contact rui-user-Teacher" data-toggle="tooltip" data-placement="top"
title="Sophia Fox - Teacher">
<img src="https://roseathemes.com/alpha/1/pluginfile.php/178/user/icon/alpha/f1?rev=10889" class="rui-card-avatar" alt="Sophia Fox">
</a>
</div>
<div class="rui-course-card-footer">
<a href="https://roseathemes.com/alpha/1/course/view.php?id=10"
class="rui-course-card-link btn btn-primary">
<span class="rui-course-card-link-text">Get access</span>
<svg width="22" height="22" fill="none" viewBox="0 0 24 24">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M13.75 6.75L19.25 12L13.75 17.25"></path>
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M19 12H4.75"></path>
</svg>
</a>
</div>
</div>
<div class="rui-course-card" role="listitem" data-region="course-content">
<div class="rui-course-card-wrapper">
<a href="https://roseathemes.com/alpha/1/course/view.php?id=5" tabindex="-1">
<figure class="rui-course-card-img-top" style="background-image: url(https://roseathemes.com/alpha/1/pluginfile.php/80/course/overviewfiles/course-img-2.jpg);"></figure>
</a>
<div class="rui-course-card-body">
<div class="d-flex mb-1">
<h4 class="rui-course-card-title mb-1">
<a href="https://roseathemes.com/alpha/1/course/view.php?id=5" class="aalink coursename">
Revision: Chemistry
</a>
</h4>
</div>
<div class="d-inline-flex mt-2">
<div class="rui-course-cat-badge">
Expert
</div>
</div>
</div>
</div>
<div class="rui-course-card-footer">
<a href="https://roseathemes.com/alpha/1/course/view.php?id=5"
class="rui-course-card-link btn btn-primary">
<span class="rui-course-card-link-text">Get access</span>
<svg width="22" height="22" fill="none" viewBox="0 0 24 24">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M13.75 6.75L19.25 12L13.75 17.25"></path>
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M19 12H4.75"></path>
</svg>
</a>
</div>
</div>
</div>
</div>
</div>
```