Newsberg - Delete Dark Gradient On Images - Question | JoomShaper
Back to the questions

Newsberg - Delete Dark Gradient On Images

P

Peter

Template 9 months ago

Hi all, I have installed the quick start pack newsberg. i'm trying to customize the article news slider right at the top of the home page. Unfortunately i can't find an option to remove the dark gradient on the images. This gradient is visible on many images on the website. Can i remove it everywhere to see the clear image without the dark gradient everywhere? On your sample website you can see the gradients and there doesn't seem to be a page builder option for it.

https://www.joomshaper.com/joomla-templates/newsberg

thank you very much for your help

Peter

0
7 Answers
Order by
Oldest Newest Votes
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 9 months ago #182040

Hello Peter,

Thank you for reaching out to us. Our template is designed this way to enhance the overall visual appeal. While we do not provide direct customization, I’d be happy to guide you on how to remove the dark overlay from the image.

  1. Inspect the image on your page, and locate the corresponding div for the image.
  2. Expand the div, and you should see a ::before or ::after pseudo-element.
  3. Click on it, and the related CSS will appear on the right side.
  4. Here, you can use content: unset to remove the dark overlay.

Once you have made this change, copy the CSS and add it to your custom CSS.

Add custom css: https://www.joomshaper.com/documentation/helix-framework/custom-code-css-js-meta

Example:

.sppb-addon-articles-layout.layout-bourbon .sppb-addon-article:after {
    content: unset;
}

N.B.: Just copy the corresponding class and inside curly braces use content: unset;, That will remove dark overlay.

Let me know if you need any further assistance!

Best regards,

0
P
Peter
Accepted Answer
9 months ago #182401

Hi! Thank you very much, this has worked so far with the articles. Im Happy. But I have problems to find the right css element in the “article thumbs slider”. At the top of the page. Does it work differently here? Greetings, Peter

0
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 9 months ago #182541

Here is element class for thumb slider, Use same method that mentions in previous response:

Example:

.sppb-addon-articles-thumb-slider .articles-slider .swiper-slide:before{'
    content: unset;
}

Thanks

0
P
Peter
Accepted Answer
9 months ago #182746

Hi, thank you very much. I just can't find the element. Maybe we can give it another try. Here are access data to the website. maybe you can look there, maybe something is different here.

Thanks in advance!

Peter

0
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 9 months ago #182830

Hello,

Here is the selector for remove dark shiled from Slideshow background image:

.sppb-addon-articles-thumb-slider .articles-slider .swiper-slide:before{
    content: unset;
}

Thanks,

0
P
Peter
Accepted Answer
9 months ago #182868

Thank you very much for your help. My concerns have been clarified.

0
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 9 months ago #182875

You are welcome.

Please accept the answer to your question so it will be marked as complete.

Thanks,

0