Editor's Note: The following is a guest post by SharePoint Server MVP Randy Drisgill as part of the MVP Award Program Blog's "MVPs for SharePoint" series. Randy
is the Branding and Design Lead for SharePoint911. He has more than ten years
of experience developing, designing, and implementing Internet based software
for clients ranging from small business to Fortune 500 companies. Randy has
been working with SharePoint since the beta of SharePoint 2007 and has worked
on many large-scale internal and public facing SharePoint branding projects. In
2009, Randy was recognized by Microsoft as an authority on SharePoint branding
and design by being awarded MVP status for SharePoint Server. Randy has worked
on several SharePoint articles, books, and white papers as well as having
co-authored Professional SharePoint 2010 Branding & User Interface Design
for Wrox Press (http://bit.ly/sp2010-brandingbook).
You can find Randy on Twitter as @Drisgill and at his blog (http://blog.drisgill.com).
Content Query Web Part (CQWP) was introduced in SharePoint 2007 and is focused
on rolling up information from sites in the current site collection by querying,
filtering, and sorting the content. You can use this web part in any SharePoint
Server site that has the publishing features enabled. Because of its hooks into
SharePoint Server publishing, the CQWP can not only roll up information from
lists, but it can also roll up information from publishing pages. In this blog
post I will show you how to create a CQWP that rolls up news articles from a
sub site, as well as how to take advantage of some of the new CQWP features in
Creating the News Articles and Adding the CQWP
sure to start with a SharePoint Server publishing site (either create a new one
by selecting one of the publishing site templates or by activating the
publishing features on an existing site).
1. From your parent publishing site, create a new
sub-site using the Publishing Site template and call it News,
2. In the News site, create a few new pages (at
least two), each using the Article Page
Image on Left page layout. Be sure you enter content and images for the Byline and Rollup Image fields. To do this, click Site Actions > New Page. Then when the page is created, switch
the layout by editing the page, then from the ribbon click Page > Page Layout > Article Page > Image on Left. Add
some fake content to each page including the Byline and Rollup Image and then save and publish / approve the pages. (Note: if
you can’t find the Image on Left page layout you may need to activate it from Site Actions > Site Settings > Page
layouts and site templates
navigate back to the top level site, edit the page, and add a Content Query Web
4. When the page refreshes, click the link to open
the tool pane for the CQWP. Then expand the Query section and select Show
Items from the following site and all subsites then click Browse. From the Select Site dialog click on your newly created News site and then
5. From this web part menu you could filter, group,
and sort the items however you would like. Click OK to see the results.
Right now the results aren’t great; they
basically show the title and some rollup images. To show the page content we
will need to change some settings.
Working with Fields to Display
you are familiar with how the XSLT styles worked with the CQWP in 2007, you
might remember having to export CQWP’s, edit CommonViewFields, and reimport them. In SharePoint 2010 you can now
handle this directly in the Web UI with the new Fields to display option.
1. Edit the CQWP again and expand the Presentation tab, you can select group
and item styles here, both correspond to XSL files that are in the site
collection’s Style Library under XSL Style Sheets. For this demo we will leave
them set to Default and Image on left.
2. The next setting is Fields to display, change Description
from the default “Comments” to “Page Content” and click OK.
setting basically shows slots for all the displayed values from the selected
itemstyle XSL. You can set whatever field you want to show for those display
values. In this case we set the Description value to the Page Content field.
With it set properly, the CQWP now shows the page contents as well as the other
information. If you wanted to, you could enhance the layout and styles even
more by editing the itemstyle XSL file.
Note that any HTML source is currently escaped
and displayed as text in the CQWP. To have the actual HTML rendered you would
need to edit the itemstyle XSL. This is outside of the scope of this article,
but if you are familiar with editing itemstyles, you need to add disable-output-escaping="yes" to <xsl:value-of
Working with the new CQWP Filters
2007 included the ability to filter CQWP’s by specific field content, but in
SharePoint 2010 there are a couple new filtering options. Rather than just
check that a field has a specific string, you can filter that field by either PageFieldValue (which matches the value
of another field on the page) or PageQueryString
(which matches the value of a URL variable that is passed to the page). In this
example we will filter the CQWP by a URL value.
1. Edit the CQWP again and expand the Query tab
2. Under Additional
Filters select Byline, contains, and enter “[PageQueryString:
MyFilter]” then click OK.
This will tell the CQWP to filter based on the text of the
byline of the news article pages to see if it contains the value of the
variable MyFilter that will be passed over the URL. To test it, save the page,
then change the URL in your browser to include the current page URL and a
MyFilter variable. Be sure to pick a value that matches something you entered
in one of the bylines of the news article pages. It should look like this:
This would cause the CQWP to only show items
that have “Randy” in the byline. This can be a very useful feature; you could
create a page of links that sends over various categories in URL variables and
filter the CQWP on the news page based on those values. By doing something like
this you can reuse the same CQWP page to show many different types of filtered
content in the rollup.
Thanks for your useful article,
but there is a question:
for doning this,i should make a page for each news?
i mean that for every single news i should make a News Articl page from my news Articl page layout?
i'm making a news site ,there are alot of news in every type (politics,economic,etc)
i used a CQWP and attach my news list to it,and i wanted when user click on one news topic it goes to a page which shows the news body that is in news list
can i do this without using article pages?
please help me
Ireally appreciate your help...
Yes you should do this for every single News.
and yes you can do this, you can create a list of News, and when the user clicks on it it goes to a url like this
and there is a control in the page to get the item by Id.
This approach is easy but it have a big issue, It is not crawlable by sharepoint. search results will not be very good
So the best approach is what Randy show up
Great article as usually. Thank you Randy. Could you point me to a good resource on how to create categorized news site for a company?
Also, how would I be able to display an excerpt only, instead of the content?
I'm able to setup the CQWP to show the articles but diffrent sized images kinda ruins it. Is there a way to resize the images automaticly?
Great Article Randy.
I got one question though, as most of my customers want the pictures used in the CQWP news rollup to be at the same size so that the view is clean and neat.
Is it possible to upload pictures in some way so that the image get resized automatically?