In this tutorial we are going to create a very cool menu notification badge with a news sidebar in WordPress and Elementor, simple and clean to allow your users or visitor to be always up to date with your latest posts. I will add below a custom code that you can use to achieve this same result. So what are you waiting for? Start and create a WordPress Notification Badge with a news sidebar.
✨ Plugins:
Elementor Free: https://bit.ly/elementor-xdu
Elementor PRO: https://bit.ly/elementorpro-xdu
CSS code:
.menu-badge {
margin-left: 4px;
position: relative;
top: -10px;
margin-bottom: 5px;
color: #ffffff;
background-color: #F93E5E;
padding: 3px 3px;
border-radius: 100%;
}
.badge-bounce {
animation: bouncing .8s cubic-bezier(0.1,0.05,0.05,1) 0s infinite alternate both;
}
@keyframes bouncing{
0%{top:-6px}
100%{top:-10px}
}
HTML code:
<span class="menu-badge badge-bounce"></span>