Sign in Register
Go to solution
Copied to clipboard

Flag this post as spam?

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


  • Hubert Thalmann 57 posts 263 karma points
    Aug 25, 2016 @ 11:07
    Hubert Thalmann
    0

    Mediapicker in Combination with Lightbox Gallery

    Hello ourCommunity

    I have a Problem with the Mediapicker (with multiple images)

    i want to make a gallery with lightbox.

    i have 2 Document Types the first one is the bilder (german for images^^) and the bilder_item document type.

    enter image description here

    This is Bilder

    enter image description here

    and this is bilder_items

    now my Problem is how do i get the images-paths of all picked images of bilder_images into my bilder documenttype? (all picked images of "MediaIds")

    i think i have to make a macro and put : @Umbraco.RenderMacro("listBilder")

    into my "Bilder" Template.

    can someone give me a hint how i get the paths?

    thank you.

    enter image description here

    enter image description here

    Copy Link
  • David Peck 690 posts 1896 karma points c-trib
    Aug 25, 2016 @ 11:30
    David Peck
    1

    Can I suggest that you use Nested Content. This means that your bilder_items are items within a Bilder property rather than children.

    You then just need to do:

    @foreach(var bilderItem in Model.GetPropertyValue<IEnumerable<IPublishedContent>>("myLightboxGallery")){
    var mediaItem = Umbraco.TypedContent(bilderItem.GetPropertyValue<int>("mediaId"));
    <img src='@mediaItem.GetCroppedUrl(200, 300)' />
}

    Or something like that anyway

    Copy Link
  • Hubert Thalmann 57 posts 263 karma points
    Aug 25, 2016 @ 11:36
    Hubert Thalmann
    0

    what does the ("myLightboxGallery") stand for?

    forget about the lightbox gallery. I just want to have the paths of my images. For example you can get it out with <p>@item.xxx</p> or something like this.

    EDIT: i mean in an foreach like this:

    foreach(xxx)
{
<a href="@item.imagepath" data-lightbox="@item.gallerytitle"></a>
}

    no i don't use nested content.

    im working with this method: https://our.umbraco.org/documentation/tutorials/creating-basic-site/articles-parent-and-article-items

    Copy Link
  • David Peck 690 posts 1896 karma points c-trib
    Aug 25, 2016 @ 11:42
    David Peck
    1

    Ignore myLightboxGallery if you're sticking with your approach.

    So you'll need something like this:

    @foreach(var galleryItem in Model.Content.Children("bilder_item")){
    IEnumerable<int> mediaIds = galleryItem.GetPropertyValue<IEnumerable<int>>("mediaIds");
    IEnumerable<IPublishedContent> mediaItems = mediaIds.Select(i => Umbraco.TypeContent(i));
    foreach(var mediaItem in mediaItems){
        @mediaItem.Url
    }
}
    Copy Link
  • Hubert Thalmann 57 posts 263 karma points
    Aug 25, 2016 @ 11:52
    Hubert Thalmann
    1

    sorry i'm new to umbraco.

    now it says: there is no definition for "TypeContent"

    why?

    EDIT:

    is it right to make a Makro and then in my "Bilder" Template i make:

    @Umbraco.RenderMacro("listBilder")

    and the makro looks like this:

    @inherits Umbraco.Web.Macros.PartialViewMacroPage

