Article

Kentico Repeaters, Macros, and Transformations

When designing content delivery in Kentico, the Repeater is your workhorse web part. Collect targeted content and display anywhere on your site.

By Cathy Dew

One of the challenges with Content Management Systems are the constraints around how you store content and then deliver the content to your visitors. These two vectors are sometimes in direct opposition to each other, e.g. when you try and make life easier for your content editors you make it more difficult to display the content in multiple locations in your site.

With Kentico, you have a very powerful feature with the repeater web part to collect targeted content, and with the built-in transformations (and a possible assist via macros) you can display content from and to anywhere in your Kentico site.

Click To Tweet

The Real Workhorse in Kentico, introducing the Repeater Web Part #Kentico #KenticoGoldPartner

One of the best web parts in the library is the Repeater Web Part. This tool is the jack-of-all-trades web part for displaying content anywhere on your web site. We use the Repeater web part to solve a lot of different display needs, from Featured Articles, customized article listings, call outs, related links, and many more options. The web part is very simple to use, but also had some very powerful advanced features that can be exploited to solve a myriad of display needs.

Basic Settings

Let’s do a quick walk through of the primary attributes of the Repeater Web Part.

01-RepeaterWebPart.png

Right out of the box, you only need to add a unique ID and the Content Path to the Repeater attributes, and you can start serving the content to the target page. In this example, we are picking all (%) articles in the /News branch.

Content Filtering

The above example grabs everything, without reservation. So, let’s look at the next step which is content filtering.

02-RepeaterWebPart-ContentFilter.png

Here we can control which articles we are collecting for display. The most obvious filter is the page type. Page types are an important differentiation between types of stored content in Kentico. Review our article on Kentico Page Types for a quick overview of this basic Kentico content building block. Filtering on the pages type makes it very easy to ensure you are collecting the exact content you want. (You are customizing your page types, correct?)

Let Categories give your audience control over what they see

We also have a secondary filter for category. This is setup as an optional filter, that if exists is used, otherwise it’s ignored. Categories are another built-in feature of Kentico’s CMS options that should be part of your standard configuration steps.  Content editors can select one or more categories for their posts / articles, and the category filter can be used by the visitor to dynamically filter the available posts / articles.

Sort order matters, don't let it be random

Order By is another important part of your data display. With this simple attribute, you can setup a sort order of the returned data. For Articles and posts, it makes the most sense to order them by publication or post date. In this example, we are putting the most current article at the top.

Don’t forget to ensure the “select only published” is checked. You don’t want draft or in process articles to appear on your web site before they are ready.

Power users can leverage more Boolean logic

Lastly, you can customize the content further by adding in a customize WHERE clause. This option is really for power users that understand the underlying data, table columns, and know SQL. In this example, we are not selecting any article that is flagged as the feature article, since we are displaying this post in another web part and we don’t want to show it twice on the page.

No coding required!

The best part about setting up all the above settings is the changes are done right within the Administrative interface, no special page coding or compiling is needed.

Transformations

The next step is to customize the display of your articles. Transformations are another key building block in working with Kentico. And we find that the power of this feature that makes Kentico the best in class for your CMS web site.

If you have an existing transformation for your content display you can attach it to the repeater web part by simply clicking the select button and selecting it from the list.

03-RepeaterWebPart-Transformations.png
 

If you need to edit that transformation, or create a new one, you don’t need to visit the Page Types transformation tab, you can work directly from the Web Part configuration screen.

SAMPLE of a news article transformation

Here’s an example of a simple transformation we use for our news articles. Understand this the code and HTML that is applied to each record returned by the content filter. Each individual record will have the macro code expanded into the proper value that is appropriate for the target record. (The record before and after can and will have different data values.) And therefore, you only need to worry about HTML code for the row itself. The “container” display code is managed elsewhere.

04-Transformations.png

Don’t be scared with the {%%} elements. These are the macro / K# commands that provide the dynamic data values associated with the target record. The reference table for the transformation commands is available directly from Kentico, or via their compiled help file that’s part of the installation. You’ll find that Kentico has a great library of transformation methods that are suitable for a wide variety of display needs.

Page types come in handy

All of the standard page type fields are setup as variables for you to add into your transformation, BlogPostTitle, BlogPostDate, BlogPostTeaser, are just a couple of examples with the BlogPost Page Type.

Separation of styling and web parts

Your HTML interface designer can provide you with a well structured / well formed HTML code part that will have all the CSS and HTML elements needed to customize your data. You don’t need to embed CSS directly into the web part. You can put the CSS classes in your site Theme or provide them as part of the web part using the Add CSS styles button right here in your transformation editor screen.

Keep your HTML scaffolding separate from your display code and you’ll have a much simpler management and update of your site over time.

Advanced Feature: Macros / K#

Sometimes you need to get really complex, and the transformation methods are not enough. If you need more power, look at learning the full macro or K# language syntax.  Additionally you can create global or area specific macros using the Macro Rules interface. This feature allows you to create macros using pre-defined text based clauses without having to understand the underlying K# syntax. This also allows you to share your macros within object types like Workflow, Forms Validation, and Marketing. Saving you time and offering code reuse.

The Kentico platform provides a rich toolset via the Admin

As you can see Kentico provides some very powerful display options right within the Administrator interface, and while it’s not a zero-coding environment you don’t need to develop custom server-side parts to create complex displays. If you need help learning the basics of repeaters and transformations or configuring your Kentico web site for more effective editing and content display, 2Plus2 can help. Go online to schedule a free consultation with our team or call 510-652-7700 today.

Cathy Dew
Cathy Dew – CEO + Information Architect
Cathy focuses the company on our mission – Real results. Every time. Information architect and strategist, Cathy is passionate about making software work well – the function, the feel, the result.
0100011001101001011100100111001101110100001011000010000001101000011000010111011001100101001000000110000100100000011001000110010101100110011010010110111001101001011101000110010100101100001000000110001101101100011001010110000101110010001000000111000001110010011000010110001101110100011010010110001101100001011011000010000001101001011001000110010101100001011011000011101100100000011000010010000001100111011011110110000101101100001011000010000001100001011011100010000001101111011000100110101001100101011000110111010001101001011101100110010100101110001000000101001101100101011000110110111101101110011001000010110000100000011010000110000101110110011001010010000001110100011010000110010100100000011011100110010101100011011001010111001101110011011000010111001001111001001000000110110101100101011000010110111001110011001000000111010001101111001000000110000101100011011010000110100101100101011101100110010100100000011110010110111101110101011100100010000001100101011011100110010001110011001110110010000001110111011010010111001101100100011011110110110100101100001000000110110101101111011011100110010101111001001011000010000001101101011000010111010001100101011100100110100101100001011011000111001100101100001000000110000101101110011001000010000001101101011001010111010001101000011011110110010001110011001011100010000001010100011010000110100101110010011001000010110000100000011000010110010001101010011101010111001101110100001000000110000101101100011011000010000001111001011011110111010101110010001000000110110101100101011000010110111001110011001000000111010001101111001000000111010001101000011000010111010000100000011001010110111001100100001011100010000000001101000010100000110100001010010000010111001001101001011100110111010001101111011101000110110001100101
Decode