Getting Umbraco Gallery to work...

Issue # 1 - Trying to render Display folders containing Non-Image items

If you've used the Gallery addon for Umbraco from Designit, and tried to display a Media folder that contains other folders, no doubt you've come across this message before:

Object reference not set to an instance of an object.

Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code. 

Exception Details: System.NullReferenceException: Object reference not set to an instance of an object.


The reason for this is that the code assumes that all Media items in the selected folder are Images, and doesn't do anything to filter out other items.

The solution is to add the following code snippet in the  the repImages_ItemDataBound event handler method:

            if (currentImage.ContentType.Alias != "Image")
            {
                e.Item.Visible = false;
                return;
            }

right after

            var currentImage = (Media)e.Item.DataItem;

Issue # 2 - Javascript include files are not automatically included in the page

The most common mistake that results in the Gallery not working as expected (ie, clicking on an image brings up the Lightbox) is to do with missing server-side form tags from your Master page.

Make sure you include the form element on as it's required by ASP.Net to register client side scripts properly:

  <form runat="server" id="form1">
    ..
  </form>

More information about this problem can be found here:

"The client-side script is emitted just after the opening tag of the Page object's <form runat= server> element. The script block is emitted as the object that renders the output is defined, so you must include both tags of the <script> element."

While you are at it, do yourself a favour and make sure your head tag includes the runat="server" attribute as well.  The Gallery package looks for the head tag and creates a new css link to include the lighbox css file.

Hope this helps you out, the second issue in particular was causing me grief before I finally turned to Microsoft's documentation, - I had some sites that would work, but others wouldn't.  It finally clicked that those that worked without me adding the necessary javascript links were using the form tag as mentioned above!

Post a comment