Advanced widget settings

Open the Advanced settings

To open the Advanced settings for Content list widget, in the upper-right corner, click Settings (Advanced settings). 

You can modify the following settings:

Label

You can change the name of the widget that is used to display the widget in the page editor.

Content view display mode

Based on your selection the items will be displayed as follows:

  • Automatic
    Handles Details item URLs like: ~/page/2021/01/01/news.
  • Master
    Shows a list that does not handle Details item URLs. For example, ~/page/2021/01/01/news will throw 404.
  • Detail
    Shows the selected item in Details mode only.

Selection group logical operator

If you apply multiple filters – for example, by tags and by parent, the filters are applied by using a logical AND. This means that all the conditions must be true – for example, News items tagged with tag Sports and Weather AND having been published in the last week.

Use this radio button to change the logical operator to OR.

Filter expressions

In this field, you can create a custom filter by manually entering a filter expression in JSON format. This filter expression is a serialized hierarchical JSON structure. The structure is the same serialized structure as when working with filters and the REST SDK. 

Following are filter examples:

Basic filter by custom short text field

Basic filter by taxa

This filter accepts the following operators:

  • "eq" - equals
  • "ne" – does not equal
  • "gt" - greater than (for numbers)
  • "lt" - less than (for numbers)
  • "ge" - greater than or equal (for numbers)
  • "le" - less than or equal (for numbers)
  • "any+or" - contains any of the collection
  • "any+and" - contains all of the collection
  • "not+(any+or)" - does not contain any of the collection
  • "startswith" – starts with (for strings)
  • "endswith" – ends with (for strings)
  • "contains" – contains (for strings)

The above filters have the following properties:

  • FieldName maps to the name of the custom field for the selected content type. 
  • Operator maps to the logical operator.
  • FieldValue maps to the value with which to execute the logical operation.

Related filter

This filter allows you to filter items by any related data field. The ChildFilter object can contain a complex filter or a basic filter. This filter can be nested inside a complex filter.

The filter accepts the following operators:

  • "Any" - at least one of the related items must match this condition
  • "All" - all the related items must match this condition

Complex filter

The complex filter is recursive and can contain child complex filters. The complex filter has an additional property, called Operator, which can be “and” or “or”, which correspond to operator between the child filters.

Select expressions

By default, all the first-level fields are automatically fetched – both basic and related.

You can use select expressions in the following scenarios:

  • To limit the fields that are retrieved from the server, therefore, increasing the performance.
  • To add more fields that are not in the first-level response.

You specify the select expression that you want to use in the detailed mode of the widget separately, using field Detail item select expression.

EXAMPLE: For example, you can fetch the related items of another related item.
This expression looks in the following way:
Id; Title; RelatedItem(Id, Title, SecondLevelRelatedItem(Id, Title))

If you are specifying the fields manually, you are not adding anything automatically - everything you use in your viewmodels must be manually defined.

NOTE: Use semicolon when listing root-level fields and coma for nested ones.
For example, Id; Title; Thumbnail(Id, Title)

Sort expressions

By default, items are sorted in the list by publication date in descending order. You can also enter a custom sort expression.

Use the following format: {fieldName} (ASC / DESC). For example, PublicationDate DESC

Disable canonical URL meta tag

To stop generation canonical URLs on widget level, select Yes.
For more information, see Canonical URLs.

Paging mode

You can configure paging per widget. You can specify the number of items per page in the list settings of the widget. In the advanced settings, you can control the paging mode - whether the paging works with URL segments or a query parameter. 

  • URL segments
    When you select this mode, the paging is configured to work with URL segments, and you must specify the template for these segments in Template for paging URL segments field.
    The default template is -page-{{pageNumber}}- 

    The {{pageNumber}} part is mandatory, and it represents the number of the current page.
    For example, -mypage-1, -maypage-2

    The template for the URL segments also supports multiple segments.
    For example, page/{{pageNumbe}}

    NOTE: If you have more than one widget on a page that is configured to work with URL segments and they use the same template, then all the widgets will change their pages when navigating through the pages of any of the widgets. If you want every widget’s paging to work separately from the others, you must specify different segment templates for each Content list widget.

  • Query parameter
    When you select this mode, the paging is configured to work with query parameters. The pages of the list are changed with the specified key parameter.

    If you select this mode, you must specify the template in the Template for paging query parameter field. The default one is page – for example, ~/pageURL?page=3

    NOTE: If you have more than one widget on a page that is configured to work with query parameter and they use the same template, then all the widgets will change their pages when navigating through the pages of any of the widgets. If you want every widget’s paging to work separately from the others, you must specify different query parameter templates for each Content list widget.

