> ## Documentation Index
> Fetch the complete documentation index at: https://zuperinc-section23.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Jobs Gallery

> The new Job Gallery feature on the Job Details page brings all your job-related media into one seamless, unified view.

The **Gallery** feature in Zuper provides a centralized, visual workspace for managing all job-related media. Instead of navigating through multiple sections such as Checklists, Notes, or Attachments, users can now view every photo and video associated with a job in one organized location.

**Prerequisite**: Ensure that the “**Enable Job Gallery**” setting is toggled On in the Job Settings under the General tab. You can access this by navigating to **Settings** from the left navigation menu, then selecting **Modules** > **Jobs** > **General Job Settings**.

<img src="https://mintcdn.com/zuperinc-section23/SKKb6f9DDJ0fPs7S/images/jobgallery.png?fit=max&auto=format&n=SKKb6f9DDJ0fPs7S&q=85&s=a1dd76864cf7dbab5193c14c67fd58de" alt="Jobgallery Pn" width="1918" height="664" data-path="images/jobgallery.png" />

## Master Tags

Before exploring the Gallery feature in the Job Details page, it’s important to set up Master Tags to keep the Job Gallery structured, searchable, and easy to navigate.

Without standardized tags, the Gallery can become cluttered and hard to manage. Master Tags ensure consistent labeling, cleaner organization, and easier filtering- making it simple for teams to find the images they need.

### Creating Master Tags

1. Navigate to the **Settings** module from the left navigation menu.
2. Click **Miscellaneous** and select **Master Tags**. The Master Tags listing page appears, displaying existing tags along with the modules they are associated with.

<img src="https://mintcdn.com/zuperinc-section23/JYgzSDtQMIN9yYRT/images/mastertags.png?fit=max&auto=format&n=JYgzSDtQMIN9yYRT&q=85&s=737503f889e3aea5f6935615b89603ad" alt="Mastertags Pn" width="1920" height="660" data-path="images/mastertags.png" />

3. Click **+ New Tag** to create a new tag.

<img src="https://mintcdn.com/zuperinc-section23/_VtbsMD9sQOJ0i4N/images/Galw0.png?fit=max&auto=format&n=_VtbsMD9sQOJ0i4N&q=85&s=50c9b9c3346da7fb32a48622cee37a0a" alt="Galw0 Pn" width="1920" height="878" data-path="images/Galw0.png" />

4. Enter the following details:
   * **Tag Name:** Provide a unique tag name. *(Mandatory)*
   * **Choose Module:** Select **Gallery** from the dropdown. *(Mandatory)*
   * **Description:** (Optional) Add a brief description for reference.
5. Click **Create** to add the tag.

<img src="https://mintcdn.com/zuperinc-section23/_VtbsMD9sQOJ0i4N/images/Galw1.png?fit=max&auto=format&n=_VtbsMD9sQOJ0i4N&q=85&s=40d608aad25230a813a6465e0dbea493" alt="Galw1 Pn" width="1920" height="874" data-path="images/Galw1.png" />

3. The tag is created successfully. Once created, the tag becomes available for use in the Job Gallery across the web and mobile apps.

<img src="https://mintcdn.com/zuperinc-section23/_VtbsMD9sQOJ0i4N/images/Galw2.png?fit=max&auto=format&n=_VtbsMD9sQOJ0i4N&q=85&s=0bbd81ac65d947ce753e0725d74e9f54" alt="Galw2 Pn" width="1918" height="866" data-path="images/Galw2.png" />

<Tip>
  Tip: On the Master Tags listing page, use filters to quickly view only the tags associated with the Gallery module. Click Clear anytime to remove the filter and view all tags.
</Tip>

<img src="https://mintcdn.com/zuperinc-section23/SKKb6f9DDJ0fPs7S/images/jobfilter.png?fit=max&auto=format&n=SKKb6f9DDJ0fPs7S&q=85&s=4a91005f51fd103a4054084e61b163ae" alt="Jobfilter Pn" width="1920" height="583" data-path="images/jobfilter.png" />

# Explore Job Gallery - Web

1. Select the “**Jobs**” module from the left navigation menu and click any jobs to view the details page.

