Categories widget

Use the Categories widget to display categories on your page. The categories are then used to filter content. By clicking different categories from the treeview displayed on the webpage, you can filter the content of the page. By using hierarchy of categories, you can filter content items according to more general or more specific criterion.

PREREQUISITES: You have created at least two categories.

For more information about when and how to use categories, see Use categories.

To configure the Categories widget, perform the following:

  1. After you have dragged the Categories widget on your page, click Edit button in the upper-right corner of the widget.
    The Edit window appears in advanced mode.
  2. In BaseUrl input field enter the URL name of the page which content you want to filter using categories.
    This page can be either the same page on which the Categories widget is, or it can also be another page.
    For example, you can display the categories on one page of your website, but if the user clicks a category, the system opens another page and filters its content.

    NOTE: You enter the URL name in the following format ~/<URL name of page>. For example, if the title of the page is About us, the automatically generated URL name is about-us (in case you have not changed it), then in BaseUrl input field you enter ~/about-us.
    You can find out the URL name of a page in the address bar of the browser, when a page is opened in content editing mode. The URL name is the name after the name of the project (http://…/<project name>/<page-name>/…) or you can see the URL name in the properties of the page. For more information, see Edit and delete a page.

  3. To configure how the widget displays the categories, in RenderAs input field, enter one of the following:
    • HorizontalList
      The widget displays only top level categories in a horizontal list.
    • VerticalList
      The widget displays only top level categories in a vertical list.
    • Cloud
      The system displays only top level categories in a horizontal list. The more items belong to a category, the larger font the system uses to display this category.
  4. To change the default sorting of the categories, in SortExpression input field, enter the desired sorting.
    For example, Title ASC
  5. To display only a list of particular categories, perform the following:
    1. In field TaxaToDisplay, enter Selected.
    2. In SelectedTaxaIds, enter one or more categories’ GUIDs, separated by semicolon.
      For example, CCE147AC-DAD1-6F1C-989A-FF000075ADAC;CDE147AC-DAD1-6F1C-989A-FF000075ADAC;
  6. To display all the categories under a particular category, perform the following:
    1. In TaxaToDisplay, enter UnderParticularTaxon
    2. In RootTaxonId, enter the GUID for the parent category whose child categories you want to display.
  7. If you want to display only categories that are at top level, in TaxaToDisplay, enter TopLevel.
  8. To display categories that are not assigned to any content type, in ShowEmptyTaxa, entertrue.
    By default, the categories that have no items in them are not displayed.
  9. To filter the items in a category according to their content type, you use input field ContentType:
    To display only:  In ContentType field, enter: 
    Blog posts  Telerik.Sitefinity.Blogs.Model.BlogPost 
    Events  Telerik.Sitefinity.Events.Model.Event 
    News  Telerik.Sitefinity.News.Model.NewsItem 
    Images  Telerik.Sitefinity.Libraries.Model.Image 
    Videos  Telerik.Sitefinity.Libraries.Model.Video 
    Documents  Telerik.Sitefinity.Libraries.Model.Document 

    For example, when you click a category and you want only events classified with this category to be displayed, in ContentType enter Telerik.Sitefinity.Events.Model.Event.

    NOTE: To show categories that are assigned only to a specific dynamic content type, in field DynamicContentType, enter Telerik.Sitefinity.DynamicTypes.Model.<Module_name>.<ContentType_name>

  10. Click Save.
    The system saves the setting and closes the editing mode of the widget.

For more information about creating categories, see Create categories.
For more information about how to add a category to a content item, see Add categories and tags to content items.

For more information about configuring other properties, see Advanced configuration of widgets.

Configure the Categories widget to display custom classification

To display a custom hierarchical list classification, you can use the Categories widget. After you have created a Create custom classifications, perform the following:
  1. Drag the Categories widget on your page and click Edit button in the upper-right corner of the widget.
    The Edit window appears in advanced mode.
  2. Delete the contents of field TaxonomyId and click Save.
  3. Copy the TaxonomyId of the classification which you want to display.
  4. Click Edit button in the upper-right corner of the widget.
  5. Paste the ID of the classification in TaxonomyId field.
  6. In field FieldName, enter the programmatic name of the field that you created for the custom classification.
    For example, if you create a custom classification field for Geographic Regions, in the FieldName input field you enter GeographicRegions
    The purpose of this property is to specify which hierarchical taxonomy will be used, because there might be more than one.

    NOTE: This is different than the single item name, for example Geographic region. In addition, you cannot use empty spaces in the FieldName input field.

  7. To further configure the widget, perform Step 2 to Step 4 of the above procedure.

Additional resources

ARTICLES

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

Web Security for Sitefinity Administrators

The free standalone Web Security lesson teaches administrators how to protect your websites and Sitefinity instance from external threats. Learn to 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?

Next article

Tags widget