unable to write a script to change the logo redirect url

Question

I am working on a web application which contain 2 site collections , with the following URLs:-

• http//servername

• http://servername/HR

and the second site collection have two subsites , with the following url:-

• http://servername/HR/Staff

• http://servername/HR/manager

now all of the above 4 sites (2 site collections + 2 subsites) have a site logo. now the default behavior is that clicking on the logo will redirect to the home page of the current site, either a site collection or sub site.

so i need to force the logo image to allow redirect to the root site collection , so i wrote the following script :-

$(document).ready(function () {


    $("a.ms-siteicon-a").attr("href", "/");
    $("a.ms-siteicon-a").attr("onclick", "");
});

and i reference it inside all the sites master pages. but i got this behavior;-

1. on IE the above script will work on the site collection. so if i am inside the HR site collection and i click on the logo i will redirect to the root http://servername/ instead of http://servername/HR/ which is correct. while on firefox the logo for the HR will keep redirecting to http://servername/HR

2. on both IE & Firefox, if i am inside a sub site such as http://servername/HR/staff the logo will keep redirecting to the subsite home page instead of the root as mentioned on the script.

so can anyone adivce how to force the logo on all the sites to always redirect to the root ?

Thanks

Answer 1

Instead of JavaScript we can make respective changes in master page. Assuming you are on SharePoint 2013 on-premise. If you notice in the seattle.master file, you can find a div with ID siteIcon which is responsible for redirection. Refer below.

<div id="siteIcon" class="ms-tableCell ms-verticalAlignTop">
    <SharePoint:AjaxDelta id="DeltaSiteLogo" BlockElement="true" runat="server">
        <SharePoint:SPSimpleSiteLink CssClass="ms-siteicon-a" runat="server" id="onetidProjectPropertyTitleGraphic" >
            <SharePoint:SiteLogoImage CssClass="ms-siteicon-img" name="onetidHeadbnnr0" id="onetidHeadbnnr2" LogoImageUrl="/_layouts/15/images/siteIcon.png?rev=23" runat="server"/>
        </SharePoint:SPSimpleSiteLink>
    </SharePoint:AjaxDelta>
</div>

Now to customize the redirection, firstly I have my own custom master page, where I have replaced the above AjaxDelta control to SPLinkButton which allows me to specify the Navigate Url.

NavigateUrl="~sitecollection/"

The above attribute value will redirect to root. Refer below full div structure.

<div id="siteIcon" class="ms-tableCell ms-verticalAlignTop">
    <SharePoint:SPLinkButton runat="server" NavigateUrl="~sitecollection/" id="onetidProjectPropertyTitleGraphic">
        <SharePoint:SiteLogoImage name="onetidHeadbnnr0" id="onetidHeadbnnr2" LogoImageUrl="/Style%20Library/Images/Logo.png" ToolTip="Home" AlternateText="Logo" runat="server"/>
    </SharePoint:SPLinkButton>
</div>

Answer 2

Assuming that your RootSite is located at the Servers Root, you could simply Change your masterpage where your SiteLogoImage is situated to:

<a class="ms-siteicon-a" href="/">
      <SharePoint:SiteLogoImage CssClass="ms-siteicon-img" name="onetidHeadbnnr0" ID="onetidHeadbnnr2" LogoImageUrl="images/Logo_t.png" runat="server" />
</a>

So you won´t Need the JavaScript anymore