93

I have a new asp.net mvc project and i am trying to figure out the best place to store images and also how i would reference them from site.master (in cases where i have a header images that i want to show up on all pages).

Suggestions or best practices?

Pablo Fernandez
  • 279,434
  • 135
  • 377
  • 622
leora
  • 188,729
  • 360
  • 878
  • 1,366

5 Answers5

119

What I generally do is create an "Images" folder inside my Content folder. Where you place your images is really up to you, as long as you are consistent.

Referencing these images from your Site.Master is the same as if you referenced it from any view:

<img src="/Content/Images/mylogo.png" />

alt text

KingNestor
  • 65,976
  • 51
  • 121
  • 152
A Salcedo
  • 6,378
  • 8
  • 31
  • 42
  • i am trying to put the image link in the site.master file so it shows up on every page. – leora Jun 30 '09 at 17:02
  • Then all you have to do is create a div and put your image as a backround for that div which will only be in your site.master. Hence displaying it in every page. If you do not know how to link your css then that's what you should have asked. – A Salcedo Jun 30 '09 at 17:05
  • You are asking for best practices, well in reality it is up to the person. But I have found the hard way to place stuff like that on the page itself, when if I want it done in a more general way the best place I have found is the Css. – A Salcedo Jun 30 '09 at 17:07
  • For those that downvoted this, I'd like to know what's a better solution that Content/Images. Regarding showing the image in all pages, what about just putting an img on site.master? – Pablo Fernandez Jun 30 '09 at 17:10
  • 4
    Content/Images is fine, but the way you reference the images is not. It only works with the development web server and on the root web application in IIS. If you run a web application in a virtual directory, the images are never found – chris166 Jul 01 '09 at 16:46
  • 2
    As @chris166 said, please don't use absolute links. In MVC 5 you can use the `~` prefix, like this : ``. See here : http://www.pseale.com/blog/2013/09/26/ImageLinksInMVCAreMagicalMostly.aspx – JYL Aug 21 '14 at 19:51
  • Is this best place for uploaded images by programming also? – ManirajSS Sep 26 '14 at 11:01
  • What if you are selling off the shelf product and cannot hard code the app path such as `Content` ? Because the app may be installed under a subfolder, such as `://host/apps/Content` – nothingisnecessary Aug 04 '16 at 19:54
26
<img src="@Url.Content("~/Content/Images/logo.png")" />

Using this in a Razor view on MVC 5. Images are stored in /Content/Images.

zacharydl
  • 4,278
  • 1
  • 29
  • 23
8
<%=Html.Image("~/Content/Images/xxx.png")%>

This resolves from wherever you are in the site hierarchy. Html.Image is a part of the the Microsoft.Web.Mvc futures assembly.

mxmissile
  • 11,464
  • 3
  • 53
  • 79
2

or in mvc2: 

<img src="<%: Url.Content("~/Images2/landingMain/safety.png") %>" alt="safety" />
Luca Geretti
  • 10,206
  • 7
  • 48
  • 58
Fryderyq
  • 317
  • 2
  • 10
1

U must put all your images in Content Folder like :- Content-->Images-->.IMG files and same as style sheet files Content Folder like Content-->.css hence it easily load the images and css otherwise it is not executed in proper manner.

vijay chauhan
  • 11
  • 1