>, Tutorials>Custom gallery pages

Custom gallery pages

Gallery manager lets you choose from a number of view styles – or layouts – for different types of galleries. If the available view styles do not meet your requirements, then you can create up to seven different gallery templates with the code editor.

Recommended reading

Introduction

In the code editor you’ll find seven templates that you can use for your custom gallery pages. The first one (#10) is intended for “feature” type galleries. This is described in a separate article. Templates 54,55,and 56 use the normal thumbnail templates that are also used in your search results pages, lightbox pages and the standard gallery pages. Templates 57,58 and 59 do not use these thumbnail templates, but let you display thumbnails using one of the “gallery list” sub-templates.

Gallery templates that use thumbnail sub-templates

Templates 54, 55 and 56 display the gallery thumbnails by use of the thumbnail templates that are also used to e.g. display search results, standard galleries and lightboxes. That means that the thumbnails will look like they do on the other website pages without having to change anything or without having to write additional script. All functions, such as “add to lightbox”, “add to order” and so on will work also – and user permissions, restrictions and so on are taken into account. Note that you can configure the thumbnail templates with several backoffice settings and that you also override the standard templates by creating custom versions yourself.
The tag that you need to insert the thumbnails into the page is:

Note that you can use this tag only in templates 54, 55 and 56. The HTML will use the user’s current settings. E.g. small thumbnails, 40 thumbnails per page and so on. If however you want to force a certain view style when the gallery is loaded, then you can achieve this by adding parameters to the tag, for example:

The viewstyle:0 parameter forces the normal grid thumbnail sub-template to be used. Note that you should specify a thumbnail style that is enabled in back office.
You can enable/disable thumbnail view styles via Site configuration > Thumbnail pages > Page layout. Use parameter 0 for Grid, 1 for List, 2 for Mini, 3 for Large or 4 for Flow.
The styleoption:0 parameter selects the first items-per-page item that is configured in back office. E.g. value 0 for 15 thumbnails per page, value 1 for 30 thumbnails per page and so on.

The user will of course still be able to change the layout, provided that you include the functions for this (i.e. pagination toolbars with a layout button, items per page buttons et cetera). You can configure the pagination toolbars in back office and you can also create custom versions for this which is explained in the article: Custom pagination bars for thumbnail pages.

Gallery templates that use the gallery list sub-templates

Templates 57, 58 and 59 display the gallery thumbnails by use of the gallery list sub-templates. You can insert the thumbnails in your page with the tag:

The listtemplate:4 parameter in the above example is used to tell the gallery(‘gallerythumbnails’) function to render the HTML for the thumbnails using list template 4 (#154). You can use any of the five list templates (with id’s 151 up to 155). Note that you can’t use any of the slot tags in these sub-templates.

Configuring Gallery manager to use your custom template

In Gallery manager, find the gallery that you want to change and then open its properties. In the Layout for this gallery dropdown box, select the template that you have created and then save the properties. To make all galleries in a group use this template, select the gallery group and click on Update gallery settings. This will open a dialog that lets you select a template to use for all galleries in the group.

Testing a custom gallery page

To test your template without changing settings in the Gallery manager, open a normal gallery page and add the layout parameter to the URL. For example:

The layout=0 parameter forces gallery template/layout 0 to be used – which is the standard gallery grid layout. If you open the properties of a gallery in Gallery manager, you can see the layout numbers for each of the layouts, they are as follows:

  1. Default thumbnail layout
  2. Full screen slideshow 1024 pixels scaled – no watermarks
  3. List large photos without pagination (blog post style)
  4. Biography style layout (max 100 files)
  5. Feature page layout
  6. Custom page 1 (slot thumbnails)
  7. Custom page 2 (slot thumbnails)
  8. Custom page 3 (slot thumbnails)
  9. Custom page 4 (list thumbnails)
  10. Custom page 5 (list thumbnails)
  11. Custom page 6 (list thumbnails)

So to force the layout of custom page 1 using slot thumbnails, use e.g.

2018-04-04T15:19:43+02:00 April 4th, 2018|Categories: Customisation, Tutorials|Tags: , , , |