Create Carousel in Umbraco v8

Creating slider in Umbraco

Section 1
Create Compositions

Step 1. Create folder called "Compositions"

Step 2. Create a folder inside the "Compositions" folder called "Slider".

Step 3. Create 2 composition (for image and title)

Title

Name: "Slide Title Controls"
Group Name: "Content"
Property Name: "Slide Title"
Property Editor: "Text String"

Image

Name: "Slide Image Controls"
Group Name: "Content"
Property Name: "Slide Image"
Property Editor: "Media Picker"

Section 2
Create Element Type

Step 1. Create folder called "Elements".

Step 2. Create "Document Type" called "Carousel Slider" in the "Pages" folder.

Step 3. Add "Slide Title Controls" and "Slide Image Controls" as compositions.

Section 3
Create Data Type

Step 1. Create "Data Type".

Name: "Main Carousel"

Property Name: "Carousel Slider"

Group: "Content"

Min Items: "0"

Max Items: "10"

Section 4
Create Document Type

Step 1. Create folder called "Pages".

Step 2. Create "Document Type" called "Home" in the "Pages" folder.

Step 3. Add "Carousel Slider" element.

Now assuming I also created the content for the Home page.

When I create the template and use

@inherits Umbraco.Web.Mvc.UmbracoViewPage @using Umbraco.Web.Models @{ Layout = "Master.cshtml"; var items = Model.Value<IEnumerable<IPublishedElement>>("slideCarousel"); foreach (var item in items) { var title = item.Value<string>("slideTitle"); if (!string.IsNullOrEmpty(title)) { <p>@Html.Raw(Html.ReplaceLineBreaks(title))</p> } }

Result: Line 13: @foreach (var item in items.ToList()) [NullReferenceException: Object reference not set to an instance of an object.]

I got this peace of code from documentation.

Even when I check if "Main Carousel" != null Anybody know a solution.

Copy Link

Huw Reddick 1929 posts 6697 karma points MVP 2x c-trib

May 28, 2021 @ 20:03

Your code snippet and your error don't match, so what exactly did your code look like when you got the error? since your code snippet does not have that line in it!

@foreach (var item in items.ToList()) [NullReferenceException: Object reference not set to an instance of an object.]

Copy Link

TooensureMaster 4 posts 25 karma points

May 28, 2021 @ 20:25

My Compositions enter image description here

My Element enter image description here

My Data Type enter image description here

My Home Document Type enter image description here

Home Content enter image description here

Home Template enter image description here

The Error im getting enter image description here

Problem is defiantly with this part of code. maybe there's something in the back-office I may have messed up.

var items = Model.Value<IEnumerable<IPublishedElement>>("mainCarousel");

and yes site works perfectly when removed.

Copy Link

Huw Reddick 1929 posts 6697 karma points MVP 2x c-trib

May 29, 2021 @ 06:10

Can't see anything obviously wrong, your code looks pretty much identical to what I have.

If you stick a break point on line 7 what does it think Model.Value("mainCarousel") actually is ?

Copy Link

is working on a reply...

Flag this post as spam?

Create Carousel in Umbraco v8

Creating slider in Umbraco