How to Implement Image Gallery

How to Implement Image Gallery

In this article, we will be showing an example how we can use other Javascript library other than Dojo Toolkit in WebClient and how to implement an image gallery using
1. Create a Plex grid function where one of the grid column contains image file name, for example APPLE.gif, FOOTBALL.gif
2. Set the grid control name template to WebImageGallery.ctrl
Control Name GridP:MainArea:template=WebImageGallery
3. Copy WebImageGallery.ctrl to your customtemplate project/src folder.
4. Copy your image files to images folder under web project/WebContent/images folder.
5. Open the WebClient URL in the browser

    • Related Articles

    • How to Display an Image in a Grid Cell

      1. Set the control name of the grid. 2. On the column name where you want to display the image, set the Text Property of the column heading as follows. <control name>:<grid control name>.ColumnsArea:template=WebImageGrid:<column heading text> ...
    • How to implement the WebClientMultisession Servlet

      By default WebClient can only maintain one WebClient session for the same browser, this causes that even if you open your WebClient application in multiple tabs, all of those tabs will share the same information, to change this you can use the ...
    • How to Display an Image and Text in the Same Grid Cell

      1. Set the control name of the grid. 2. For the column where you need the information from, you will need to set the column to visible but set the width to 0 and set the control name of the column. <controlname>:<column text> For example: ...
    • How to implement file viewer in WebClient using Office Web Viewer

      Reference How to implement the FileViewer.ctrl The FileViewer.ctrl template is applied over an edit control in your Plex panel, at ...
    • Implementing the WebImageGallery custom template

      This custom template is based on galleriajs and it is applying to a Grid control. Its functionality consists of displaying a gallery of images extracted from webproject/WebContent/images folder. To implement this control please follow the steps ...