Showing Icons in a List View

Applies To: SharePoint 2010

Displaying icons in a list view is a great way to make things immediately more understandable, look awesome and make things oh so pretty. It’s a pretty common request and there are some interesting methods out there to get it done. There’s everything from deployed solutions to give you specialized columns to throwing some magical jQuery on the page. I personally prefer to keep things simple with some quick use of conditional formatting in SharePoint Designer.

Technically this solution uses some XSL which I’ll show you at the end, but you don’t need to know anything about that to get it to work. A good example of a list this works really well for is a Task list. I most often show icons based on Choice columns (since there’s a nice one-to-one mapping between icon and choice value), but you can easily adapt this solution to apply icons based off of other calculations or combination of columns (for instance, showing a frowny face when a due date has been missed and the status is not completed).

Here’s the standard Tasks list that we’re going to iconize:


Right away you’ll notice there’s at least 2 easy targets for icons. Both the Status and the Priority columns would really get a big upgrade if turned into icons.

You can put your icons wherever you want, but the easiest place is going to be a picture library right on the site. So create a new picture library called Icons (Site Actions > More Options > Library > Picture Library):


Head to the Icons library you just added and upload some icons. We’re going to upload 5 status icons and 3 priority icons. They should all be the same size (16×16 works well, but I’ll leave that up to you). There’s plenty of great icon sets out there (famfamfam and all it’s varients work very well). I’ll be using icons from the Fugue Icons collection since they look nice, there’s tons of them and they’re free:

Status Icons Priority Icons
  • StatusNotStarted  StatusNotStarted.png
  • StatusInProgress  StatusInProgress.png
  • StatusDeferred  StatusDeferred.png
  • StatusWaiting  StatusWaiting.png
  • StatusCompleted  StatusCompleted.png
  • PriorityLow  PriorityLow.png
  • PriorityNormal  PriorityNormal.png
  • PriorityHigh  PriorityHigh.png

Now that the icons are uploaded, it’ll be easy to select them in Designer (You can also have designer upload them directly from your computer while you’re working but there is a bug that sometimes keeps the path relative to your machine rather than the picture library).

Open the site in SharePoint Designer (Site Actions > Edit in SharePoint Designer) and browse to the page/view you want to edit, or if this is a specific view just choose the Modify View dropdown and select Modify in SharePoint Designer (Advanced):


The basic steps we are going to perform 8 times (one for each image):

  1. In Design view click in one of the cells for the column we are iconizing (Status or Priority)
  2. On the Insert tab in the ribbon, choose Picture:

  3. Choose the Icons library (double-click), and pick the appropriate icon image:
  4. Fill out the Accessibility Properties dialog with the appropriate information:
  5. With the new icon selected, type the value in the title field of the Tag Properties window (This will be the tooltip):TitleProperty
  6. With the new image still selected, choose Hide Content in the Conditional Formatting dropdown in the Options tab on the ribbon:
  7. In the Condition Criteria dialog, select the Field Name as the column, the Comparison as Not Equal and the Value to the value the icon should represent. This basically says when the value of this field isn’t the value this icon is meant for, then don’t show this icon:
  8. Repeat for all remaining icons

Once you save in SharePoint Designer you should see something like this on the page (after a refresh of course):


That’s it, so super pretty! I’d recommend taking the actual text values away (you’ve got them in the tooltip) or at least adding some spacing.

For those that are interested, what designer’s really doing is generating some XSL templates for you. It’s the equivalent of choosing Customize Item in the Customize XSLT dropdown on the Design tab and adding some extra XSL. The XSL we’re talking about is a simple <xsl:if> element with the <img> tag inside. For instance the Completed Status icon looks like this in XSL:

<xsl:if test="not(normalize-space($thisNode/@Status) != 'Completed')"
  	<img alt="Complete" longdesc="Complete"
  	  src="../../Icons/StatusCompleted.png" width="16" height="16"
  	  title="Complete" />

XSL isn’t nearly as scary as it seems, but Designer does a pretty good job of wrapping up a lot of basic formatting and conditional checks with some nice wizards – so why not use them?

Hiding the List Item Selection Boxes

Applies to: SharePoint 2010

In SharePoint 2010 the standard listviewwebpart adds a checkbox to the left of each row. These only show up on hover and when you check the box the entire row is highlighted. You can check multiple boxes (or even use the helpful checkbox up top to select/unselect them all at once). This allows you to perform the same action on the selected item(s) using the ribbon.

