Web Part icons in SharePoint

Web Part icons in SharePoint
3 votes, 3.67 avg. rating (77% score)

Introduction

In this post we will see one of the ways to enhance look and feel of the Web Parts with which Web Parts will be more identifiable. It also make Web Parts more professional.
Using icon is one of the good feature to enhance web part look and feel.

Icons

The two default properties to specify icons for Web Part are

  • TitleIconImageUrl
  • CatalogIconImageUrl
TitleIconImageUrl

This can be used to show an icon in the Web Part’s title bar. The icon will be displayed to the left of the Title

CatalogIconImageUrl

This will be used in the Web Part gallery to identify the Web Part.

The icon should be 16×16 pixel image of png, gif or jpeg format.

We can set these default properties either in the code or directly modify the xml. Following is the xml that shows the properties of icon

 <properties>
        <property name="Title" type="string">VisualWebPart1</property>
        <property name="TitleIconImageUrl" type="string">/_layouts/images/Adicodes/AdicodesIcon.png</property>
        <property name="CatalogIconImageUrl" type="string">/_layouts/images/Adicodes/AdicodesIcon.png</property>
 </properties>

 

Before setting the icon url the Web Part will look like

image

 

After setting the icon url the Web Part will look like

 

image

 

The Web Part in the gallery also will be more professional and easy to identify

image

 

Conclusion

With simple icon url properties and without any custom code, we can make look and feel of Web Part better.

May 13, 2012 В· Adi В· No Comments
Tags: , , ,  В· Posted in: Sharepoint 2010

Leave a Reply

What is 13 + 9 ?
Please leave these two fields as-is:
IMPORTANT! To be able to proceed, you need to solve the following simple math (so we know that you are a human) :-)