Forum Discussion
AndrewWarland
Jan 02, 2019Steel Contributor
SharePoint modern pages - removing the shading from banner images
We have distinct branding requirements and found that banner images are shading out our colors. The two images below are not ours, but show what happens to ANY image used as a banner. Is there a...
- Jan 02, 2019
We noticed the same thing and came up with a work-around that might help you. We sized the image to work as a banner and then added it to a full width image web part on the top of the page. No shading and same outcome!
Susan_Hanley
Jan 02, 2019MVP
We noticed the same thing and came up with a work-around that might help you. We sized the image to work as a banner and then added it to a full width image web part on the top of the page. No shading and same outcome!
- Leland UsherApr 21, 2023Brass Contributor
Susan_Hanley Please see the attached image. Can you think of any way to remove this dreadful gradient from our news carousel as placed on our homepage? Thanks
- SusanHanleyApr 21, 2023MVPUnfortunately, there is no way to do that in this context without something custom. If you want my snarky answer, it would be to not use a carousel for important news in the first place! Carousels do not test very well for usability and are generally not recommended from an accessibility perspective. You may want to consider a web part view for news that shows users all the content without having to wait or work for them to appear. I understand not wanting the gradient, but I guess I am asking whether you may want to do some re-thinking first. It’s not that I don’t use them ever, but you may want to look at https://shouldiuseacarousel.com/ for a fun way to learn more.
- Leland UsherApr 21, 2023Brass ContributorThanks and I can appreciate your perspective, our Comms team has chosen this route with a limit of 4 articles at a time. I should one day run an analysis on click throughs to our articles but in the meantime, our company heavily utilizes this vehicle for important information for our employees and most of our employees want to read important information.
- harriscontractorJan 21, 2021Copper ContributorWe have the same problem. I'm convinced its the Call to Action. I removed the Call to Action and we retained our beautiful image. However I'm not able to correct this on the News web part for the Carousel layout. Still searching for a resolution or work around for that. Thanks for sharing.
- FaithbMay 30, 2019Copper Contributor
HelloSusan_Hanley
I've been designing my companies' SharePoint pages and that dreaded shadow is the worst! I tried your method and it looks great. Does yours still have a bit of a white area where the regular banner would be? (Above my teal color banner)
- Judy PriceJan 07, 2019Copper ContributorI’ve been trying to get rid of that gray box over my banner image all day!!
Susan, what was the banner size you used in the image web part? Did you also check that the image banner web part renders correctly across all devices/browsers as to responsive page design?
Thanks- Susan_HanleyJan 07, 2019MVP
The image we used was 1536 x 238 and yes, it works on mobile. I tested it on both Chrome and IE.
- Philip WorrellJan 07, 2019Steel Contributor
quick question.
Is there anywhere that Microsoft have published any image guidelines for suggested sizes and resolutions for different web parts?
I have not seen any out there.
- AndrewWarlandJan 02, 2019Steel Contributor
Thanks Susan, some of our business areas have done just that as the shading 'ruined' the clean sharp graphic in the banner.