Forum Discussion

vish3027's avatar
vish3027
Copper Contributor
Aug 01, 2020

Shading in news web part

Hello All,

 

I am facing issue with News webpart

I am using news web part in carousel mode and seeing shading on all images in news webpart

Please see

 

I want to get rid of grey shading on urgent basis please help

 

SharePoint Online

6 Replies

  • afrangopoulosmacro's avatar
    afrangopoulosmacro
    Copper Contributor
    Oct 04, 2023

    Hello Everyone. Here's steps we performed to remove the gray shading in all Carousel images.

    First, follow the guide to allow custom scripts from running on your SharePoint site of choice:
    https://www.sharepointdiary.com/2017/12/how-to-enable-custom-script-in-sharepoint-online.html

    The Cmdlet within SPO-Module is:
    Set-SPOSite $SiteURL -DenyAddAndCustomizePages $False

    Then follow this guide to install the CSS Injection App to your tenant and site:
    https://www.sharepointdiary.com/2020/11/add-custom-css-to-sharepoint-online-modern-page.html

    Once you've fully added the CSS Injector web-part, add it anywhere within the page that your Carousel is also on. The CSS Injector is *not* visible when viewing the published page, only in editing mode.

     

     


    Once the webpart is added, add the following CSS code snippet. It will hide all shading in the carousel.

     

    <style>
.bp_b_91bed31b{display:none}
.ax_a_91bed31b{display:none}
</style>

     


    The result is branded images exactly as they should be!

  • Leland Usher's avatar
    Leland Usher
    Brass Contributor
    Apr 20, 2023
    Hello, did you find any solution to this issue? I would very much like to remove the gray shading as well. Thank you.
  • RobElliott's avatar
    RobElliott
    Silver Contributor
    Aug 01, 2020

    vish3027 in the carousel layout of the news web part there is no way to remove the shading as it uses the same gradient as the Image and Title layout on a news or site page - and you can't change that either other than to a different layout.

     

    Rob
    Los Gallardos
    Microsoft Power Automate Community Super User

    • vish3027's avatar
      vish3027
      Copper Contributor
      Aug 07, 2020

      RobElliott 

      Is there any alternate way to create carousel news web part without grey shade.

       

      Any customize solution will also helpful.

       

      Please help.

      • ganeshsanap's avatar
        ganeshsanap
        MVP
        Apr 21, 2023

        vish3027 If you need custom solution for news carousel, you will have to develop it using SPFx.

         

        Check below SPFx sample which will help you to get started with:

        1. News 
        2. Images and Videos in a Carousel 

        You will have to combine logic given in above two web parts in single SPFx web part for news pages.

        Please click Mark as Best Response & Like if my post helped you to solve your issue. This will help others to find the correct solution easily. It also closes the item. If the post was useful in other ways, please consider giving it Like.

        For SharePoint/Power Platform blogs, visit: Ganesh Sanap Blogs

Resources