Features

in this starter kit

Rich Text Row

There is a simple rich text row for writing your usual formatted content in a WYSIWIG style with the usual settings including but not limited to: 

Bold

Italic

Left align

Right align

  • Bulleted List
  1. Ordered List

Image Row

You can use the image row to render a full width image.

A phone next to a binder and a pen

Image Row Example

Video Row

This lets you embed a YouTube video by just entering the normal URL of the video, and it just renders the preview image of it at first. Then when you click on it, it loads it in as the iframe, which is better for the end user as it doesn't download all of the YouTube assets until it is needed.

What's next in C# - Mads Torgersen @ Umbraco Codegarden 2022

Code Snippet Row

There is a code snippet row to enable you to easily share code snippets in your website.

@inherits UmbracoViewPage<BlockListItem>
@using Umbraco.Cms.Core.Models.Blocks

@{
    var row = Model.Content as CodeSnippetRow;
    var settings = Model.Settings as CodeSnippetRowSettings;
    if (settings?.Hide ?? false) { return; }

    SmidgeHelper.RequiresJs("~/clean-assets/js/highlight.default.min.css");
    SmidgeHelper.RequiresJs("~/clean-assets/js/highlight.min.js");
}

<div class="row clearfix">
    <div class="col-md-12 column">
        <pre><code>@row.Code</code></pre>
    </div>
</div>

Code from the codeSnippetRow.cshtml file

Image Carousel Row

You can add a simple image carousel to a page by using the Image Carousel Row. In this row you have a multi image picker and you just choose the images you want to display.

  • A room filled with chairs and some lamps
  • A wireless keyboard and mouse next to some note books and pens.
  • A phone next to a binder and a pen
  • A room with some chairs, stools, settee and a triangular table.
  • Members of the Umbraco community in the front row at a talk at Codegarden
  • Authors who have written for the popular Umbraco magazine called skrift, all gathered on stage for a group photo.