Installation

Last updated: March 2, 2026

Zoomora can be added to any project in three ways. Choose the method that fits your setup.

Method 1 — CDN (Quickest)

The fastest way to get started. No build tools or package managers required. Add these two lines to your HTML — the CSS in <head> and the JS before </body>:

<!-- In <head> -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/zoomora/dist/zoomora.css">

<!-- Before </body> -->
<script src="https://cdn.jsdelivr.net/npm/zoomora/dist/zoomora.umd.min.js"></script>

Best for: Plain HTML projects, quick prototypes, WordPress themes without a build process, or any project where you want zero setup.

Method 2 — npm or Yarn

Install Zoomora as a package and import it into your project.

npm install zoomora

Then import in your JavaScript entry file:

import Zoomora from 'zoomora';
import 'zoomora/dist/zoomora.css';

Best for: Projects using a bundler like Vite, Webpack, or Rollup — including React, Vue, and modern WordPress themes with an asset pipeline.

Method 3 — Manual Download

Download the latest release directly from GitHub and host the files yourself.

Go to github.com/fronttheme/zoomora/releases
Download the latest release zip
Extract and copy the dist/ folder into your project
Link the files in your HTML:

<!-- In <head> -->
<link rel="stylesheet" href="path/to/dist/zoomora.css">

<!-- Before </body> -->
<script src="path/to/dist/zoomora.umd.min.js"></script>

Best for: Projects where you can’t use a CDN or package manager, or where you need to self-host all assets.

Which File Should I Use?

Once installed, you’ll find these files in the dist/ folder:

File	When to Use
`zoomora.umd.min.js`	CDN, manual download, WordPress enqueue — recommended for most projects
`zoomora.umd.js`	Same as above but unminified — useful for debugging
`zoomora.es.min.js`	npm import with a bundler — production build
`zoomora.es.js`	npm import with a bundler — development/debugging
`zoomora.css`	Always required — include in every setup

Verify It’s Working

After installing, open your browser’s developer console. If Zoomora loaded correctly, you can type:

typeof Zoomora

It should return "function". If you see "undefined", the script hasn’t loaded — double-check the file path or CDN URL.

Next Step

Now that Zoomora is installed, head to Quick Start to add your first lightbox in under two minutes.

Quick Links