Block #16
Tips:
How to hide any element for non-logged in users or show it only for logged in users? Learn more
Title modifications - Learn more
Available options
Turn on
Show Block Separator (hr)
Additional Class Name (only for developers)
Intro Title
Intro Content
HTML Content
Footer Content
Preview
Code snippet
<div class="swiper swiper-block--16 rui--swiper-arrows">
<div class="swiper-wrapper">
<!-- Start item -->
<div class="swiper-slide rui-card-item">
<div class="rui-card h-100" style="
max-width: 100%;
">
<div class="rui-card-body">
<h4 class="mb-3">Indigenous peoples Education Australia Queensland.</h4>
<a href="https://rosea.io">
<div class="rui-img--rounded-fluid"><img src="https://demo.rosea.io/baz/1/pluginfile.php/1/theme_baz/bazsettingsimgs/0/img-4.jpg?time=1635624685924" alt="img 4" width="400" height="225"></div>
</a>
<p class="rui-card-text mt-3">Auto-generated reports: Get accurate insights on your performance with auto-generated reports that help create successful campaigns.</p>
<ul class="rui-special-list rui-special-list--light">
<li>Personal asset watchlists</li>
<li>Curated market data feed</li>
<li class="list-icon-x">Sansheets plugin with pre-made templates</li>
</ul>
<a href="https://rosea.io" class="rui-card-btn-link mt-2">Learn more about the Smart Keyboard</a>
</div>
</div>
</div>
<!-- End item -->
<!-- Start item -->
<div class="swiper-slide rui-card-item">
<div class="rui-card h-100">
<div class="rui-card-body">
<span class="badge-xs badge-warning">Updated: October 11, 2011</span>
<h4 class="mt-2 mb-3">Aboriginal Australians Study and teaching Australia Queensland.</h4>
<a href="https://rosea.io">
<div class="rui-img--rounded-fluid"><img src="https://demo.rosea.io/baz/1/pluginfile.php/1/theme_baz/bazsettingsimgs/0/img-5.jpg" alt="img 5" width="400" height="225"></div>
</a>
<p class="rui-card-text mt-3">Auto-generated reports: Get accurate insights on your performance with auto-generated reports that help create successful campaigns.</p>
<ul class="rui-special-list rui-special-list--primary">
<li>Personal asset watchlists</li>
<li>Curated market data feed</li>
<li class="list-icon-x">Sansheets plugin with pre-made templates</li>
</ul>
<a href="https://rosea.io" class="rui-card-btn-link mt-2">Learn more about the Smart Keyboard</a>
</div>
</div>
</div>
<!-- End item -->
<!-- Start item -->
<div class="swiper-slide rui-card-item">
<div class="rui-card h-100">
<div class="rui-card-body">
<span class="badge-xs badge-info">New</span>
<h4 class="mt-2 mb-3">Curriculum-based assessment Aids and devices.</h4>
<a href="https://rosea.io">
<div class="rui-img--rounded-fluid"><img src="https://demo.rosea.io/baz/1/pluginfile.php/1/theme_baz/bazsettingsimgs/0/img-6.jpg" alt="img 6" width="400" height="225"></div>
</a>
<p class="rui-card-text mt-3">Auto-generated reports: Get accurate insights on your performance with auto-generated reports that help create successful campaigns.</p>
<ul class="rui-special-list rui-special-list--light">
<li>Personal asset watchlists</li>
<li>Curated market data feed</li>
<li class="list-icon-x">Sansheets plugin with pre-made templates</li>
</ul>
<a href="https://rosea.io" class="rui-card-btn-link mt-2">Learn more about the Smart Keyboard</a>
</div>
</div>
</div>
<!-- End item -->
<!-- Start item -->
<div class="swiper-slide rui-card-item">
<div class="rui-card h-100">
<div class="rui-card-body">
<h4 class="mb-3">Indigenous peoples Education Australia Queensland.</h4>
<a href="https://rosea.io">
<div class="rui-img--rounded-fluid"><img src="https://demo.rosea.io/baz/1/pluginfile.php/1/theme_baz/bazsettingsimgs/0/img-4.jpg?time=1635624685924" alt="img 4" width="400" height="225"></div>
</a>
<p class="rui-card-text mt-3">Auto-generated reports: Get accurate insights on your performance with auto-generated reports that help create successful campaigns.</p>
<ul class="rui-special-list rui-special-list--light">
<li>Personal asset watchlists</li>
<li>Curated market data feed</li>
<li class="list-icon-x">Sansheets plugin with pre-made templates</li>
</ul>
<a href="https://rosea.io" class="rui-card-btn-link mt-2">Learn more about the Smart Keyboard</a>
</div>
</div>
</div>
<!-- End item -->
<!-- Start item -->
<div class="swiper-slide rui-card-item">
<div class="rui-card h-100">
<div class="rui-card-body">
<h4 class="mb-3">Indigenous peoples Education Australia Queensland.</h4>
<a href="https://rosea.io">
<div class="rui-img--rounded-fluid"><img src="https://demo.rosea.io/baz/1/pluginfile.php/1/theme_baz/bazsettingsimgs/0/img-4.jpg?time=1635624685924" alt="img 4" width="400" height="225"></div>
</a>
<p class="rui-card-text mt-3">Auto-generated reports: Get accurate insights on your performance with auto-generated reports that help create successful campaigns.</p>
<ul class="rui-special-list rui-special-list--light">
<li>Personal asset watchlists</li>
<li>Curated market data feed</li>
<li class="list-icon-x">Sansheets plugin with pre-made templates</li>
</ul>
<a href="https://rosea.io" class="rui-card-btn-link mt-2">Learn more about the Smart Keyboard</a>
</div>
</div>
</div>
<!-- End item -->
<!-- Start item -->
<div class="swiper-slide rui-card-item">
<div class="rui-card h-100">
<div class="rui-card-body">
<h4 class="mb-3">Indigenous peoples Education Australia Queensland.</h4>
<a href="https://rosea.io">
<div class="rui-img--rounded-fluid"><img src="https://demo.rosea.io/baz/1/pluginfile.php/1/theme_baz/bazsettingsimgs/0/img-4.jpg?time=1635624685924" alt="img 4" width="400" height="225"></div>
</a>
<p class="rui-card-text mt-3">Auto-generated reports: Get accurate insights on your performance with auto-generated reports that help create successful campaigns.</p>
<ul class="rui-special-list rui-special-list--light">
<li>Personal asset watchlists</li>
<li>Curated market data feed</li>
<li class="list-icon-x">Sansheets plugin with pre-made templates</li>
</ul>
<a href="https://rosea.io" class="rui-card-btn-link mt-2">Learn more about the Smart Keyboard</a>
</div>
</div>
</div>
<!-- End item -->
<!-- Start item -->
<div class="swiper-slide rui-card-item">
<div class="rui-card h-100">
<div class="rui-card-body">
<h4 class="mb-3">Indigenous peoples Education Australia Queensland.</h4>
<a href="https://rosea.io">
<div class="rui-img--rounded-fluid"><img src="https://demo.rosea.io/baz/1/pluginfile.php/1/theme_baz/bazsettingsimgs/0/img-4.jpg?time=1635624685924" alt="img 4" width="400" height="225"></div>
</a>
<p class="rui-card-text mt-3">Auto-generated reports: Get accurate insights on your performance with auto-generated reports that help create successful campaigns.</p>
<ul class="rui-special-list rui-special-list--light">
<li>Personal asset watchlists</li>
<li>Curated market data feed</li>
<li class="list-icon-x">Sansheets plugin with pre-made templates</li>
</ul>
<a href="https://rosea.io" class="rui-card-btn-link mt-2">Learn more about the Smart Keyboard</a>
</div>
</div>
</div>
<!-- End item -->
</div> <!-- swiper-wrapper -->
<div class="d-none d-md-flex swiper-button-next"></div>
<div class="d-none d-md-flex swiper-button-prev"></div>
<div class="swiper-pagination"></div>
</div>Footer Content (Script)
<script>
var swiper16 = new Swiper(".swiper-block--16", {
slidesPerView: 3,
spaceBetween: 30,
centeredSlides: true,
navigation: {
nextEl: ".swiper-button-next",
prevEl: ".swiper-button-prev",
},
keyboard: {
enabled: true,
},
pagination: {
el: ".swiper-pagination",
clickable: true,
},
// Responsive breakpoints
breakpoints: {
// when window width is >= 320px
320: {
slidesPerView: 1,
},
// when window width is >= 768px
768: {
slidesPerView: 2,
},
// when window width is >= 1000px
1100: {
slidesPerView: 3,
}
},
});
</script>Last updated
