Adding images to the sharepoint 2010 hive

I’ve had this question a few times, so I thought I’d post a super-quick blog entry on it. The question is: how do I get images into SharePoint and then leverage them in my Visual Web Part that I’m building in VS 2010?

The answer is twofold:

1. Put them somewhere; and

2. Insert them using the Image properties.

To get images into the hive, you can add them in a numerous places. One such place is the Images folder. As you can see from the screenshot below, the directory path to the folder is: C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\IMAGES. Note that you could also add the image as a resource to your VS project or create a custom directory for the image(s).

image

Once you’ve added the image into this directory, you can then open your VS project and drag and drop the image onto the designer surface of the Visual Web Part. I used my previous post as the web part I updated with an image and using the Properties of the web part, selected the ImageURL and then navigated to where I had the image stored. I then selected it and clicked OK.

image

You can then deploy the updated web part and voila there is the image. You should note that the reference to the image gets translated when you build the project to: ~/_layouts/images/twitter_logo_header.jpg.

image 

Steve

Technorati Tags: