SharePoint Stack Exchange is a question and answer site for SharePoint enthusiasts. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I am using a logo in my Master Page which will be displayed on all pages. How do I use its relative URL? Currently it is written as:

<img src="/sites/Style Library/Images/logo.jpg">

But it is not being displayed. Is there a property in SharePoint which will allow me to define relative URL here for e.g. like this?

<img src="<% sharepoint_site_url %>/sites/Style Library/Images/logo.jpg">
share|improve this question
up vote 5 down vote accepted

There are 2 ways you can insert an image in a SharePoint master page. Both of them are relative url.

14 Hive (Physically hosted): You can place your images physically in the 14 hive folder under C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\IMAGES

Place a image here (logo.png) and you can access this image in your masterpage like this

<SharePoint:SiteLogoImage LogoImageUrl="/_layouts/images/logo.png" runat="server"/>

Site Collection (Library hosted) Upload the logo.png file in any document library on your site collection. If your library name is "Images" here is how you can access the image.

<img src="../../Images/logo.png" />

Both the approaches are fine depending on your portability requirement of the site.

share|improve this answer
Don't want to use "_layouts" folder although I will use it as last resort if nothing works. I tried the second approach and it worked but I am not sure if it will work for all my site pages. – Frank Martin Apr 6 '13 at 2:23

I think your URL is wrong. It should be just

<img src="/Style Library/Images/logo.jpg" />

If you want to have it accessible from another sitecollection I suggest you deploy the image to the "/_layouts/images" folder instead. Thereby you can alwas reach it by just using the relative URL:

<img src="/_layouts/images/logo.jpg" />
share|improve this answer
I tried the first URL you gave above but it didn't work. Problem is this is a multi language site which means my page which is accessing the image could be like "webapp/sites/mysite/English/Pages/default.aspx";. Don't want to use "_layouts" folder although I will use it as last resort if nothing works. – Frank Martin Apr 6 '13 at 2:22
Why don't you want to use the layouts folder? Since it is a Mapped Folder it will always have the same URL relative to the site you are on. If you want to upload your image to a library you will most certainly need to upload it to all of your site collections, and also perform lots of testing on nested subwebs to really test the functionality – Robert Lindgren Apr 8 '13 at 6:13
Also, If your web is using publishing, you could get hold of the PublishingWeb and from that object get .ImageLibrary, and get the URL from that. This will help you overcome problems with different languages (though it is harder to implement) – Robert Lindgren Apr 8 '13 at 6:16
Using a relative url for the image in the _layouts directory as you have will work, but it means that the client is downloading and caching a separate copy of the image for every site that they navigate to. If you use /_layouts/images/logo.jpg, the client will only need to download it a single time (as long as it lasts in the client's cache.) – Hutch Mar 3 '14 at 21:30

Sharepoint has tokens you can use which will be replaced at runtime

~site – Web site (SPWeb) relative link.

~sitecollection – site collection (SPSite) relative link.

Agree with Robert that you would probably want to deploy it to the layouts folder. The url you have given points to a specific library, unless you're planning to deploy the logo to each site collection's style library.

share|improve this answer
This is wrong. An asp:image control (and even more so an html img tag) won't resolve any of the special ~ SharePoint tokens. So, neither ~site nor ~sitecollection will work. – MdMazzotti Jan 26 '14 at 11:51
Tokens are only valid when used with $SPUrl:..... – GoldBishop Apr 11 '14 at 13:55

SharePoint Server, not Foundation, offers a feature to use $SPUrl as a placeholder. So your url would look like this:

<img src="<% $SPUrl:~sitecollection/sites/Style Library/Images/logo.jpg %>">

Here's some more info:

share|improve this answer
I used this method but it says "Code blocks are not allowed in this file" – Frank Martin Apr 6 '13 at 2:18
Honestly, I have no idea why it fails on your side. Did you try the example included in the link I mentioned? Anyways, it looks like you already accepted another answer so I guess your issue is resolved. – Sig Weber Apr 8 '13 at 11:49
sorry to revive an old thread, but @FrankMartin is right. In SharePoint designer, by default code blocks are not allowed, so the answer proposed by Sig Weber is wrong – MdMazzotti Jan 26 '14 at 11:53
This approach only works in the .master file only. – Zac Blazic Oct 14 '15 at 8:37

You can do this :

<img src="<asp:literal runat='server' Text='<%$SPUrl:~sitecollection/Style Library/Images/logo.jpg%>'></asp:literal>" />
share|improve this answer
This woks well. :) – Dikesh Gandhi Jul 7 at 6:16

This works as well, a combination of the SiteLogoImage control and the SPUrl token:

<SharePoint:SiteLogoImage LogoImageUrl="<% $SPUrl:~sitecollection/SiteCollectionImages/logo.png %>" runat="server" />
share|improve this answer
This would be the most readable, of all the solutions provided. – GoldBishop Apr 11 '14 at 13:55

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

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