Create the Home page

The home page, displays summary information for all countries and most popular hotels. It also gives option for quick access to different cities of countries.

Display the list of countries 

To do this drop the Countries widget and set the list view widget template to My vacation - List of countries - With Thumbnail template. This template shows different countries with a picture and number of cities.

The following screenshot shows the display of Countries widget:

travelling agency2 

Use the following markup for My vacation - List of countries - With Thumbnail template:

  • To get the effect of displaying small images in the list view, you can apply specific thumbnail profile to the image using the MediaContentExtensions.ResolveThumbnailUrl with the thumbnail profile name v230-230.
  • Each country displays the number of cities in it using the public API for working with child items DynamicContentExtensions.
    For more information, see For developers: Hierarchical types API.
    One of the methods that the API provides is for getting child items count of an item. You must provide the child item type. 

Display a list of the most popular hotels

To do this, drop the Hotels widget and set the list view widget template to My vacation - List of hotels - With Thumbnail template. Similarly, to the countries widget template, the hotels list template shows images with thumbnails from of hotel and information about the location and star index of the hotel. As Hotel is child type of City, which is a child type of Country, it means that, by default, hotels from all cities from all countries are displayed. To show only popular hotels, apply filtering by tag popular.

The following screenshot shows the display of Hotels widget:

travelling agency3
Use the following markup for My vacation - List of hotels - With Thumbnail template:

Display all destinations 

You can display a list of countries and each country’s cities using the hierarchical items API. To do that, drop the Countries widget on the page and set the list view widget template to My vacation - List of countries with cities template.

The following screenshot shows the display of Countries widget:

travelling agency4

Use the following markup for My vacation - List of countries with cities template:

  • To display all cities from a country, you can use the auto generated property Cities to access all child items.
    When child type is added to the module structure, Sitefinity CMS generates automatically property descriptors for each child type and enables you to get all child items via simple Eval statement. 
    In this case, you can use Eval("Cities") as a DataSource of an asp:Repeater control.
    For more information, see For developers: Property descriptor.
  • In the ItemTemplate of the repeater control, you will need a simple way to display a link to a page with the details of the item. For this purpose you can get the default URL of the items using the GetDefaultLocation extension method in the multiple child types API. If you need to redirect to another page and not the default one for the item, you can use the GetLocationAtIndex method in the API and provide the specified index for the position. 

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?