Green thing showing on the slider

Topic summary

A user encountered an unwanted green element appearing on their website slider that they didn’t intentionally add.

Solution Provided:

  • Add custom CSS code to hide the element:
    .slideshow-block-style .dt-sc-swiper-slider .swiper-wrapper .slider-content .slide_1 .slide-sub-heading-2:before {
      display: none;
    }
    
  • Alternatively, locate this selector in the existing CSS file and add display: none directly there.

Resolution:
The CSS fix successfully removed the green element. Issue resolved.

Summarized with AI on October 26. AI used: claude-sonnet-4-5-20250929.

Hi,

May you please help me with the below. How do i remove that green thing, it just pops up on my slider which is weird as i did not add it. This is my website preview Shop High Quality PLUS SIZE Dresses Online IN SOUTH AFRICA – WardrobeNThings

1 Like

Its gone and thank you very much.

1 Like

From your screenshot it looks like the theme is adding a decorative element (a coloured shape) before the sub heading inside the slider. This is usually inserted via a :before pseudo element in the CSS.

You can hide it with a small CSS override in your theme:

/* remove the decorative accent before the slide sub heading */
.slideshow-block-style .dt-sc-swiper-slider .swiper-wrapper .slider-content .slide-sub-heading-2:before {
  display: none !important;
}

To add this, go to Online Store → Themes → Customize and open your theme settings. Many themes have an “Additional CSS” or “Custom CSS” input under Theme settings → Custom CSS. Paste the rule above and save. It will remove the green accent from all slides.

If your theme doesn’t have a custom CSS field you can edit the CSS file directly: navigate to Online Store → Themes → … → Edit code, find the main CSS file (often base.css, theme.css or custom.css), search for the .slide-sub-heading-2:before rule and either remove it or override it with display:none as shown above.

Alternatively, check the section settings in the theme editor. Some themes allow you to choose an accent colour or toggle decorative shapes for slider content. Changing the accent or turning off “show decorative shapes” could also remove the green bar.