Hiding SuiteBar while printing in Sharepoint 2013 RRS feed

  • Question

  • Hi Everyone,

    We have recently upgraded to SharePoint 2013 from SharePoint 2007. I'm trying to remove the Suite Bar from print versions of the pages. Per my research, this can be handled by adding custom CSS and handling the media attribute. Here's the CSS:

    @media print
    #suiteBar {
    : none;

    I've made copies of seattle.html (seattle_copy(1).html) file but no .master files were generated, so, I manually created .master copies, too. I'm not sure if they are talking to each other. As it's not advisable to edit .master file, where do I put the CSS code in .html file? It refers to div#suiteBar which I can't find in .html file.  Adding the CSS anyhow has no effect.

    Now I'm totally stuck. Please suggest some solution.

    Thanks & Regards,

    Midhat Un Nisa

    Wednesday, October 22, 2014 10:18 AM

All replies

  • Hi,

    No need to create .master file manually in SharePoint 2013, your .html gets converted to .master automatically. Just go to Design Manager from SharePoint site and publish your HTML page.

    Answering to your main question, yes you need to put all css rules in .html file only or any external css reffered in .html file

    Hope this will help you.



    Thanks.... ________________ Baba (MCTS, MCPD)

    Wednesday, October 22, 2014 10:24 AM
  • Thanks Baba!

    Seems like publishing generated the .master file. Now the issues is there was a <div> with "id=suiteBar" in seattle.master but not in seattle.html. I still put in the CSS quoted above in the copied .html file and generated the seattle_copy(1).master, but the same <div id=suiteBar> is missing.

    I just want want to be sure I'm targeting the correct page element. If yes, how do I handle it now?


    Wednesday, October 22, 2014 11:50 AM