Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Richard McKenna 5 posts 35 karma points
    Sep 18, 2019 @ 12:12
    Richard McKenna
    0

    Rendering Custom Media Types

    Hi, I have a custom media type called "SliderImages" which is based on an "Image" media type with a few extra fields. I'm using a Media Picker to select multiple "SliderImages" on a Document Type.

    I'm struggling to work out how to render them in a template. Based on the current documentation I should be able to use:

    var sliderImages = Model.Value<IEnumerable<IPublishedContent>>("sliderImages");
    @foreach (var imageItem in sliderImages)
            {
                <div class="ls-slide" data-ls="slidedelay: 4000; transition2d: 5;">
                    <img src="@imageItem.GetCropUrl(width: 1920, height: 680, imageCropMode: ImageCropMode.Crop)" class="ls-bg">
                    <div class="ls-l" style="width: 100%;">
                        <div class="container">
                            <div class="row">
                                <div class="col">
                                    <div class="slide-label @imageItem.Value("labelClass")">@imageItem.Value("title")</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            }
    

    But this returns the error on the first line:

    The value "Umbraco.Web.PublishedModels.SliderImage" is not of type "Umbraco.Web.PublishedModels.Image" and cannot be used in this generic collection. Parameter name: value'
    

    Any help would be much appreciated.

  • Andrew Hopkins 21 posts 133 karma points
    Sep 18, 2019 @ 12:53
    Andrew Hopkins
    0

    I was having a similar problem with the media cropper which all documentation pointed to using Model.Value in Umbraco 8. I omitted the .Value and this worked for me, just through trial and error. Hope it helps?

    @if (Model.HasValue("pageImage"))
    {
    <img src="@Url.GetCropUrl(Model, "pageImage", "banner")" class="img-responsive" style="width:100%;" />
    }
    <!-- Header Image -->
    
  • Richard McKenna 5 posts 35 karma points
    Sep 18, 2019 @ 13:25
    Richard McKenna
    0

    Thanks. I think the problem with this approach in my case is, that my property "SliderImages" is a collection of multiple images with the custom media type and that I need to iterate over in the foreach loop.

  • Nik 1614 posts 7260 karma points MVP 7x c-trib
    Sep 18, 2019 @ 13:29
    Nik
    0

    Try

    @Url.GetCropUrl(imageItem, "banner")
    

    According to intelisense that should work for you :-) The first parameter is a media item and the second is the crop you are after.

    It assumes that the file upload field on your media item has the alias of umbracoFile

    Thanks

    Nik

  • Richard McKenna 5 posts 35 karma points
    Sep 18, 2019 @ 13:37
    Richard McKenna
    0

    Hi Nik, it does not work.

    var sliderImages = Model.Value<IEnumerable<IPublishedContent>>("sliderImages");
    foreach (var imageItem in sliderImages)
    {
        @Url.GetCropUrl(imageItem, width: 1920, height: 680, imageCropMode: ImageCropMode.Crop)
    }
    

    Throws the same error as above on the first line

    The value "Umbraco.Web.PublishedModels.SliderImage" is not of type "Umbraco.Web.PublishedModels.Image" and cannot be used in this generic collection. Parameter name: value
    
  • Jonathan Distenfeld 105 posts 618 karma points
    Sep 18, 2019 @ 13:47
    Jonathan Distenfeld
    100

    Hi Richard,

    i think we need some more information in order to help you: Does your SliderImage DocType inherits from Image? Also could you check that the "Pick only Images" option in the media picker is disabled?

    ~ Jonathan

  • Richard McKenna 5 posts 35 karma points
    Sep 18, 2019 @ 13:55
    Richard McKenna
    1

    Hi Jonathan,

    I think you have found the issue. Yes SliderImage does inherit from Image.

    However I did have "Pick only Images" option enabled on the media picker. Disabling that option, my code above works.

    This seems to be a bit confusing. If SliderImage inherits from Image shouldn't "Pick only Images" still work with SliderImages?

    Also shouldn't having it enabled stop you from selecting the other types in the admin? Which it doesn't, I had it enabled and I was still able to select SliderImages with the media picker.

  • Jonathan Distenfeld 105 posts 618 karma points
    Sep 18, 2019 @ 14:00
    Jonathan Distenfeld
    0

    Yes you are right.

    If "Pick only Images" is not suposed to work for DocTypes inheriting from Image, they should not be pickable in the first place.

    So this sounds like an error in the Umbraco CMS.

    However, glad you got it Working!

Please Sign in or register to post replies

Write your reply to:

Draft