Announcement

Ultimate top bar to announce sales that draw the attention of your visitors and engages them to subscribe, know important announcements, shipping cost and estimated delivery, ...

1 - Add bar

If you add 2 or more content it will switch to a slider.

1.1 - Sticky

Displayed on sticky header

1.2 - Space settings

Space settingsResponsive (Swiper slide)

2 - Example

Ex 1:

<div class="d-flex justify-content-center align-items-center">
    <p class="pe-2">Summer Sale Extra <strong>25% OFF</strong> with code <strong>SM2018A</strong></p>
    <a href="#" class="btn btn-sm btn-rounded btn-outline btn-white fw-normal" style="line-height: 1; padding: 0.5em 0.8em">SHOP NOW</a>
</div>

Ex 2:

<div class="d-flex justify-content-center align-items-center">
    <p class="pe-2">Summer Sale Extra <strong>25% OFF</strong> with code <strong>SM2018A</strong></p>
    <div class="pe-2">
        <div class="kt_countdown style02" data-time="2024/10/26 12:00:00"></div>
    </div>
    <a href="#" class="btn btn-sm btn-rounded btn-outline btn-white fw-normal" style="line-height: 1; padding: 0.5em 0.8em">SHOP NOW</a>
</div>

With css custom:

.announcement-item .kt_countdown.style02 {
    background-color: #fff;
    border-radius: 3px;
    padding: 0 10px;
}
.announcement-item .kt_countdown.style02 span.flip-top {
    font-size: 14px;
}