Hire me for any WordPress works

To customize , you’ll need to use some custom CSS code. Here’s a step-by-step guide to achieving this:

  1. Access Theme Customizer: In your WordPress dashboard, go to “Appearance” > “Customize.”
  2. Open Additional CSS: In the Customizer, look for the “Additional CSS” section.
  3. Add Custom CSS: Add the following custom CSS code to create rounded corners for the sale badge:

/* Customize the sale badge */
.woocommerce span.onsale
background-color: #e74c3c; /* Customize badge background color */
color: #fff; /* Customize badge text color */
font-size: 14px; /* Customize badge font size */
padding: 4px 8px; /* Customize badge padding */
border-radius: 20px; /* Customize the border radius to make it rounded */


  1. Customize the Styles: You can modify the values of background-color, color, font-size, padding, border-radius to match your design preferences. Make sure to preview the changes and adjust them accordingly.
  2. Save Changes: Once you’re satisfied with the changes, click the “Publish” button in the Customizer to save the custom CSS.
  3. Clear Cache (if necessary): If your changes don’t appear immediately, try clearing your browser cache and any caching plugins you might have on your site.


Visited 1 times, 1 visit(s) today