Add a 'On Sale' Alert to Products Created in a Loop - Ele Custom Skins in Elementor

1. Add an alert widget on Elementor
2. Give all necessary styling
3. make the alert position absolute
4. Add the following CSS to custom CSS area within the alert widget

selector {
border-radius: 500px;
}
selector .elementor-alert.elementor-alert-info {
border-radius: 500px;
width: 45px;
height: 45px;
display: flex;
padding: 0 0;
}
selector .elementor-alert-title {
padding: 0 0;
margin: auto;
text-align:center;
}

Example of the sale alert:

Did you find this article useful?

Related Articles

• Best Practice for Website Hero Section

  Best Practice for Website Hero Section In this article, we're going to cover the best practices of a well-executed website hero section. Now, in order...

---

• How to Add the Ken Burns effect in Elementor

  .elementor-section {width: 100%;height: 50vw;margin: 0 auto;overflow: hidden;position: relative;}.elementor-section img {width: 100%;animation: move 4...

---

• Make Inner Section in Elementor Sticky and Stay Within the Out Column

  This is How You Make an Inner Section in Elementor Sticky and Stay Within the Out Column.View example on https://702pros.com/clients/puppy-heaven/ The...

---

• How to make youtube shorts url(link) work on website without having to use embed code.

  There's two ways to make the youtube shorts URL work.First Option1. Copy and paste the embed code from your youtube shorts video.Example=(<iframe w...

---