Skip to content

Commit

Permalink
Add grammar fixes to 15
Browse files Browse the repository at this point in the history
  • Loading branch information
sofietoft committed Feb 5, 2025
1 parent c5d6778 commit 189797e
Showing 1 changed file with 11 additions and 11 deletions.
22 changes: 11 additions & 11 deletions 15/umbraco-cms/fundamentals/design/templates/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,17 +4,17 @@ description: Templating in Umbraco builds on the concept of Razor Views from ASP

# Templates

Templates are the files that control the look and feel of the frontend of your Umbraco websites. Building on the concept of MVC Razor Views, template files enables you to structure your websites using HTML, CSS and JavaScript. When tied to a Document Type, templates are used to render your Umbraco content on the frontend.
Templates are the files that control the look and feel of the frontend of your Umbraco websites. Building on the concept of MVC Razor Views, template files enable you to structure your websites using HTML, CSS, and JavaScript. When tied to a Document Type, templates are used to render your Umbraco content on the frontend.

You can manage and work with your templates directly from the Settings section in the Umbraco backoffice. Each Template can also be found as `cshtml` files in the `Views` folder in your project directory.
You can manage and work with your templates directly from the Settings section in the Umbraco backoffice. Each Template can also be found as a `cshtml` file in the `Views` folder in your project directory.

## Creating Templates

When you are building an Umbraco website you can choose to automatically generate Templates when you create a new Document Type. This will ensure the connection between the two and you can jump straight from defining the content to structuring it.
When building an Umbraco website you can automatically generate Templates when you create a new Document Type. This will ensure the connection between the two and you can jump straight from defining the content to structuring it.

Choose the option called **[Document Type with Template](../../data/defining-content/README.md)** when you create a new Document Type to automatically create a Template as well.

In some cases, you might want to create independent Templates that doesn't have a direct connection to a Document Type. You can follow the steps below to create a new blank Template:
In some cases, you might want to create independent Templates that don't have a direct connection to a Document Type. You can follow the steps below to create a new blank Template:

1. Go to the **Settings** section inside the Umbraco backoffice.
2. Click **...** next to the **Templates** folder.
Expand All @@ -38,7 +38,7 @@ To use a Template on your content, you must first allow it on the content Docume

## Inheriting a Template

A Template can inherit content from what is called a "Master Template". This is done by using the ASP.NET views Layout feature.
A Template can inherit content from a "Master Template". This is done by using the ASP.NET views Layout feature.

Let's say you have a Template called **MainView**, containing the following HTML:

Expand Down Expand Up @@ -71,7 +71,7 @@ Follow these steps to use a Template file as a Master Template:

Alternatively, you can manually change the value of the `Layout` variable in the Template using the name of the Template file.

The updated markup will look something like the snippet below and the Template is now refered to as a *Child Template*:
The updated markup will look something like the snippet below and the Template is now referred to as a *Child Template*:

```csharp
@inherits Umbraco.Web.Mvc.UmbracoViewPage
Expand All @@ -81,7 +81,7 @@ The updated markup will look something like the snippet below and the Template i
<p>My content</p>
```

When a page that uses a Template with a Master Template defined is rendered, the HTML of the two template is merged.
When a page that uses a Template with a Master Template defined is rendered, the HTML of the two templates is merged.

The code from the Template replaces the `@RenderBody()` tag in the Master Template. Following the examples above, the final HTML will look like the code in the snippet below:

Expand All @@ -101,7 +101,7 @@ The code from the Template replaces the `@RenderBody()` tag in the Master Templa

## Named Sections

Template Sections give you added flexibility when building your templates. Use the Template Section together with a Master Template setup, to decide where sections of content is placed.
Template Sections give you added flexibility when building your templates. Use the Template Section together with a Master Template setup, to decide where sections of content are placed.

If a Child Template needs to add code to the `<head>` tag a Section must be defined and then used in the Master Template. This is made possible by [Named Sections](https://www.youtube.com/watch?v=lrnJwglbGUA).
Expand Down Expand Up @@ -150,12 +150,12 @@ For instance, if you want to be able to add HTML to your `<head>` tags, you woul
</html>
```

You can decide whether a section should be mandatory or not. Making a section mandatory means that any templates using the Master Template is required to have the section defined.
You can decide whether a section should be mandatory or not. Making a section mandatory means that any template using the Master Template is required to have the section defined.

To make the section mandatory, you have two options:

* Check the **Section is mandatory** field when using the **Sections** dialog in the backoffice.
* Add `true` to the code tag like shown in the example below.
* Add `true` to the code tag as shown in the example below.

```csharp
@RenderSection("Head", true)
Expand All @@ -167,7 +167,7 @@ To make the section mandatory, you have two options:

Another way to reuse HTML is to use partial views - which are small reusable views that can be injected into another view.

Like templates, create a partial view, by clicking **...** next to the **Partial Views** folder and selecting **Create**. You can then either create an empty partial view or create a partial view from a snippet.
Like templates, you can create a partial view, by clicking **...** next to the **Partial Views** folder and selecting **Create**. You can then either create an empty partial view or a partial view from a snippet.

![Create partial](images/create-partial.png)

Expand Down

0 comments on commit 189797e

Please sign in to comment.