Custom themes and templates: Create the CSS of the theme

To add the CSS code that defines the formatting rules for your template you must create the file in folder ~/App_Data/Sitefinity/WebsiteTemplates/Hospital/App_Themes/Green/Global under the Sitefinity CMS project. Name the file main.css.

For more information about the folder structure required by Sitefinity CMS, see Overview: Themes. For more information about structuring Telerik Hospital website, see Custom themes and templates: Preparing your work environment.

After adding the file to folder Global, you must define the classes that style the main elements in Telerik Hospital template.

Here is a sample code for customizing the MenuHeaderLogoSloganMain and Footer elements that were defined in

You are not limited to these rules and are free to change them to make your pages look and behave the way you want.

Use the following code to style the navigation menu in the header.

You are not limited to these definitions and can change them to meet your needs.

NOTE: You must add the images that you describe and use in the CSS in folder App_Themes/Green/documentation/images.

After you have defined the styling rules for the elements, you must assign the theme to your template. For more information see Overview: Themes.

The hospital class which you entered in the Wrapper CSS class (skin) field, when you Custom themes and templates: Add and configure the content widgets the navigation control in the template is now appended to the class of the control – RadMenu and the generated CSS selector that you can use is RadMenu_hospital.

Want to learn more?

Sign up for our free beginner training. Boost your credentials through advanced courses and certification.
Register for Sitefinity training and certification.

Was this article helpful?