Remove the toolbar from a NewForm.aspx list form in SharePoint 2013/2016/On-Line

In a recent project, the customer requested that the NewForm,aspx associated with a particular list needed the toolbar removed to simplify the user experence and interface. After researching this, the quickiest and easiet way to do this for one particular list was to amend the form page using SharePoint Designer and adding some simple CSS to the file. Follow the steps below to hide the toolbar;

  1. Open up SharePoint Designer 2013 and Open up the site where the list lives then click on the list under Lists and Libraries navigation item that has the associated form that needs the toolbar removing from.
  2. Right click on the NewForm.aspx in the Forms region and select Edit file in Advanced Mode
  3. In the code locate the tag <asp:Content ContentPlaceHolderId=”PlaceHolderAdditionalPageHead” runat=”server”> which is located near the bottom of the code.
  4. Add the following CSS to the end of this tag
    <style type="text/css">
        #s4-ribbonrow {display: none !important;}

    So it looks like;

    <asp:Content ContentPlaceHolderId=”PlaceHolderAdditionalPageHead” runat=”server”> <SharePoint:DelegateControl runat=”server” ControlId=”FormCustomRedirectControl” AllowMultipleControls=”true”/> <SharePoint:UIVersionedContent UIVersion=”4″ runat=”server”><ContentTemplate> <SharePoint:CssRegistration Name=”forms.css” runat=”server”/> </ContentTemplate></SharePoint:UIVersionedContent> <style type=”text/css”> #s4-ribbonrow {display: none !important;} </style> </asp:Content>

  5. Save the file and click ‘Yes’ when the Save Definition Page Warning message appears
  6. Job done!

About the author