Custom CSS classes

You can modify the look and feel of your content widget, by applying additional CSS classes. You can add CSS classes to the List view and the Details view HTML wrapper elements. You can also add custom classes to each of the field mappings that the currently selected view supports.  

In this section, you can specify custom CSS classes that can apply to:

  • The content List view
  • The content Details view
  • All of the mapped fields

Display hierarchical content

These settings are used to modify widgets default behavior when you have a hierarchy of content types and both parent and child widgets are placed on the same page.
This section applies only to hierarchical content types – static or dynamic.

You can choose how to display the parent items and the child items, by selecting one of the following:

  • Show parent list view on child details view
    Use this setting, if on the same page, you have two widgets – one displaying the list of parent items, the other displaying a child item in Details view. 

    This radio button shows or hides the parent list, if there is another widget on the same page displaying details view of a child item.
    Use this setting on the parent widget.

    EXAMPLE: If you have a parent content type Countries that has child content type – Cities. On a page are dropped both Countries and Cities widgets. By default, when a City is opened in detailed view, the list of Countries is still visible on the page. If you want to hide the Countries widget, when a City is opened in detailed view, you must select No.

  • Show parent details view on child details view
    Use this setting, if on the same page, you have two widgets – one displaying the parent item in Details view, the other displaying a child item in Details view. 

    This radio button shows or hides the parent’s Details view, if there is another widget on the same page displaying details view of a child item.
    Set this setting on the parent’s widget.

    EXAMPLE: If you have a parent content type Countries that has child content type – Cities. On a page are dropped both Countries and Cities widgets. By default, when a City is opened in detailed view, the list of Countries is still visible on the page. You may want to display additional information about the country of the selected city. To enable the Countries widget to resolve details about the country you must select Yes.

  • Show child list view if no parent selected
    Use this setting, if, on the same page, you have two widgets – one displaying a list of parent items, the other displaying a list of child items. 

    This radio button shows or hides the list of child items when no parent is selected.
    Set this setting on the child’s widget.

    EXAMPLE: If you have a parent content type Countries that has child content type – Cities. On a page are dropped both Countries and Cities widgets. The Cities widget is configured to show cities only from the currently selected country. By default, if there is no Country opened in detailed view, the Cities widget does not show any items. If you want all cities to be displayed when there is no Country selected, you must select Yes.

Metadata fields

  1. To use metadata fields, under SEO enabled, select Yes.
  2. Configure the metadata fields for the module that you have selected to display in the widget.
    For more information, see Configure Meta title and Meta description.
  3. Fill out the Meta title and Meta description fields.
    For more information, see Meta title and meta description of widgets.
  4. To use Open Graph properties, under OpenGraph enabled, select Yes.
  5. Configure the Open Graph fields for the module that you have selected to display in the widget.
    For more information, see Configure Open Graph properties.
  6. Fill out OpenGraph title, OpenGraph description, OpenGraph image, OpenGraph video, and OpenGraph type fields.
    For more information, see Open Graph properties of widgets.

NOTE: For the automatically generated SEO and Open graph fields to be added to your page, you must add the call to @Html.RenderSeoMeta(this.Model) in the <head> tag of your root layout file. 

Increase your Sitefinity skills by signing up for our free trainings. Get Sitefinity-certified at Progress Education Community to boost your credentials.

Get started with Integration Hub | Sitefinity Cloud | Sitefinity SaaS

This free lesson teaches administrators, marketers, and other business professionals how to use the Integration hub service to create automated workflows between Sitefinity and other business systems.

Web Security for Sitefinity Administrators

This free lesson teaches administrators the basics about protecting yor Sitefinity instance and its sites from external threats. Configure HTTPS, SSL, allow lists for trusted sites, and cookie security, among others.

Foundations of Sitefinity ASP.NET Core Development

The free on-demand video course teaches developers how to use Sitefinity .NET Core and leverage its decoupled architecture and new way of coding against the platform.

Was this article helpful?