How to apply SPSecurityTrimmedControl on HTML Master page?

Question

On a SP2016 on-premise farm, I am editing a HTML Master page. I want to hide the gear icon from everyone beside the site admin. In my previous experience in older version, I can modify the Master page, wrap the gear icon part with something like "<SharePoint:SPSecurityTrimmedControl runat=”server” Permissions=”ManageSubWebs”>".

However in the HTML Master page I cannot find anything like SharePoint:MenuItemTemplate. In the paired Master page, I also cannot find it. I can find SharePoint:MenuItemTemplate in seattle.master. I cannot find it in seattle.html. When I try to modify any master page, SharePoint prompt "This file may not be moved, deleted, renamed, or otherwise edited."

What is the best practice to achieve my goal?

Answer 1

I am afraid, top suite bar cannot be controlled from master page. It is being rendered directly from content database. If you want to hide settings gear icon for non- SharePoint admins users you have to do it via custom javascript code.

You need to add javascript code on document.ready

What we would do is use default page context info attribute isSiteAdmin to check if user is side admin or not, if not use jquery to hide that particular gear icon.

// A $( document ).ready() block.
$( document ).ready(function() {
   if(!_spPageContextInfo.isSiteAdmin){
        $("#O365_MainLink_Settings").hide()
  }
});

Answer 2

You'd need to create copy of the seattle.master and modify and use that as master page. SharePoint doesn't allow modifying the seattle.master as it generates it from the seattle.html.