Skip to content

How to add or edit templates for the Navigation widget

ElenaGaneva edited this page May 31, 2014 · 1 revision

The navigation widget has set of build-in templates. Using the property editor of the widget you can chose how pages are displayed inside the navigation. The default templates that are installed along with the Navigation widgets are:

  • Horizontal
  • Vertical
  • Tabs
  • Sitemap

Add new template:

In addition to the build-in templates anyone can add their custom template by following these steps:

  1. Create template file named “NavigationView.MyTemplateName” with extension .cshtml or .ascx
  2. Place it on one of the following locations: SitefinityWebApp\Mvc\Views\Navigation SitefinityWebApp\ResourcePackages[My package name]\MVC\Views\Navigation (for this case the widget will use the template only if it is placed on page or template which is based on the layout file from this package )

After step 2 you are ready to use the template without even rebuilding the project. The new template that you have created will be automatically displayed inside the property editor of the Navigation widget and you can choose it in order to base your template.

Edit existing templates:

You can find the default templates for the Navigation widget in the default package that we provide along with the widgets: https://github.com/Sitefinity/feather-packages

In order to use this package you can create folder named “ResourcePackages” on the root level in your application and then add the “Bootstrap” folder inside it.

Then when you go to the backend of the Sitefinity under Design/Page Templates you will notice that there is a template named “Bootsrap.default” which is created automatically based on this package.

Once you create page based on the template “Bootsrap.default” all of the styles, scripts and views for all of the widgets will be taken from the “Bootsrap” package if they exist there. Otherwise will fallback to our default resources. This way you can edit any of the templates from the “Bootsrap” package and the Navigation widget will start to use edited version instead of the default one.

Related topics:

https://github.com/Sitefinity/feather/wiki/How-to-change-MVC-widget-templates https://github.com/Sitefinity/feather/wiki/How-to-use-a-resource-from-a-package https://github.com/Sitefinity/feather-packages