SelectionBox MultiSelection

Generally, this is a good feature. However, not everybody agrees. If you’re doing some customization and you don’t want them to show up, you can do it through CSS. Although this is the technique I previously used, I ran across a post by Glyn Clough that made me face palm. I’ll leave the CSS technique in case it helps somebody and since I can think of at least one or two reasons you might want it (simple removal of all select boxes across an entire site or keeping the selection logic without the boxes) but if you want the simple answer just skip right to that solution.


If you’re deploying a branding solution or already using a custom style sheet just add the following:

.s4-itm-hover .s4-itm-cbx,
.ms-itmhover:hover .s4-itm-cbx,
.s4-itm-selected .s4-itm-cbx,
.ms-inlineEditLink .s4-itm-inlineedit,
.ms-itmhover:hover .s4-itm-inlineedit,
.s4-itm-hover .s4-itm-inlineedit,
.s4-itm-selected .s4-itm-inlineedit
    position: relative;
    top: 0;

Bam! no more selection boxes! However, I’ve got no clue why you would want to hide those for an entire site. More likely you want to hide these from a specific list view or page. To do this you can slap a content editor web part on the page(Edit Page, Add a Web Part, Media and Content > Content Editor) and click inside it. Then choose the HTML drop down and pick Edit HTML Source:


Then paste this inside there:

