Fork me on GitHub
2sxc Learn Razor
DotNetNuke tools to create, design and animate great content
You are here: Home  >  Razor Basics

Simple Razor Power-Templates

The following templates show a simple Razor-Feature that wouldn't be possible using Tokens. These are things like conditions, loops and more. Enjoy!

Example with if-statement

To understand what this does, click on look-inside. It basically demonstrates an if-statement which work like this

  •  @if( condition ) { what happens } else { what happens otherwise }

Note that between the { ... } it's not always clear whether your code is a variable or text which should be shown. When in doubt (or when you see errors) put some HTML around your output like <span>didn't find it</span>. If the html is undesirable, use <text>didn't find it</text> so that Razor knows that this is just output. the <text> won't be shown.

I found a link! it goes to http://www.2sic.com/

Example text-replace

This sample takes this text you see right here and replaces a part of it with the current year to pretend that it was just updated yesterday. So the content actually has a %yesterday% which will be replaced with yesterdays date.

This was updated on 12/12/2018

Example with a simple loop

Sometimes as a project grows, suddenly you get additional requirements which could be solved very easily. For example, assume your editor suddenly said he needs to be able to add 1 or 5 or even 27 links, but it should be very simple to do and he's not going to pay money, so you better find a quick-and-dirty solution. So you tell him "no problem, just add all the links in the link field and separate them with a comma, my script will do the rest". This is what this demo does.

Example with a variable

This example would show a message if this text was more than 100 chars long.
note: message was 76 characters long

Look inside

Content Item

These are the values a content-editor can manage.
Name Type Value
Title System.String Example with a variable
Content System.String This example would show a message if this text was more than 100 chars long.
Link System.String


Presentation Item

These are additional, optional presentation instructions a content-editor can manage. If none are entered, a default set (predefined by the designer) will be used.

No Presentation parameters specified, using default presentation for this item.


Template file

@{
	var ContentToShow = "Text is too long (more than 100 characters)";
	if(Content.Content.Length <= 100) {
		ContentToShow = Content.Content;
	}
}
<div class="BasicContentWithPreview sc-element">
	@Html.Raw(Content.Toolbar)
	<div class="c_DNN6 c_DNN6_Header">
		<h1 class="Title Purple"><span>@Content.Title</span></h1>
	</div>
	<div>
	@Html.Raw(ContentToShow)
	</div>
	<div>note: message was @Content.Content.Length characters long</div>
</div>

Look inside

Content Item

These are the values a content-editor can manage.
Name Type Value
Title System.String Example with a simple loop
Content System.String Sometimes as a project grows, suddenly you get additional requirements which could be solved very easily. For example, assume your editor suddenly said he needs to be able to add 1 or 5 or even 27 lin...
Link System.String http://www.2sic.com,http://www.2sexycontent.org,http://www.sphosting.ch


Presentation Item

These are additional, optional presentation instructions a content-editor can manage. If none are entered, a default set (predefined by the designer) will be used.

No Presentation parameters specified, using default presentation for this item.


Template file

<div class="BasicContentWithPreview sc-element">
	@Html.Raw(Content.Toolbar)
	<div class="c_DNN6 c_DNN6_Header">
		<h1 class="Title Purple"><span>@Content.Title</span></h1>
	</div>
	@Html.Raw(Content.Content)
	<div>
		@if(Content.Link != ""){
			<ol>
			@foreach(var link in Content.Link.Split(',')){
				<li><a href="@link.Trim()">@link</a></li>
			}
			</ol>
		}
	</div>
</div>

Look inside

Content Item

These are the values a content-editor can manage.
Name Type Value
Title System.String Example text-replace
Content System.String <p>This sample takes this text you see right here and replaces a part of it with the current year to pretend that it was just updated yesterday. So the content actually has a %<em>yesterday</em>% whic...
Link System.String


Presentation Item

These are additional, optional presentation instructions a content-editor can manage. If none are entered, a default set (predefined by the designer) will be used.

No Presentation parameters specified, using default presentation for this item.


Template file

<div class="BasicContentWithPreview sc-element">
	@Html.Raw(Content.Toolbar)
	<div class="c_DNN6 c_DNN6_Header">
		<h1 class="Title Purple"><span>@Content.Title</span></h1>
	</div>
		@Html.Raw(Content.Content.Replace("%yesterday%", DateTime.Today.AddDays(-1).ToString("d")))
</div>

Look inside

Content Item

These are the values a content-editor can manage.
Name Type Value
Title System.String Example with if-statement
Content System.String <p>To understand what this does, click on look-inside. It basically demonstrates an if-statement which work like this</p> <ul> <li>&nbsp;@if( <em>condition</em> ) { <em>what happens</em> } else ...
Link System.String http://www.2sic.com/


Presentation Item

These are additional, optional presentation instructions a content-editor can manage. If none are entered, a default set (predefined by the designer) will be used.

No Presentation parameters specified, using default presentation for this item.


Template file

<div class="BasicContentWithPreview sc-element">
	@Html.Raw(Content.Toolbar)
	<div class="c_DNN6 c_DNN6_Header">
		<h1 class="Title Purple"><span>@Content.Title</span></h1>
	</div>
		@Html.Raw(Content.Content)
		@if(Content.Link == ""){
			<span>I didn't find a link!</span>
		}
		else
		{
		<span>I found a link! it goes to <a href="@Content.Link" target="_blank">@Content.Link</a></span>
		}
</div>
2serve . 2invent . 2create is 2be.