Forum Discussion

john john's avatar
john john
Steel Contributor
Mar 10, 2021

Add a custom css + custom JavaScript to our home page using SPFX

I have the following CSS:-

<style>

#SuiteNavWrapper,#pageHeader, #spSiteHeader,#spLeftNav,#WebPart.PageTitle.internal.cbe7b0a9-3504-44dd-a3a3-0e5cacd07788
{
display:none;

}

div[data-automation-id="pageHeader"]
{
display:none;

}


#SuiteNavWrapper
{display:none !important ;}

.a_b_50a7110f:not(.b_b_50a7110f) {

    margin: 2px 0;
}


div[data-automation-id="CanvasZone"] > div:first-child
{max-width:100% !important;}

#customchart
{
    
    transform= "rotate(90deg)"; 
    display="inline-block";  
    
}

.root-95 {
height:10px;}
</style>

I have the following Javascript&colon;-

<script>setInterval(function() {
                  window.location.reload(true);
                }, 300000); 
                
                

</script>

and I want to run it inside our modern SharePoint team site's home page ONLY (not inside all the modern pages) >> now i read that i can create an SPFX to do so,, but i did not find a documentation which describe this? can anyone advice on this please? how i can add custom CSS & JavaScript to a home page of a modern team site using SPFX??

Thanks

No RepliesBe the first to reply

Resources