.s4-itm-hover .s4-itm-cbx,
.ms-itmhover:hover .s4-itm-cbx,
.s4-itm-selected .s4-itm-cbx,
.ms-inlineEditLink .s4-itm-inlineedit,
.ms-itmhover:hover .s4-itm-inlineedit,
.s4-itm-hover .s4-itm-inlineedit,
.s4-itm-selected .s4-itm-inlineedit {
    position: relative;
    top: 0;

Save the page and you should see that all the list views on the page no longer have the selection box (although you can still click on the item(s) and get selection and multiselection):

NoSelectionBox MultiSelectionNoBox

So what about that Select All box up there? Why you want to break all the interfaces!?!

Unfortunately this isn’t as straight-forward. Microsoft did provide a convenient class for the checkbox: s4-selectAllCbx. However, until you hover over the web part, that class is not applied to the input control – Very strange. So applying some styles to that class will only take effect after someone has hovered over the part.

If you really want to do this with CSS you can add an additional selector to the above styles to get this (the key is that last selector .ms-vh-icon input):

.s4-itm-hover .s4-itm-cbx,
.ms-itmhover:hover .s4-itm-cbx,
.s4-itm-selected .s4-itm-cbx,
.ms-inlineEditLink .s4-itm-inlineedit,
.ms-itmhover:hover .s4-itm-inlineedit,
.s4-itm-hover .s4-itm-inlineedit,
.s4-itm-selected .s4-itm-inlineedit,
.ms-vh-icon input {
    position: relative;
    top: 0;

This hides them all but doesn’t shrink the column. There’s probably a CSS way to do that too, but honestly let’s just use the setting below.

The Real Solution

So everything above has been overkill. I remember looking for a simple setting to turn those boxes off and not finding it. I can’t be the only one since you’re reading this article – but it doesn’t get much easier than this.

Just edit the view (either the view used by the web part or an actual view on the list) and scroll down to the Tabular View section and uncheck the box next to Allow individual item checkboxes:


Click OK and now those checkboxes are removed! Unfortunately so is all selection and multi-selection. So if you have some strange need to keep the selection but remove the boxes, see the CSS solution above. If you just wanted to remove them altogether, remember to always look at the settings!

If you take a look at the XML generated for the view you’ll see that all this is doing is adding a TabularView attribute to your View element and setting it to FALSE.

Printing the Display View of an InfoPath List Item Form

Applies To: SharePoint 2010

I’ve written previously about a cool feature in SharePoint 2010 Server Enterprise that allows you to customize list item forms using InfoPath. It’s really simple to do and you can get some pretty cool results in just a couple of minutes. For instance, I posted a while back about how to use SharePoint column validation to validate email addresses and phone numbers. Those are still good techniques, but by using an InfoPath list item form it’s just a validation drop down (you can even do regular expressions) and you’re done!

So the ease of validation, conditional hiding of fields, etc. are all pretty useful. However, the thing I like it most for is the ability to use different InfoPath views to match the list item views. So you can have different columns available when you’re editing than when you’re adding a new item, for instance. I especially like to spruce up the Display form.

(For some quick tips on how to get the different views working check out the top of my old post)

So, let’s say you’ve got a nice looking display form. Users open that thing up and decide to print. There’s no button, so they use the print button in the browser. Generally they’ll end up with some mess that prints all of your branding, usually some of the list behind the modal dialog, and if you’re lucky mixed in there somewhere will be your display form. Obviously, that’s not going to cut it.

So I did some digging and found some examples of people using javascript to print the form and their solutions were pretty intriguing. But I didn’t particularly want to have to apply some javascript to every form or to have to add a content editor to the pages, etc. I wanted something that just worked on existing forms and new ones too. So I did a little research into Ribbon customization and came across this great series by Chris O’Brien.

I put it all together in a solution and put it over on CodePlex as WireBear InfoPath Printer. There’s some stuff about it’s license over there (Free for personal and commercial use, etc.) and the basic installation instructions. It’s super easy to setup since it’s just a standard SharePoint Solution that you globally deploy.

You can find the full source code over on CodePlex. It’s not too complex and I’ll probably explain most of it in the next couple of posts. Bottom line is that it adds a Print button to the Ribbon when viewing list items that use an InfoPath Form:

The final printout only shows the form (No Ribbon, No Header, No Footer, No QuickLaunch, etc.).

The button is added using Custom Action XML that is deployed as a feature in the solution. The XML is targeted to allow the button to only be present when Viewing a List Item using an InfoPath Browser based List Form.

When you click the button, standard JavaScript is executed to find the InfoPath div element on the page and to copy the form’s HTML into a new window (along with all standard CSS/script references already present) and uses the browser’s page printing. Once the print dialog closes, so does the window.

We’ve been using it around here for a while and almost no one even knows it’s a custom solution. It looks like part of the UI and it’s use is immediately understood. So, go get it (It’s free!) and let me know what you think.

Links List with Favicons and Under the QuickLaunch

Applies To: SharePoint

SharePoint has a handy list called Links that makes putting together a list of links with a display name pretty simple. Since it’s a normal list you can use views or even XSLT to make it look nice wherever you display it on the page. By default, here’s what a small links list looks like using the Summary View:

It’s not too bad, especially for a simple team site. But with just a little extra work you can have that same list of links display with their favicons and you can move them to some relatively unused real estate – under the QuickLaunch, and on every page in your site.

I’m combining these techniques because that was what I did. Fortunately, you can use the bulk of my tips to get nearly any web part to show up below the QuickLaunch. You can also just use the Favicon information to make your link display snazzy. Also, although I’m demonstrating all of this in SharePoint 2010, you should be able to do everything in SharePoint 2007 as well.

Displaying a Web Part Beneath the QuickLaunch

In order to place a Web Part below the QuickLaunch, you’re going to have to edit the Master Page. There are a couple of options. You can add a Web Part Zone and then customize this area on a page by page basis, or you can do what I’m going to demonstrate: add a specific web part to every page on your site.

Open your site in SharePoint Designer (Site Actions -> Edit in SharePoint Designer). Choose Master Pages in the Navigation pane and right-click on v4.master and choose Copy then right-click and choose Paste. Right-click on the new Master Page, v4_copy(1).master, and choose Rename. Once you’ve renamed it, right-click on it and select Edit File in Advanced Mode:

Depending on your site’s settings, you might have to check it out. If so, make sure you check it back in when done and verify you’ve published a major version so that those without full control can see your changes.

We’re going to place our web part right below the quicklaunch. So scroll down to approximately line 594 (in Code view) where you should see two closing divs shortly below the PlaceHolderQuickLaunchBottomV4 UIVersionedContent control. If you want your web part to be included in the leftpanel then press enter after the closing div in line 592, if you want it placed below the box press enter after the closing div in line 594:

Type <br /> and press enter again. Press Save. You’ll get a warning about customizing the page, go ahead and click Yes.

Now switch to the Insert ribbon and select Web Part > Content Query:

Switch to the Design view and right-click on your new web part and choose Web Part Properties. In the dialog window expand the Query section. Choose Show items from the following list under Source and click Browse… and choose your Links list.

Expand the Presentation section. Set Sort items by to <None> (This is to ensure the custom ordering allowed by Links lists is used). Uncheck the Limit the number of items to display checkbox.

In the Fields to display section enter Url [Custom Columns]; for the Link and remove the Title entry:

Choose any other display options you want (I expanded Apperance and chose Chrome Type: None). Press OK to close the dialog. Save the master page. In the navigation pane on the left, right-click on your master page and choose Set as Default Master Page:

Now when you refresh your site you should see the changes (Be sure to publish a major version and/or check in the file if required to ensure everyone can see it):

Adding Favicons to the Links

The above screenshot is pretty cool. Unfortunately, instead of using the display text, it just uses the link. It also doesn’t open the links in a new window. We’ll fix these issues and add a favicon using some simple XSL.

I found the basic XSL to fix the Links display on Marc D Anderson’s blog who apparently got it from this Microsoft forum thread. We’re going to straight up copy that XSL and tweak it just a little to add our favicons. Here’s our customized XSL:

<xsl:template name="LinkList" match="Row[@Style='LinkList']" mode="itemstyle">
	<xsl:variable name="SafeLinkUrl">
		<xsl:call-template name="OuterTemplate.GetSafeLink">
			<xsl:with-param name="UrlColumnName" select="@URL"/>
	<xsl:variable name="DisplayTitle">
		<xsl:call-template name="OuterTemplate.GetTitle">
			<xsl:with-param name="Title" select="@URL"/>
			<xsl:with-param name="UrlColumnName" select="'LinkUrl'"/>
	<xsl:variable name="TheLink">
		<xsl:value-of select="substring-before($DisplayTitle,',')"/>
	<div id="linkitem" class="item link-item" style="padding-left:10px;">
		<xsl:call-template name="OuterTemplate.CallPresenceStatusIconTemplate"/>
		<img src="{$TheLink}" align="middle" style="padding-right:2px;" />
		<a href="{$TheLink}" target="_blank" title="This link opens in a new window">
			<xsl:value-of select="substring-after($DisplayTitle,',')"/>

The main changes I made were the additional padding added to the div in line 16 to get everything to line up with the QuickLaunch links and the img element in line 18.

The img element uses a special link from Google (found on the Coding Clues blog) concatenated with our link’s URL. This link allows us to dynamically retrieve the favicons without having to store them within SharePoint or maintain them as links get added or changed.

So where do we put the above XSL? In your site collection’s Style Library there is a folder called XSL Style Sheets. Open the ItemStyle.xsl file and scroll all the way to the bottom. Just before the final node, </xsl:stylesheet>, paste the above XSL. Since this is just a named template, this won’t affect anything else within your site collection. Upload the changed ItemStyle to the XSL Style Sheets folder and make sure to Publish a major version of the file so everyone can see it:

Now we need to tell our Links Content Query web part to use this item style. So, back in SharePoint Designer, right-click on your Content Query web part and choose Properties. Scroll down to ItemStyle and change it from Default to LinkList:

Save the master page and refresh your site and you should see something similar to this:

Isn’t that pretty!? Now everyone loves you!

InfoPath List Form Enhanced Text Showing All Grey and Stuff

Applies To: SharePoint 2010, InfoPath 2010

As mentioned in my previous post, you can replace the standard list item forms with InfoPath browser based forms (SharePoint 2010 Server Enterprise only). This is a great feature but there are some gotchas that can be hard to find answers to; mostly because these types of forms have different limitations and options than other InfoPath forms.

I was using this feature and had a form view for New, Edit & Display and everything was mostly working. However, my display view was annoying the crap out of me. My list has a couple of Multiple lines of text columns that allow Enhanced rich text (Rich text with pictures, tables, and hyperlinks). Although these displayed just fine on a standard List Item Display Form, they were Grayed out on my InfoPath List Item Display Form.

This means that although it would show formatting such as bold or underline, any text colors you picked were totally overridden with that obnoxious gray:

Turns out I had set the view to Read-only (This is the Display view so that seemed like an important step to me). In my desperation I opened up the View Properties and unchecked the Read-only box, hit OK and re-published the form.

When I opened the List Item Display view everything looked perfect. Apparently InfoPath and/or SharePoint is smart enough to know to make everything uneditable when displaying a list item:

InfoPath List Form New Item is Read Only

Applies To: SharePoint 2010, InfoPath 2010

Many of you are probably aware that you can replace the standard list item forms with InfoPath browser based forms (SharePoint 2010 Server Enterprise only), and if you weren’t, you are now. It’s as simple as hitting the Customize Form button on the List tab of the List Tools ribbon:

By default the same form is used for all three views (New, Edit, & Display). You can create new views in InfoPath (Page Design tab -> New View) and then back in SharePoint use the Form Web Parts dropdown shown above to customize the InfoPath Form Web Part to show the view you want. There are other guides out there to getting this done that go into more detail, but that’s the gist of it.

I ran into an interesting problem the other day when using this feature. I had a form view for New, Edit & Display and everything was working great. Then I realized that I had some optional fields that I didn’t want to show on the display form if they were blank.

So I wrapped those up in a section and slapped a formatting rule to “Hide this control”:

Boom! I published the form and everything displayed as expected. I did a bunch of other stuff and then went back to add another item to the list. Suddenly the form view I was using for the New List Item was completely Read-only. Obviously, that’s a problem.

I opened the form back up in InfoPath and made sure the View Properties didn’t have the Read-only checkbox checked – Nope. I cried a little but then through the blur of my tears I noticed that every field on every view that wasn’t in one of my auto hide sections had a little blue info icon. Hovering over the icon showed FieldName (Control bound to missing field or group). What a heck?

Meanwhile the Edit form is still working great. So I right-clicked on the fields choose Change Binding and verified they were all hooked up correctly. Some searching brought me to this TechNet thread. The answer is in there but it wasn’t super obvious to me.

Basically, by adding the sections I had caused all the other fields on all the views to be outside the SharePointListItems_RW section and this breaks their binding. So how do you fix it? It’s actually pretty simple.

Right-click on any of your Optional Sections and choose Section Properties from the context menu. In the Default settings section of the Data tab is a radio button. Switch it from Do not include the section in the form by default to Include the section in the form by default. Click OK.

Suddenly all the little blue info icons go away and every Optional Section is now called Section. Re-Publish your form and you’ll find the auto-hiding still works perfectly and your New Item form is no longer Read-only. See? It can’t rain all the time sunshine!

Hide “All Site Content” Link Based on Permission

Applies To: SharePoint

By default in SharePoint 2010 nearly every visitor to your site automatically gets an “All Site Content” link added to their quick launch. In addition, there’s a “View All Site Content” option in the Site Actions menu. Here’s a default team site as seen by a user with only Read permission:

For team sites and basic work areas this is a great idea. However, there are several cases where it would be better if this wasn’t shown to the average user – for instance, a Business Intelligence Center. A Business Intelligence Center site is where you’re probably hosting PerformancePoint content and/or reports, etc. Anyone using your dashboards must have read permission to all the content and datasources. But generally you don’t want general users browsing this content. It’s better to provide good navigation either through the quicklaunch or a nice home page. However, you want your designers to still have this link.

Fortunately, Microsoft built the quicklaunch link with a ClusteredSPLinkButton and the Site Actions link with a MenuItemTemplate both of which have the PermissionMode and PermissionsString properties. These controls allow you to perform simple permission trimming.

SPSecurityTrimmedControl Permission Trimming

The controls both inherit from SPSecurityTrimmedControl which is where the permission trimming properties and methods come from.

The first property, PermissionsString, defines the permission(s) a user must have in order to view the control. You can find a list of permissions here. By default both of the All Site Content link controls use the ViewFormPages permission (Basically, anyone who can get to the site).

You can use multiple permissions in your PermissionsString by separating them with a comma. How those are used is determined by the PermissionMode property which can have two values: Any or All. When set to “Any” the control will show if a user has at least one of the permissions in your PermissionString. When set to “All” the control will only show if a user has every permission listed in your PermissionString.

We wanted the All Site Content links to only show for users with Full Control over a site. So our PermissionsString needs to be ManageWeb, and since we’re only using one permission our PermissionMode can be either Any or All or even not included.

Hiding the Quicklaunch Link

To change the permission trimming attributes for our controls, we have to edit the MasterPage. If you’re developing a custom branding solution then this should be easy enough to do directly in Visual Studio. If you’re just customizing on the fly, then you’ll use SharePoint Designer (Choose Edit in SharePoint Designer from the Site Actions menu).

In the default master page (v4.master) the Quicklaunch All Site Content link can be found around line 573 and is included in the PlaceHolderQuickLaunchBottomV4 UIVersionedContent control. Here’s what it looks like by default:


So all we have to do is change line 576 to read PermissionsString=”ManageWeb” and save.

Hiding the Site Actions Link

The Site Actions menu is just as easy to edit. The View All Site Content link can be found around line 137 inside the SiteActions FeatureMenuTemplate control. Here’s what it looks like by default:

<SharePoint:MenuItemTemplate runat="server" id="MenuItem_ViewAllSiteContents"
	PermissionMode="Any" />

Again, just change line 145 to PermissionsString=”ManageWeb” and save.

That’s it! Here’s what the same Team Site now looks like to a user with Read permission:

Remove Lookup Column Link From View

Applies To: SharePoint 2010

Okay, the title to this post is a little misleading. I won’t be showing how to actually remove the link from the view column. That requires XSLT or JavaScript. What I will show you is a work around that is good enough for me and requires nothing but the browser.

When you add a Lookup Column to a list the linked item’s display form will automatically be linked to the column wherever it shows up in a view. Generally, this is pretty awesome behavior since it gives more detail on demand without us having to do anything. Sometimes, however, these links can get in the way. This is especially true when you have more than one lookup column in a view or when you don’t want people to get confused about which link to click.

In SharePoint 2010 you can include additional fields with your lookup. So for this workaround we’re going to simply have the same reference column also be an additional field for the lookup. This allows us to choose the additional field for our view. Got it? How about an example.

Say we have a lookup column named Position that references our Positions list. We choose Title for the display field for our lookup:

This works great because it gives us a nice drop down of all the available positions for people to choose on our new and edit forms. But then when you go to create a simple view you might run into this issue:

That’s part of our view for our list. So, which link do you click on? The Position link will open the display form for the Positions list item Associate Manager. The Job Type link will open the display form for the current list item. And my head just exploded.

So our goal is to keep the Position column showing Associate Manager but without the link to the secondary list. We also don’t want to use any JavaScript or have to edit this view with custom XSLT.

So, go back to the Lookup Column and in the Additional Fields section check the box next to the same column used in the lookup (Title in this example):

This adds a new column to our list called Position:Title. So now we edit our view to use the new column in place of the lookup:

As you can see, this takes care of our problem. The user is still only presented with the one dropdown when using the edit/new forms to pick the position and our view now has no hyperlink to the secondary list’s item display form. But what about that stupid column name?

Going back to our List Settings you can click on the Position:Title column and change the column name. Obviously, selecting the same name as the lookup will get you an error:

So don’t do that. The best move is to give it another name, but you can also use a little trick. Just add a space after the name so the column name becomes “Position “. You can save this and since you already put it in your view it looks perfect:

Of course, editing the columns or messing with additional views can get confusing when columns names look exactly the same – so use at your own discretion.

Display Form Link/Menu on Column Other Than Title

Applies To: SharePoint 2010

By default, the Title column in a list can be shown in a view in three different ways:

  • Title
  • Title (linked to item with edit menu)
  • Title (linked to item)

Often you can just rename the Title column to whatever you want to have that functionality and you’re good to go. However, sometimes you want the link and/or menu on a different column. Unfortunately, this isn’t an option in the View editor within the browser. Fortunately, it can easily be done in SharePoint Designer without having to mess with XSLT at all.

Simply modify your view in SharePoint Designer:

Switch to the code view and scroll down to the purple section (you can only edit the yellow highlighted text in advanced mode – which we do NOT need to do here).

Link To Display Form

In the ViewFields section are a bunch of FieldRef elements. Find the one you want and add LinkToItem=”TRUE” and save. So your ViewFields section might look something like this:

	<FieldRef Name="SomeField1" LinkToItem="TRUE" />
	<FieldRef Name="SomeField2"/>
	<FieldRef Name="SomeField3"/>

In the above example, SomeField1 will now have a hyperlink that will open the display form for the list item.

Link To Display Form With Menu

This is pretty much the same as above except the attribute name is different. In the ViewFields section are a bunch of FieldRef elements. Find the one you want and add ListItemMenu=”TRUE” and save. So your ViewFields section might look something like this:

	<FieldRef Name="SomeField1" ListItemMenu="TRUE" />
	<FieldRef Name="SomeField2"/>
	<FieldRef Name="SomeField3"/>

In the above example, SomeField1 will now have a hyperlink that will open the display form for the list item and a drop down menu for choosing actions.

Using Feed Parameters in the RSS Viewer Web Part

Applies To: SharePoint 2010, RSS Viewer Web Part

The RSS Viewer web part is an Out of the Box SharePoint web part that can really add to your site by allowing you to integrate dynamic content directly on your pages from other sites in your environment (requires either anonymous or kerberos authentication) or from sites all over the web. You can add it like any other web part (Located under Content Rollup) and get it going quickly by setting the Feed URL property.

There are feeds all over the web and getting the URL for these is generally straight forward (click the RSS icon/button and then copy the URL) and I’ll let you figure that part out. If you’re simply grabbing a news feed from Yahoo! or someplace, then you’re probably done. There’s a lot that can be done with the formatting of the feed’s content using XSLT, but that’s out of scope for this particular article.

However, what if you would like something a little bit more dynamic? Some feeds are very customizable using query string parameters to automatically filter what you want. A good example might be pulling the SEC Filings from the Securities and Exchange Commission website. You can get a feed of Google’s Filings using the following URL:

There are several parts to this URL beyond the base of (They begin after the ? mark and are separated by the & and take the format of name=value). The one I’m most interested in is the CIK (Central Index Key). This is what tells the feed to return Google’s filings. (As a bonus, for publicly traded companies you can replace that 10 digit number with their Ticker Symbol: GOOG for Google).

Great! Now you can generate a feed for multiple companies’ SEC filings using multiple RSS Viewer web parts. But what if you only want one web part that can switch which company is being displayed? That’s exactly where Feed Parameters come in.

Configure the Filter

Like many web parts, the RSS Viewer web part allows connections to other parts including the filter web parts. Most any of the Filter parts will work depending on what you’re trying to accomplish. An obvious example would be to use the SharePoint List Filter web part to pull company ticker symbols in from another SharePoint list and use a drop down to select which filings to view. My preference, however, is to use a Query String (URL) Filter part so that I can hook it to multiple parts to create a dynamic page that can be linked as if it were many pages. I’ll show you how to hook that up, but the basic concept is the same for any of the parts – Filter some value and send it to the RSS Viewer.

Add a Query String (URL) Fitler part to your page (Located under Filters):

From the tool pane for the Query String (URL) Filter part the key values can be found in the Filter section. The Filter Name property should match the query string property name in your RSS Feed’s URL. So in this case our Filter Name is CIK. The Query String Parameter Name is the name of your own query string to the page. In this case I’ve set it to Symbol. The Default Value is optional, but is generally a good idea so that if the page is accessed without a query string, the feed still shows something. I’ve set ours to GOOG (Although I could easily have set it to Google’s CIK value since the SEC feed is pretty flexible):

It’s also a good idea to also give your filter web part a better name than the default since this is the name you’ll see when setting up the connection. This is just the Title property in the Appearance section. I’ve set mine to Symbol Filter. Press OK to save your changes.

Setup the Connection

Using the drop down menu for the RSS Viewer Web Part choose Connections > Get Feed URL From > Symbol Filter (If you don’t have a Connections menu, select Edit Web Part and look again):

If everything has been successfully connected the Query String (URL) Filter should look similar to this when editing the page (it isn’t visible normally):

If you add ?Symbol=MSFT to the end of your page’s URL (If your page is http://app/site/SitePages/Home.aspx then the filtered url would be http://app/site/SitePages/Home.aspx?Symbol=MSFT) then the RSS Viewer should now be showing Microsoft’s latest SEC Filings. Just kidding! There’s one little gotcha that’s very easy to fix.

If a feed parameter is already set in the RSS Viewer’s URL, then any feed parameters from connected web parts are ignored. In this case, this is because we pasted the feed’s URL in directly including the CIK=0001288776 section of the URL. To fix this, just delete this part of the URL. So our new feed URL will look like:

Now try that filtered URL (Your page + ?Symbol=MSFT) again and you should see Microsoft’s SEC Filings:

This quickly gives us a lot of flexibility. This works great for all sorts of feeds allowing you to filter or customize your feeds before they ever get to you; and all on the fly.


So here’s the summary of what you need to do to get this working:

  • Add an RSS Viewer web part and set the Feed URL to the address of the feed you want to pull. Remove the dynamic parameter you want to set.
  • Add a Filter web part and configure it to pass the filter name as the name of the dynamic filter in the feed URL
  • Connect the RSS Viewer web part to the Filter web part using the Feed Parameter connection
  • Shout Abracadabra every time anyone uses a dynamic view of the page

The RSS Viewer part can be a very powerful part of your page allowing dynamic content without any custom code.