This post details how to use a Content Query Web Part (CQWP) and a list to create a more visually appealing link solution for a site’s welcome page, or another web page in the site. This solution may be useful for site owners and designers who are still working in a SharePoint 2010 environment. In later SharePoint versions and Office 365, the Promoted Links Web Part and list can be used to achieve the same result, with a more dynamic user interface.
Note: This blog assumes you know how to complete the following actions: 1) Create lists, 2) create new list columns, and 3) add web parts to web pages.
Tip: The server image URLs for the images used in the screenshots are in the Images section at the bottom of the post.
Create a List:
|3||Add a CQWP to a site’s default page. Leave the page in Edit mode.|
|4||Click the web part’s drop down arrow, and then select Edit Web Part.|
|5||Click the Query section plus sign.|
|6||Select Show items from the following list and then click Browse.|
|7||Select Navigation Links and then click Ok.|
|8||In the Content Type section, in the Show items of this content type drop down, select List Content Types.|
|9||Click the Presentation section plus sign.|
|10||In the Grouping and Sorting section, make the following selections and changes: A) Group items by Title, B) select Show groups in ascending order, C) select 2 for Number of columns, D) Sort items by Content Link, E) Show items in ascending order, F) and deselect Limit the number of items to display.|
|11||In the Styles section, for Group style select Whitespace, and in Item style select Large Title.|
|12||In the Fields to display columns, enter the Navigation Links columns: A) Link field enter Content Link, B) Image field enter Content Image, C) Title field leave as Title, and D) Description field enter Content Overview.|
|13||Click the Appearance section plus sign.|
|14||In the Chrome Type drop down, select None.
NOTE: This setting hides the web part’s title on the web page.
|16||On the Page tab, in the Edit group, click Stop Editing.|
|17||The links appear on the default page.|
Images (Layouts) URLs:
- To sort links in a non-alphabetical order, add a column called Display Order to the list and in the CQWP settings, use the column to sort items by. The column type can either be a choice column with number selections, SLT, or Number column.
- SharePoint server image screenshots taken from the Bits of SharePoint blog at http://www.bitsofsharepoint.com/ExamplePoint/Site/SharePointLayoutImages.aspx
Solutions like this are available to Xgility managed services customers or as part of solutions built by our enterprise collaboration consulting team. If you would like more information on our services please contact us.
Author: Jenny Hersko