I need to remove top bars from selective pages to make it look more like a web page enter image description here

i prefer it to be done in css using script editor.

1 Answer 1


Add css in your script editor:

#suiteBarTop {display:none;} 

if you want to hide section which contains 'BROWSE' and 'PAGE' then use below css in your script editor:

.ms-cui-topBar2 {display:none;}
  • Thanks Rashi, a quick one . once the above is disabled how do i edit and save the page
    – Rinu
    Dec 5, 2016 at 9:29
  • In that case you need to add JavaScript code in you master page and add below code to check your required pages (on which you want to add that css.) and if you want to perform some changes on that page, you just need to comment the code for that page only and after make changes you can again save the page and uncomment the code. $(document).ready(function () { if(window.location.href.indexOf("page1") > -1) { #suiteBarTop {display:none;} .ms-cui-topBar2 {display:none;} } if(window.location.href.indexOf("page2") > -1) { // css code } }); Dec 5, 2016 at 9:39
  • Note that (for the moment) in SPOnline Modern Experiences Microsoft does not allow any branding or script Dec 5, 2016 at 10:18
  • Sharepoint online is down right now for maintenance so i can really test this. I will update you once i test the above. i am sorry to bother you again where do i add the javascript in sharepoint page. I mean under which tag
    – Rinu
    Dec 5, 2016 at 11:25

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.