Content query web part – get it all in one place and style it!
Post on 25-May-2015
13658 Views
Preview:
DESCRIPTION
Transcript
Benjamin NiaulinPresented at: SharePoint Fest Chicago
SharePoint Geek
Content Query Web Part – Get it all in one place and style it!
Share-gate.com@bniaulin
Description
More than once people have customized or developed a solution or web part to accommodate certain needs. Many times, these needs could have been met with a simple Out-of-the-Box Web Part called the Content Query Web Part. In this session we will explore the possibilities of querying the right content as well as changing the style to display these results.
Share-gate.com@bniaulin
Who is this guy talking?
Benjamin NiaulinSpeaker, Trainer, Consultant, SCRUM MasterBlog
bniaulin.wordpress.comWebsite
share-gate.comEmail
benjamin.niaulin@share-gate.comTWITTER!: @bniaulin
Share-gate.com@bniaulin
Agenda
IntroductionThe Content Query Web PartDEMOThe XSL Files – What is that? What do they do?DEMODynamic FilteringDEMOAdvanced CQWP Stuff
INTRODUCTION
Share-gate.com@bniaulin
Problems we face
Showing data from multiple lists/libraries at the
same time
Change the date format in a list/library
Dynamic filtering
Changing the look of a list/library
Showing specific data from lists/libraries to the
relevant audience
CONTENT QUERYWeb Part - Overview
Share-gate.com@bniaulin
Content Query Web Part (CQWP)
Requires Site Collection Feature: Publishing Infrastructure*
Helps create dynamic views based on what the user is looking atPower User can Edit theQuery and the StyleAggregate content fromthe Site CollectionReusable and customizablestyles
Share-gate.com@bniaulin
Web Part Properties - Query
QuerySourceList TypeContent TypeAudience TargetingAdditional Filters
Share-gate.com@bniaulin
Web Part Properties - Presentation
PresentationGrouping and SortingSortingItem LimitStylesFields to displayFeed <-- Don’t underestimate!
Share-gate.com@bniaulin
Examples
http://labs.steveottenad.com/sharepoint-2010-xslt-date-formatting/
By Ben Tedder on NBSP
By Yohan Belval from Sharegate
DEMO
XSL FILES – HUH?
Share-gate.com@bniaulin
Understanding XSLT
XSLT: Extensible Stylesheet Language Transformations
Basically transforms XML
Ref: http://en.wikipedia.org/wiki/XSLT
Share-gate.com@bniaulin
Understanding XSLT
Debug itemstyle:<xsl:template name="Debug"
match="Row[@Style='Debug']" mode="itemstyle"><xsl:for-each select="@*">
P:<xsl:value-of select="name()" /></xsl:for-each>
</xsl:template>
Learn xslt: http://www.w3schools.com/xsl/default.asp
Share-gate.com@bniaulin
Display RAW Data of Query
<xsl:template name="DisplayRawData" match="Row[@Style='DisplayRawData']" mode="itemstyle"><xsl:for-each select="@*"><xsl:value-of select="name()"/><xsl:text> = </xsl:text><xsl:value-of select="."/><br/></xsl:for-each><br/><br/><br/></xsl:template>
Share-gate.com@bniaulin
XSL Files used by SharePoint
There are 3 files used by the CQWPContentQueryMain.xslItemStyle.xslHeader.xsl
Files are located in the Style Library at the Root of your Site Collection
\Style Library\XSL Style Sheets\
Share-gate.com@bniaulin
ContentQueryMain.xsl
Contains logic that generates the appropriate calls to the Header and Item templates for each item.Contains functions that help designers modify the Item and Header XSLT transforms.Receives all the content, parses it, and sends appropriate pieces to the ItemStyle and Header templates.Maintains the structure of the Content By Query Web Part.Stores data retrieved when querying content in the path /dsQueryResponse/Rows/Row.MSDN Definition
In short….
Share-gate.com@bniaulin
ContentQueryMain.xsl
Think of it as the big container of the WebPartIn charge of what isn’t repeated (header, footer, calling CSS or JS to be used in your itemstyle after)It controls the flow of the content it receives
ContentQueryMain.xslLet’s check it out
Share-gate.com@bniaulin
Header.xsl
Contains templates that define how to display a header and ensure the consistency of group headers.Templates specified in Header.xsl receive the next item row to process, usually the first row in a group unless there are multiple columns. If there are multiple columns, the templates receive the first row of the column.You can retrieve data about the next item row by using the @Property directive. You can use the $Group parameter that contains the groupby column name and the $GroupType that represents the column type of the groupby column.MSDN Definition
In short….
Share-gate.com@bniaulin
Header.xsl
When you use the CQWP with a GroupBy option the header.xsl is called.
Share-gate.com@bniaulin
Itemstyle.xsl
Contains templates that define how to display an item. These templates receive and process one row of data at a time, ensuring that the style and data in the item rows is consistent.You can retrieve data about a row by using the @Property directive.
Basically it’s what gets applied to each “item” or row.
<div class="right"> <span class="title"><xsl:value-of select="@Title" /></span> <span class="location">Location: <xsl:value-of select="@Location" /></span>
DEMO
DYNAMIC FILTERING
Share-gate.com@bniaulin
Dynamic Filters
PageFieldValueSpecify a field on the Page Layout to act as the filter for the Query
PageQueryStringTakes the value in the URL and applies it as the filter for the Query
Share-gate.com@bniaulin
Example on MSDN BLog
Ref: MSDN Blog
Share-gate.com@bniaulin
More
http://www.chakkaradeep.com/image.axd?picture=image_319.png
ADVANCED PROPERTIES
Share-gate.com@bniaulin
Access the Advanced Properties
You can easily access advanced properties of the CQWPEdit Web Part
Export into .webpart fileOpen with an XML editor (notepad, etc.)Modify the fileImport .webpart back into your site
Share-gate.com@bniaulin
More Advanced Stuff
CommonViewFieldsAsk for additional fieldsBy default the CQWP does not return all fields automatically
QueryOverrideWhen used, all settings for Query in the UI are greyed outMakes it possible to specify the query portion of a cross-list query in CAML.
Share-gate.com@bniaulin
Still More Advanced Properties…
WebsOverrideDetermines whether the cross-list query should recurse subsites.
ListsOverrideSpecify which lists/library you want to query
<property name="ListsOverride" type="string"><![CDATA[<Lists><List ID="31A7C09D-52CC-4585-B998-A3F180A9BD07"/><List ID="7382D66D-2E4C-47CB-A95C-5EECD68F5E61"/></Lists> ]]></property>
DEMO
Filter by File Extension
Q&A
Share-gate.com@bniaulin
THANK YOU!
KEEP IN TOUCH ON TWITTER @BNIAULIN
Benjamin Niaulin
top related