Search.../
  1. APIs

items

Sets or gets the items in a gallery.

Description

Setting the items property sets the gallery items that make up the gallery.

Set items to an empty array ([]) to remove the current gallery items.

Getting the items property returns the current list of gallery items that make up the gallery.

You cannot modify the gallery item array in-place. To add, change, or remove individual gallery items:

  1. Store the value of the items property in a variable.
  2. Make changes to the gallery items array.
  3. Reset the items property with the modified array.

About ImageItem Items

An ImageItem is an object used by the Gallery properties items and currentItem to represent a single gallery image.

The src property of a ImageItem can be:

  • An image from the Media Manager.
  • An external image from any web location (some galleries do not support external images).

The image source format for Media Manager images is: wix:image://v1/<uri>/<filename>#originWidth=<width>&originHeight=<height>[&watermark=<watermark_manifest_string>]

About VideoItem Items

A VideoItem is an object used by the Gallery properties items and currentItem to represent a single gallery video.

A VideoItem can be used as an item in a Pro Gallery.

To determine if your gallery is a Pro Gallery or a standard gallery, hover over the gallery while it is not selected. The gallery type appears above the upper left corner of the gallery. If the type is "Wix Pro Gallery", then your gallery is a Pro Gallery. If the type is anything other than "Wix Pro Gallery", your gallery is a standard gallery.

The video source format is: wix:video://v1/<video_uri>/<filename>#posterUri=<poster_uri>&posterWidth=<width>&posterHeight=<height>

Notes:

  • You can only get the items of a Pro Gallery using the items property if you set its items using the items property or connect the gallery to a dataset first. If you set the gallery's items in the Editor, you are not be able to retrieve them with the items property. This limitation does not apply to standard galleries.

  • To determine if your gallery is a Pro Gallery, hover over the gallery while it is not selected. The gallery type appears above the upper left corner of the gallery. If the type is "Wix Pro Gallery", then your gallery is a Pro Gallery. If the type is anything other than "Wix Pro Gallery", the limitation described above does not apply to your gallery.

Type:

Array<ImageItem>

 | 

Array<VideoItem>
Read & Write

ImageItem

VideoItem

NAME
TYPE
DESCRIPTION
type
string

Item type. Value is "image".

slug
string

Item slug.

src
string

Image source URL.

description
string

Image description. Descriptions over 100 characters are truncated.

title
string

Image title.

link
string

URL of the image's clickable link. See here for more information about links.

Was this helpful?

Get the list of items and the first item's information

Copy Code
1let items = $w("#myGallery").items;
2

3let type = items[0].type;               // "image"
4let src = items[0].src;                 // "wix:image://v1/68d3a9_1de7529c444b4c9eb38401f8efe0cad2.jpg/flowers.jpg#originWidth=1970&originHeight=1120"
5let description = items[0].description; // "Description"
6let title = items[0].title;             // "Title"
7let link = items[0].link;               // "http"//wix.com"
Set the list of items for a gallery

Copy Code
1$w("#myGallery").items = [{
2  "type": "image",
3  "title": "A View",
4  "src": "wix:image://v1/99bc1c6f66444769b531221214c885ac.jpeg/A%20View.jpeg#originWidth=3264&originHeight=2448"
5}, {
6  "type": "video",
7  "description": "Another beautiful view",
8  "title": "Another View",
9  "src": "wix:video://v1/80c05f_e2c524db1f264178a8558c92dbf76fb0/_#posterUri=80c05f_e2c524db1f264178a8558c92dbf76fb0f000.jpg&posterWidth=1920&posterHeight=1080"
10}];
Add an item to a gallery

This example retrieves the items of a gallery, adds a new item, and then overwrites the old items.

Copy Code
1let items = $w("#myGallery").items;
2items.push( {
3  "src": "wix:image://v1/68d3a9_1de7529c444b4c9eb38401f8efe0cad2.jpg/flowers.jpg#originWidth=1970&originHeight=1120",
4  "description": "Description",
5  "title": "Title"
6} );
7$w("#myGallery").items = items;
8