I am trying to edit the SharePoint 2016 suitebar links and want to replace "sites" with a custom name and link. I have been able to edit the name via CSS but need to edit the link using JavaScript as I don't believe there is another way. When I launch the page, my function is always hit but the link doesn't always change. It takes a refresh before the Jquery works successfully.

I have tried using document.ready and I've tried delaying by using a timeout but those have not worked.

Here is my simple code:

$(window).load(function nav() {
   var $link = $(".o365cs-nav-appTitle");
   $link.attr('href', 'site URL');

A solution that works for sure, but which I don't like, is to hijack the render function of the suite bar. See below.

Ideally, there should be a callback function provided by SharePoint that allows us to run JS code after the suite bar has finished rendering, but there is none of that AFAIK.

SP.SOD.executeFunc('suitenav.js', '_o365sg2c.O365Shell._renderInternal$p', function () {
  var oldRenderInternal = _o365sg2c.O365Shell._renderInternal$p;

  window._o365sg2c.O365Shell._renderInternal$p = function (c, b, a) {
    oldRenderInternal(c, b, a);

    var brandBar = document.getElementById('Sites_BrandBar');
    if (brandBar) {
      brandBar.setAttribute('href', 'site URL');

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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