Presenting News and Events information in an intuitive and flexible way is a mainstay of every intranet portal and Microsoft has done a great job with the standard Out-of-the-box (OOTB) web parts for the SharePoint Modern UI. Great as these web parts are, we reckon there is room for improvement and in response to commonly requested features from our customers we have developed a new client side web part called Kaboodle Announce.
Kaboodle Announce is currently free but that’s just until we complete beta testing and find a way to commercialise it, so download your copy today (see the bottom of this page).
All we ask is that you provide us with some constructive feedback.
What you gain
This section summarises the new features that you can harness – all the stuff that we think is missing from the OOTB web parts.
Driven by views
The OOTB web parts are driven by search which means that all filtering and sorting settings must be applied in the web parts themselves making them more complex to configure. We take a different approach and control the content shown in web parts by using standard views which you define on the Site Pages library or Events list of the site.
This means that the Web Part is much simpler to maintain. In fact, to change what is shown in a web part does not require the web part to be updated at all as you can simply change the settings of the view that it is hooked up to.
It also means that updates are instantaneous, no more waiting for the search indexer to kick in before an item is shown or removed.
Local or Remote
By default, an Announce Web Part will assume that you want to present data in the local site but you can actually hook up a web part instance to any site within you tenancy, all you have to do is provide the URL of the site you want to surface information from.
Announce fully preserves security trimming, so if you are linking to a different site then you will need to make sure that consumers have at least read-level permission at that site. You could use this security trimming feature to target news and events to different users based on item security settings.
News and Events
In the SharePoint Modern UX, news and events are very similar information items and so rather than create 2 separate web parts, Announce will allow you to connect to either. You can’t however connect to both news and events in the same web part, although this is something that would technically be possible. Let us know if you think it’s a good idea.
There is of course nothing stopping you from using multiple web parts on the same page so you can pull news and events from multiple locations to make it accessible from the one place.
Tabs and Panels
As the content shown in web parts is driven by views we can use the group-by settings of the view to present items in tabs. In the screenshot below, an events list has been augmented with a simple choice field for different departments and event items have been tagged with the relevant department. The view used by the web part is configured to show events grouped by department and the web part is smart enough to automatically generate a tab for each group.
Tabs can be positioned Top, Left, Bottom or Right and you can choose from multiple theme colours, styles and layouts.
Alternatively, you can choose to display groups in expandable panels as shown below.
Both tabs and panels can optionally display item count information and indicate when new items have been added to the list. With panels, the number of new items is indicated by the number of green dots in the panel header (see the Human Resources group panel above where 2 new items have arrived).
Panels can be set to be either expanded or collapsed by default or you can set things up so that any group which has a new item (created in the last 48 hours) will be automatically expanded when users access the page.
Tiles and Images
You can choose how item tiles are displayed. Where a custom header image has been set in the news or event item, that image can be shown in the item tile. Alternatively you can display:
- A Title Tile: A simple tile that displays the item’s title (or a truncated version of it).
- A Date Tile: A simple tile that show a relevant date value. For news items this can be set to either the Modified or Created date and for events, the start and end date/time will be used.
- A Category Tile: A custom icon from the Office Fabric icon set can be associated with a category column so that an appropriate graphic can be shown for each category.
The web part can be configured so that when a custom image is specified that image is used in the tile but where no such image is set, the web part will fall back to one of the 3 options listed above.
The screenshot below shows a web part configured to show page header images but falls back to show event dates where no custom image has been set.
Category based formatting
In addition to associating a custom icon with each category it is also possible to associate a colour with a category as shown below.
Graphic size, the text displayed in the web part and the layout of items changes dynamically in response to the available space. You can also enforce a more compact layout if you prefer and choose to hide information such as the user who created the item.
You can customise the header text, display the web part with or without a border, set a fixed height or specify the number of items to display before vertical scrolling kicks in. And you don’t need to use tabs or panels if you prefer not to – it’s up to you.
You can also choose to display the graphic as a square rather than a rectangle. And if the view returns no items then you can choose to hide the web part altogether or display a friendly custom message to users instead.
Highlighting, pinning and new items
If you define a column called “Highlight” on the event list or site pages library and it returns a valid HTML colour (named colour, RGB or hex value) then that colour can be used to highlight items in the web part. A simple text, choice or calculated column can be used and the colour value is used to outline the list item. If the value cannot be interpreted as a colour then no highlighting is applied. So a you might set up a simple choice column with values such as Red, Orange, Blue and Green but set the default value to None.
Similarly, a Yes/No value returned by a column named “Pinned” can be used to show a pin icon next to an item. The idea is that the Pinned column can be used in the view as a sort order attribute so that pinned items are always shown first.
A green dot can optionally be shown next to new items (those created within the last 48 hours).
Unlike the OOTB web parts which just open news or event items in the same browser windows, we give you the option to control what happens when users click on items. You can:
- Redirect the current browser window (in the same way as the OOTB web parts)
- Open the item in a new browser tab
- Open the item in a pop-up dialog
We believe that the ability to open an item in a dialog is particularly useful as it allows users to quickly access information without ripping them away to a completely different context, which can be especially disorientating when the new or event information is located in a remote site.
You can also customise the link to more news and events. In addition to being able to set the link text and tool-tip you can specify a custom URL link and choose whether the content opens in the current window or a new browser tab.
What you lose
There has always got to be some compromises and in certain circumstances you might be better to use the OOTB web parts. In particular:
- Item Aggregation: If you need a web part to pull content from multiple locations and present them in the one web part then that is something that cannot be done with Announce (currently at least).
- Advanced Layouts: The OOTB web parts offer a wider range of layouts including Top Story, Hub News and Carousel. Kaboodle Announce does not currently provide these options, preferring instead to just offer simple item lists.
- Add Item links: The OOTB web parts can be configured to show menu items that will allow users to add new content. Announce does not current provide similar links for content creation.
Download and try
Why not download the solution package and try out Kaboodle Announce, its free (for now) so you really have nothing to lose!
The zipped solution package can be downloaded from here.
Installation and deployment is really easy and details can be found in the product support documentation which can be downloaded from here.
Additional information on how to set up category based formatting can be found on this blog post.
Please take the time to provide us with constructive feedback, report bugs and issues and send through ideas for product enhancements.