#Type and grid how to#

Use integer grids to represent discrete data and floating-point grids to represent continuous data. There are two types of grids: integer and floating point.

Additional features such as enquiry buttons, 'view more details' buttons, add to cart buttons, prices, and sold/available labelling.A grid is a raster data storage format native to Esri.

This can make the grids look quite different, so it may be worth experimenting with the image order, if you can

The range of images you have if the width and height vary a lot, this will change the look of your artwork grids.

The extra settings you have for alignment, number of columns, crop and aspect ratio when cropped.

The example below is with the ' uncropped' setting:Ī feature grid 'features' each image at a larger size on one side of the page, with the captions placed to the right-hand side. The example below is with the ' cropped' setting: Additional settings can be used to adjust the position of the image within this invisible box, to align it further with the caption. You will find these in the feature panel edit page > Grid settings > Grid type:Ī detail grid uses smaller images, the caption is placed beside the image and is designed to be roughly equal height to the image.Īn image grid is a standard format, with the image placed above the caption. In some feature panel grids, you will also be able to select a 'grid type', which includes additional layout options. The caption is below the slideshow panel. You will be able to click the arrows and thumbnails to browse through the artworks. One artwork and its caption will be central at any one time, and you can scroll sideways to feature the next artworks.Ī slideshow layout 'features' one image on top, with the next artworks previewed below in smaller icons. All images will be the same width and their height is determined by their individual aspect ratio.Ī slider layout brings together your artworks in a carousel.

Unless you have images that are all the same height and width, the height of different rows will not be the same.Ī scatter grid scatters your images around the page. This gives a tile effect similar to the tile grid, but horizontally, while keeping the vertical height the same across each single row. This grid is best suited to portrait orientation artworks/images.Ī flow grid places artworks/images into rows of the same height, with varying widths of the images (where applicable). The artworks will 'tile' into place from left to right, row by row, as the page is scrolled down. Therefore the exact order of the images may be slightly amended for these images to fit in and still look good. The vertical columns will be of equal width, and the images will slot into place in the order that looks best for your images. In the example below, the images are cropped, with an aspect ratio of 3:2 portrait, and 3 columns:Ī tile grid brings images together like vertical bricks. The standard grid is a flexible layout, where the images and captions are lined up in a grid, with further options for alignment of the images, cropping, aspect ratio, and ideal number of columns. This will be different for each of our themes.

From the dropdown box, the default grid type for your theme is marked. Find them in Settings > Settings > Artworks > Artworks grid layout.

These settings will affect your dynamic artworks page. This can make your grids look very different to other grids using the same 'grid type'. In these settings you can choose the alignment, ideal number of columns and the cropping. You will also have the chance to further customise your grids, using the grid settings. For example, some grids (such as flow grids or sliders), may better suit a group of horizontal or landscape orientation images. As each of these has a slightly different style, we recommend testing these with your particular set of images to find the best fit for your works. There are set options to choose from with our artwork grid styles.

#Type and grid how to#

Learn how to style your website's artwork grid and how the different options will look