@foreach(var galleryItem in Model.Content.Children("bilder_item")){
    IEnumerable<int> mediaIds = galleryItem.GetPropertyValue<IEnumerable<int>>("mediaIds");
    IEnumerable<IPublishedContent> mediaItems = mediaIds.Select(i => Umbraco.TypeContent(i));
    foreach(var mediaItem in mediaItems){
        @mediaItem.Url
    }
}
    Copy Link
  • David Peck 690 posts 1896 karma points c-trib
    Aug 25, 2016 @ 12:33
    David Peck
    1

    Because it should be TypedContent. Sorry

    Copy Link
  • Hubert Thalmann 57 posts 263 karma points
    Aug 25, 2016 @ 12:42
    Hubert Thalmann
    0

    oh, i didnt see that. thank you

    um now there is a new error now.

    enter image description here

    Copy Link
  • David Peck 690 posts 1896 karma points c-trib
    Aug 25, 2016 @ 12:47
    David Peck
    1

    I think that would suggest the property mediaIds is not returning an IEnumerable<int>. Outputing @galleryItem.GetProperty("mediaIds").Value.GetType() will probably tell you what it is.

    Copy Link
  • Hubert Thalmann 57 posts 263 karma points
    Aug 25, 2016 @ 12:37
    Hubert Thalmann
    0

    please help

    @inherits Umbraco.Web.Macros.PartialViewMacroPage


    @{ var selection = CurrentPage.Children.Where("Visible"); }

    @if (selection.Any())
    {
            @foreach (var item in selection)
            {
                   <a href="@item.MediaIds" data-lightbox="@item.galerietitel"></a>
            }
    }

    but the @item.MediaIds doesn't work :/

    it could be something like this.. not?

    Copy Link
  • David Peck 690 posts 1896 karma points c-trib
    Aug 25, 2016 @ 12:45
    David Peck
    1

    item.MediaIds I think is going to be a collection of ids rather than a single one but I could be wrong.

    You could try outputing @item.MediaIds.GetType() to tell. If I'm right than this might help: @foreach (var mediaId in selection.SelectMany(s => s.MediaIds)){ }

    However they will give you an id (e.g. 1001) not the URL that you're after. You'll need to first convert 1001 in to a media item

    var mediaItem = Umbraco.Content(mediaId)

    and then you'll need to get the URL of that item e.g.

    @mediaItem.Url

    It might be getting ahead of ourselves but you might want to output a URL that returns a scaled image (see here).

    Copy Link
  • Hubert Thalmann 57 posts 263 karma points
    Aug 25, 2016 @ 12:50
    Hubert Thalmann
    0

    no i don't need a scaled image.

    and outputing @item.MediaIds.GetType() gives: System.String

    or did i do something wrong?

    EDIT: @galleryItem.GetProperty("mediaIds").Value.GetType() is also System.String

    Copy Link
  • Hubert Thalmann 57 posts 263 karma points
    Aug 25, 2016 @ 13:00
    Hubert Thalmann
    0

    okay now i get it i think. If i make

    @inherits Umbraco.Web.Macros.PartialViewMacroPage


@{ var selection = CurrentPage.Children.Where("Visible"); }

@if (selection.Any())
{
        foreach (var item in selection)
        {
            @item.mediaIds
        }
}

    it puts out: 1197,1200,1198,11991197,11981199,1266,1200 etc. (image ID if i understood you right)

    and now how do i get the URLs out of that "array maybe?"

    Copy Link
  • Hubert Thalmann 57 posts 263 karma points
    Aug 25, 2016 @ 13:07
    Hubert Thalmann
    100

    i got it! finally^^

    @inherits Umbraco.Web.Macros.PartialViewMacroPage


@{ var selection = CurrentPage.Children.Where("Visible"); }

@if (selection.Any())
{
        foreach (var item in selection)
        {

    var caseStudyImagesList = (@item.mediaIds).Split(new string[] { "," }, StringSplitOptions.RemoveEmptyEntries);
    var caseStudyImagesCollection = Umbraco.Media(caseStudyImagesList);

    foreach (var caseStudyImage in caseStudyImagesCollection)
    {
        <img src="@caseStudyImage.Url" style="width:300px;height:300px" />
    }
        }
}

    thank you very much for supporting

    Copy Link
  • David Peck 690 posts 1896 karma points c-trib
    Aug 25, 2016 @ 13:08
    David Peck
    1

    I'm not sure TBH. You're using dynamics which I've not used for a while but let's go with this:

    @{ var selection = CurrentPage.Children.Where("Visible"); }

@foreach (var item in selection)
{
    foreach(var mediaId in (item.mediaIds ?? "").Split(',')){
        var mediaItem = Umbraco.Media(mediaId);
        if(mediaItem != null){
            <p>Url is @mediaItem.Url</p>
        }
    }
}
    Copy Link
  • Hubert Thalmann 57 posts 263 karma points
    Aug 25, 2016 @ 13:12
    Hubert Thalmann
    0

    oh yes this is the shorter version, thank you so much

    Copy Link
  • David Peck 690 posts 1896 karma points c-trib
    Aug 25, 2016 @ 13:14
    David Peck
    1

    Great. Well done

    Copy Link
Please Sign in or register to post replies

Write your reply to:

Draft