<img src="https://mintcdn.com/zuperinc-section23/_VtbsMD9sQOJ0i4N/images/GJ1.png?fit=max&auto=format&n=_VtbsMD9sQOJ0i4N&q=85&s=7a727916f574913efce88ba5726a8cf1" alt="GJ1 Pn" width="1894" height="858" data-path="images/GJ1.png" />

2. Under Navigation, click the **Gallery** tab to view all media in a grid layout.

<img src="https://mintcdn.com/zuperinc-section23/_VtbsMD9sQOJ0i4N/images/GJ2.png?fit=max&auto=format&n=_VtbsMD9sQOJ0i4N&q=85&s=ed85c81bc0bc3ddbd5a947670d51d3c6" alt="GJ2 Pn" width="1907" height="874" data-path="images/GJ2.png" />

## Available Actions within the Gallery

The **Gallery** feature allows you to view, organize, and manage all media associated with a job. You can filter, download, group, and update media details for better organization and accessibility.

### Filtering Media

You can refine the media displayed using filters:

* **Select Date Range** – filter media by a specific date range.

<img src="https://mintcdn.com/zuperinc-section23/OLSMQOFMhi7KJPq1/images/gallerydate.png?fit=max&auto=format&n=OLSMQOFMhi7KJPq1&q=85&s=3144dfc419628ae80b5fa1dd9f1ed16d" alt="Gallerydate Pn" width="1447" height="840" data-path="images/gallerydate.png" />

* **Filter icon** – refine media further by:
  1. **Type** – Photo, Video, or Any Type.
  2. **User** – media uploaded by specific users.
  3. **Tags** – filter media by assigned tags.

<img src="https://mintcdn.com/zuperinc-section23/OLSMQOFMhi7KJPq1/images/galleryfilter.png?fit=max&auto=format&n=OLSMQOFMhi7KJPq1&q=85&s=b98804d610877762ff5b88d8d4c3cab9" alt="Galleryfilter Pn" width="1650" height="869" data-path="images/galleryfilter.png" />

### Downloading Media

* **Single Image Download:** Click the **Download** icon on an individual image.
* **Multiple Image Download:** Select multiple images and click the **Download** button from the bottom bar.

<img src="https://mintcdn.com/zuperinc-section23/OLSMQOFMhi7KJPq1/images/gallerydownload.png?fit=max&auto=format&n=OLSMQOFMhi7KJPq1&q=85&s=a381ab781a957cd836e64a0c1ca42b6e" alt="Gallerydownload Pn" width="1458" height="803" data-path="images/gallerydownload.png" />

### Adding Media to an Album

* Select one or more images and click **Add to Album** from the bottom bar to organize media into albums.

<img src="https://mintcdn.com/zuperinc-section23/OLSMQOFMhi7KJPq1/images/galleryalbum.png?fit=max&auto=format&n=OLSMQOFMhi7KJPq1&q=85&s=22ac5dc6f270d199c860dfafb119a5d8" alt="Galleryalbum Pn" width="1447" height="876" data-path="images/galleryalbum.png" />

### Grouping Media

You can group media by:

* **Date** – view media based on the upload date.
* **User** – view media uploaded by specific users.

<img src="https://mintcdn.com/zuperinc-section23/OLSMQOFMhi7KJPq1/images/gallerygroup.png?fit=max&auto=format&n=OLSMQOFMhi7KJPq1&q=85&s=916a4b05fd33cf0f8fb174681a6d08d6" alt="Gallerygroup Pn" width="1457" height="802" data-path="images/gallerygroup.png" />

### Viewing and Updating Media Details

Click an image to view and update the following details:

* **Uploaded by** – see who added the media.
* **Date & Time** – view when the media was uploaded.
* **Media Name** – view the name of the media file.
* **Visibility** – set as Internal or Public.
* **Copy Link** – copy the media link.
* **Tags & Description** – add or update tags and description.

<img src="https://mintcdn.com/zuperinc-section23/4f4X5JBG5RSD0AHv/images/tags4.png?fit=max&auto=format&n=4f4X5JBG5RSD0AHv&q=85&s=1c0dc8177c7506b761a3261667ca7549" alt="Tags4 Pn" width="1911" height="564" data-path="images/tags4.png" />

