Copied to clipboard

Flag this post as spam?

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


  • Hua Min 2 posts 72 karma points
    Mar 18, 2023 @ 02:11
    Hua Min
    0

    How to display all images in media folder to gallery?

    Now want to make a gallery and if I upload a gallery folder in media . All images should have to display on web page.

    @inherits Umbraco.Cms.Web.Common.Views.UmbracoViewPage
     <section class="pad60">
        <div class="container">
          <div id="gallery" class="container-fluid">
    @for (int item = 1; item <= 31; item++)
    {  
      var url = "/img/gallery/gallery ("+item+").jpg";
      <a href="@url" class="example-image-link"
        data-lightbox="example-set" data-title="Click the right half of the image to move forward.">
        <img src="@url" class="example-image img-responsive">
      </a>
    }
    </div>
    <div id="myModal" class="modal fade" role="dialog">
      <div class="modal-dialog">
        <div class="modal-content">
          <div class="modal-body"></div>
        </div>
      </div>
    </div>
    

    This is current code now.

  • Birendra Kumar 1 post 72 karma points
    Mar 18, 2023 @ 13:53
    Birendra Kumar
    1

    Hi, Please modify your code as below.

    @{
    
        var mediaFolder = Umbraco.Media(1253); // Selected Folder
    foreach (var image in mediaFolder.Children) 
    {
        var url = "/img/gallery/gallery (" + image.Url() + ").jpg";
        <a href="@url" class="example-image-link"
       data-lightbox="example-set" data-title="Click the right half of the image to move forward.">
            <img src="@url" class="example-image img-responsive">
        </a>
    }
    }
    
  • Huw Reddick 1932 posts 6722 karma points MVP 3x c-trib
    Mar 18, 2023 @ 17:56
    Huw Reddick
    1

    The URL of your image should just be

    var url=image.Url();

  • Huw Reddick 1932 posts 6722 karma points MVP 3x c-trib
    Mar 19, 2023 @ 11:00
    Huw Reddick
    0

    Hi Hua,

    something like this should get you going, it will fetch images from a media folder called Gallery.

    @{
    var _mediaFolder = Umbraco.MediaAtRoot().DescendantsOrSelf<Folder>().First(f => f.Name == "Gallery");
    }
                            @if (_mediaFolder != null)
                            {
                                foreach (var image in _mediaFolder.Children)
                                {
                                    //make sure it isn't another folder
                                    if (image.Children != null && !image.Children.Any())
                                    {
                                                <img src="@image.Url()" class="example-image img-responsive" >
                                    }
                                }
                            }
    
  • This forum is in read-only mode while we transition to the new forum.

    You can continue this topic on the new forum by tapping the "Continue discussion" link below.

Please Sign in or register to post replies