**Steps to add tags & description**

<Tabs>
  <Tab title="Adding Tags">
    * Under Tags, click the + icon to add tags.  An **Update Tags** dialog box appears.

          <img src="https://mintcdn.com/zuperinc-section23/Z6OPyKZNjxPolme9/images/Tag.png?fit=max&auto=format&n=Z6OPyKZNjxPolme9&q=85&s=8f92c741106af0f12bdb6a377ccc0966" alt="Tag Pn" width="1911" height="564" data-path="images/Tag.png" />

    * Choose the tags from the dropdown menu and click **Update** to add them.  To know how to configure tags, see [above](https://docs.zuper.co/Work_Order_Management/Jobs/Jobs_gallery#creating-master-tags).

          <img src="https://mintcdn.com/zuperinc-section23/4f4X5JBG5RSD0AHv/images/tags2.png?fit=max&auto=format&n=4f4X5JBG5RSD0AHv&q=85&s=410fb4f36965878f4c6bc443a6a90d11" alt="Tags2 Pn" width="1805" height="713" data-path="images/tags2.png" />
  </Tab>

  <Tab title="Adding Description">
    * Under Description, add your description or click the edit icon to update the existing description as needed, and click “**Save**.”

          <img src="https://mintcdn.com/zuperinc-section23/4f4X5JBG5RSD0AHv/images/tags3.png?fit=max&auto=format&n=4f4X5JBG5RSD0AHv&q=85&s=56ca7671fa6ae25082ca446742f2d241" alt="Tags3 Pn" width="1674" height="562" data-path="images/tags3.png" />
  </Tab>
</Tabs>

# Explore Jobs Gallery-Mobile

The **Job Gallery** in the Zuper mobile app allows field technicians to capture, upload, view, and manage all photos and videos associated with a job. This centralized view ensures that technicians can document job progress accurately and apply tags for easy filtering and retrieval.

## Accessing the Job Gallery

1. Open the **Zuper Field Service App** on your mobile device.
2. Select the Jobs module from the hamburger menu.

<img width="250" height="200" src="https://mintcdn.com/zuperinc-section23/0LScPGUm2ROwokmI/images/MGJ1-portrait.png?fit=max&auto=format&n=0LScPGUm2ROwokmI&q=85&s=3d8381050b4e7fb543077b5e5f94f81f" data-path="images/MGJ1-portrait.png" />

2. Choose any one of the jobs from the job listing page to view its details.

<img width="250" height="200" src="https://mintcdn.com/zuperinc-section23/0LScPGUm2ROwokmI/images/MGJ2-portrait.png?fit=max&auto=format&n=0LScPGUm2ROwokmI&q=85&s=07290623fba818579a9bd84282b4b831" data-path="images/MGJ2-portrait.png" />

3. Tap the **Gallery** tab.

<img width="250" height="200" src="https://mintcdn.com/zuperinc-section23/0LScPGUm2ROwokmI/images/MGJ3-portrait.png?fit=max&auto=format&n=0LScPGUm2ROwokmI&q=85&s=b4f6cece01ec294d18af89c5cb05a79a" data-path="images/MGJ3-portrait.png" />

4. The Gallery displays all images and videos previously added to the job.

<img width="250" height="200" src="https://mintcdn.com/zuperinc-section23/0LScPGUm2ROwokmI/images/MGJ4-portrait.png?fit=max&auto=format&n=0LScPGUm2ROwokmI&q=85&s=57206422b20edc2ddb19a4a494f7780d" data-path="images/MGJ4-portrait.png" />

## Viewing Details

1. Tap any image or video in the Gallery grid to open it in full-screen view.
2. The selected media opens along with its associated details.
3. If required, you can add or update the **Description** and **Tags**, then tap **Save**.

<img src="https://mintcdn.com/zuperinc-section23/aukfBnGLLjz4b2cl/images/VMG.png?fit=max&auto=format&n=aukfBnGLLjz4b2cl&q=85&s=d60e0129f1dba1d50befddfc3b784cb7" alt="VMG Pn" width="1530" height="3036" data-path="images/VMG.png" />

<Note>
  Note: Tags can be added or updated **only for images**, not for videos.
</Note>

## Capturing or Uploading Images

You can add new images/videos to the job using two methods:

### 1. Capture a Photo/Video Using a Camera

* In the **Job’s** **Gallery** tab, tap the **Camera** icon to open the Zuper Camera Component.

<img src="https://mintcdn.com/zuperinc-section23/JYgzSDtQMIN9yYRT/images/nomedia.png?fit=max&auto=format&n=JYgzSDtQMIN9yYRT&q=85&s=17ca1a6ac880d6b95655fbb0c5eba9e6" alt="Nomedia Pn" width="1530" height="3036" data-path="images/nomedia.png" />

* Take a photo or record a video. Adjust camera settings (e.g., flash, zoom) for optimal image quality.
* Tap the **Tag** icon (if required) to apply tags before saving.

<img src="https://mintcdn.com/zuperinc-section23/N5rE3jDnFWeRw90X/images/camera.png?fit=max&auto=format&n=N5rE3jDnFWeRw90X&q=85&s=d62e0370342d674d67c88788c8621af1" alt="Camera Pn" width="1530" height="3036" data-path="images/camera.png" />

* Tap **Save**.\
  The media is added directly to the Job Gallery.

### 2. Upload from Device

* In the Job’s Gallery tab, tap the **Upload** icon to browse your phone’s storage.

<img src="https://mintcdn.com/zuperinc-section23/JYgzSDtQMIN9yYRT/images/nomedia.png?fit=max&auto=format&n=JYgzSDtQMIN9yYRT&q=85&s=17ca1a6ac880d6b95655fbb0c5eba9e6" alt="Nomedia Pn" width="1530" height="3036" data-path="images/nomedia.png" />

* Choose one or more images/videos.
* Add tags (optional) and tap **Save**.

All uploaded images (online or offline) appear in the Gallery. Offline uploads display a small icon on the top-left corner until synced.

## Adding Tags to Images

Tags help organize and categorize job images for faster searchability.

You can add tags:

* **Before capturing an image** (via the Tag icon on the camera screen)

<img src="https://mintcdn.com/zuperinc-section23/N5rE3jDnFWeRw90X/images/camera.png?fit=max&auto=format&n=N5rE3jDnFWeRw90X&q=85&s=d62e0370342d674d67c88788c8621af1" alt="Camera Pn" width="1530" height="3036" data-path="images/camera.png" />

* **After capturing/uploading**, from the image preview.

<img src="https://mintcdn.com/zuperinc-section23/YkSL3F1quiGXTncx/images/preview.png?fit=max&auto=format&n=YkSL3F1quiGXTncx&q=85&s=fab3c27cdc89105bb39e610a5bb58fd4" alt="Preview Pn" width="1530" height="3036" data-path="images/preview.png" />

* **From the Gallery**, when viewing the image in full screen.

<img src="https://mintcdn.com/zuperinc-section23/aukfBnGLLjz4b2cl/images/VMG.png?fit=max&auto=format&n=aukfBnGLLjz4b2cl&q=85&s=d60e0129f1dba1d50befddfc3b784cb7" alt="VMG Pn" width="1530" height="3036" data-path="images/VMG.png" />

<img src="https://mintcdn.com/zuperinc-section23/_VtbsMD9sQOJ0i4N/images/Galmb7-portrait.png?fit=max&auto=format&n=_VtbsMD9sQOJ0i4N&q=85&s=377cd67db98882e757999f8e410ea57b" alt="Galmb7 Portrait Pn" width="1530" height="3036" data-path="images/Galmb7-portrait.png" />

**Role-Based Tag Permissions**

| **Role**            | **Associate Existing Tag** | **Create Tag** | **Edit Tag** | **Delete Tag** |
| :------------------ | :------------------------- | :------------- | :----------- | :------------- |
| **Admin**           | ✅                          | ✅              | ✅            | ✅              |
| **Team Lead**       | ✅                          | ✅              | ✅            | ✅              |
| **Field Executive** | ✅                          | ❌              | ❌            | ❌              |

## Filtering Media in the Job Gallery

The Job Gallery provides multiple filter options to help you quickly locate specific photos or videos associated with the job. You can apply one or more filters at the same time to refine the results.

**1. Filter by Media Type**

Use this filter to control the type of media displayed in the Gallery grid:

* **All Media** – Shows both photos and videos.
* **Photo** – Displays only image files captured or uploaded for the job.
* **Video** – Displays only video files added to the job.

<img src="https://mintcdn.com/zuperinc-section23/WjkgYG1dYygIdKBT/images/Allmedia.png?fit=max&auto=format&n=WjkgYG1dYygIdKBT&q=85&s=f4eeb456f3a9a91b1926be3c697f695b" alt="Allmedia Pn" width="1419" height="2796" data-path="images/Allmedia.png" />

This filter is helpful when you want to focus on visual documentation (photos) or review recorded walkthroughs or evidence (videos).

**2. Filter by Tags**

Tags help categorize images based on location, task, project, or custom labels added by the technician or admin.

* The filter panel displays all tags used within this specific job.
* You can select **one or multiple tags** to narrow down the media list.

<img src="https://mintcdn.com/zuperinc-section23/4f4X5JBG5RSD0AHv/images/tagsfilter.png?fit=max&auto=format&n=4f4X5JBG5RSD0AHv&q=85&s=be405b75827b2e28adcb924c5774f6ae" alt="Tagsfilter Pn" width="1419" height="2796" data-path="images/tagsfilter.png" />

* Only media items associated with the selected tags will be shown in the Gallery.

This is especially useful when searching for images such as **before/after**, **installation**, **inspection**, or **site-specific** photos.

**3. Filter by Date**

Use the Date filter to view media captured or uploaded within a specific timeframe. Available options include:

* **All**
* **Today**
* **Yesterday**
* **Last 7 Days**
* **Last 30 Days**
* **This Month**
* **Last Month**
* **Custom Date Range** – Select a start and end date based on your requirement.

<img src="https://mintcdn.com/zuperinc-section23/OLSMQOFMhi7KJPq1/images/filter.png?fit=max&auto=format&n=OLSMQOFMhi7KJPq1&q=85&s=e1e1348f234bf33f287d7c67df644f4b" alt="Filter Pn" width="1419" height="2796" data-path="images/filter.png" />

This filter helps technicians quickly retrieve images based on when the work was performed or documented.

**Filtered results update instantly**, ensuring you can efficiently locate the most relevant photos or videos during job execution, reporting, or customer interactions.

## **Pick from Zuper Gallery**

The **Pick from Zuper Gallery** option allows technicians to reuse existing media already available in their Zuper Gallery.

This is especially useful when adding images to:

* Checklist items
* Notes
* Inspection forms

Instead of capturing a new image, tap **Pick from Zuper Gallery**, select an existing photo, apply tags if needed, and save.

## Key Highlights

* Images captured from checklists, inspection forms, notes, or direct upload (online/offline) appear automatically in the Job Gallery.
* Tags are currently supported **only for images**.
* The Zuper Camera Component provides a unified tagging and preview experience across Gallery and Notes.
* Multiple tags can be applied to a single image for highly accurate categorization.

## FAQs

**Q**:  Why don’t I see the Gallery tab?

**A**:  Ensure you enable it under Settings > Organization Settings > Job Settings > Enable Job Gallery.

**Q**: Can I edit or delete files in the Gallery?

**A**: You can view, filter, edit, and download files directly from the Gallery. However, deleting files from the Gallery is not supported.

**Q**: What file types are supported?

**A**: The Gallery shows standard media like JPG, PNG, and MP4. Other files (e.g., PDFs) stay in their original sections.

**Q**: Can I tag images after uploading them to the Gallery?

**A**: Yes, Admins can edit tags for images in the Gallery by tapping the Tag Icon on the image thumbnail and accessing the Tag Management. Note that Field Executives can only reassign existing tags.

**Q**: How many tags can I apply to a single image?

**A**: There is no strict limit, but aim for 3–5 relevant tags per image for usability to maintain clarity and avoid clutter.

The Image Tags feature in the Zuper Mobile Gallery transforms how field technicians and Admins capture, organize, and retrieve job-related images. This feature enhances documentation, streamlines workflows, and improves collaboration by enabling contextual tagging and role-based management.
