PHPackages                             amici/craft-super-image-markers - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Image &amp; Media](/categories/media)
4. /
5. amici/craft-super-image-markers

ActiveCraft-plugin[Image &amp; Media](/categories/media)

amici/craft-super-image-markers
===============================

Select an image and map entry markers by percentage position.

5.0.1(3w ago)011proprietaryPHPPHP ^8.2

Since May 16Pushed 3w agoCompare

[ Source](https://github.com/amici-infotech/craft-super-image-markers)[ Packagist](https://packagist.org/packages/amici/craft-super-image-markers)[ RSS](/packages/amici-craft-super-image-markers/feed)WikiDiscussions main Synced 1w ago

READMEChangelog (2)Dependencies (1)Versions (3)Used By (0)

Super Image Markers for Craft CMS 5
===================================

[](#super-image-markers-for-craft-cms-5)

Super Image Markers adds a custom Craft CMS field for selecting one image asset, placing draggable markers on top of it, and linking each marker to an entry.

Use it for interactive maps, floor plans, product lookbooks, team photos, diagrams, venue layouts, or any image where editors need to point to related content.

Features
--------

[](#features)

- Select a single Craft asset image from the field input.
- Use Craft's native asset selector UI, including uploads when enabled.
- Preview the selected image directly in the Control Panel.
- Add round markers and drag them anywhere on the image.
- Store marker positions as X/Y percentages so they scale with responsive images.
- Double-click a marker to select a related Craft entry.
- Review selected entries, colors, coordinates, and ordering in a Craft-style table below the image.
- Choose marker colors and reorder markers with drag handles.
- Limit selectable asset sources, upload location, upload behavior, and entry sources from the field settings.
- Use simple Twig accessors for the selected image, marker rows, coordinates, colors, and related entries.
- Call `process()` to preload the image and marker entries before rendering.

Requirements
------------

[](#requirements)

- Craft CMS 5
- PHP 8.2 or newer

Installation
------------

[](#installation)

Run this command to your Craft project:

```
composer require amici/craft-super-image-markers
php craft plugin/install super-image-markers
```

You can also install it from **Settings -&gt; Plugins** in the Craft Control Panel.

For the full setup flow, see the [Super Image Markers documentation](https://docs.amiciinfotech.com/craft-cms/super-image-markers).

Quick Setup
-----------

[](#quick-setup)

1. Go to **Settings -&gt; Fields**.
2. Create a new field.
3. Choose **Image Markers \[Super Image Markers\]** as the field type.
4. Optionally limit the allowed asset sources and entry sources.
5. Optionally choose the default upload location and whether uploads are allowed.
6. Add the field to an entry type, category group, global set, or any element layout that supports custom fields.
7. Edit an element, select or upload an image, add markers, choose colors, sort rows, and assign entries.

Twig Example
------------

[](#twig-example)

```
{% set mapper = entry.entryMapperField.process() %}

{% if not mapper.image.isEmpty() and not mapper.markers.isEmpty() %}
    {% set image = mapper.image.one() %}

        {% for item in mapper.markers.all() %}
            {% set relatedEntry = item.marker.entry.one() %}

                {{ relatedEntry ? relatedEntry.title : 'Marker' }}

        {% endfor %}

{% endif %}
```

Documentation
-------------

[](#documentation)

Read the full documentation at [docs.amiciinfotech.com/craft-cms/super-image-markers](https://docs.amiciinfotech.com/craft-cms/super-image-markers).

Local docs are split by task:

- [Documentation Home](docs/README.md)
- [Installation and Setup](docs/installation.md)
- [Core Concepts](docs/concepts.md)
- [Field Setup](docs/field-setup.md)
- [Editor Guide](docs/editor-guide.md)
- [Twig Usage](docs/twig-usage.md)
- [Data Model](docs/data-model.md)
- [Troubleshooting](docs/troubleshooting.md)

Frontend API
------------

[](#frontend-api)

Given a field handle such as `entryMapperField`:

- `entry.entryMapperField.image.one()` returns the selected image asset.
- `entry.entryMapperField.image.isEmpty()` checks whether there is a valid selected image.
- `entry.entryMapperField.markers.all()` returns all marker items in saved order.
- `entry.entryMapperField.markers.isEmpty()` checks whether any markers have been saved.
- `item.marker.x` returns the marker's horizontal percentage.
- `item.marker.y` returns the marker's vertical percentage.
- `item.marker.color` returns the marker's hex color.
- `item.marker.entryId` returns the related entry ID.
- `item.marker.entry.one()` returns the related entry.
- `entry.entryMapperField.process()` preloads the image and marker entries while keeping the same API.

Example Templates
-----------------

[](#example-templates)

This plugin includes copy-ready frontend examples under `example-templates/`:

- `tooltip.twig` renders hover/focus tooltips.
- `modal.twig` renders click-to-open modals.
- `info-window.twig` renders map-style info windows with a pointer tail.

Copy them into your Craft project's `templates/` folder, adjust the field handle/global source, and route them however your project needs. The examples use Tailwind CSS from the CDN for demonstration only.

License
-------

[](#license)

Proprietary - Copyright (c) 2026 Amici Infotech

###  Health Score

40

—

FairBetter than 86% of packages

Maintenance96

Actively maintained with recent releases

Popularity3

Limited adoption so far

Community9

Small or concentrated contributor base

Maturity47

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 91.7% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~2 days

Total

2

Last Release

21d ago

### Community

Maintainers

![](https://avatars.githubusercontent.com/u/20450552?v=4)[Amici Infotech](/maintainers/amici-infotech)[@amici-infotech](https://github.com/amici-infotech)

---

Top Contributors

[![amici-infotech](https://avatars.githubusercontent.com/u/20450552?v=4)](https://github.com/amici-infotech "amici-infotech (11 commits)")[![brandonkelly](https://avatars.githubusercontent.com/u/47792?v=4)](https://github.com/brandonkelly "brandonkelly (1 commits)")

---

Tags

imagemapperfieldCraftcraftcmsmarkersentriesamici

### Embed Badge

![Health badge](/badges/amici-craft-super-image-markers/health.svg)

```
[![Health](https://phpackages.com/badges/amici-craft-super-image-markers/health.svg)](https://phpackages.com/packages/amici-craft-super-image-markers)
```

###  Alternatives

[spacecatninja/imager-x

Ninja powered image transforms.

29399.9k34](/packages/spacecatninja-imager-x)[nystudio107/craft-imageoptimize

Automatically create &amp; optimize responsive image transforms, using either native Craft transforms or a service like imgix, with zero template changes.

232339.5k16](/packages/nystudio107-craft-imageoptimize)[verbb/image-resizer

Resize assets when they are uploaded.

127273.9k8](/packages/verbb-image-resizer)[carlcs/craft-assetmetadata

Asset Metadata plugin for Craft CMS

316.9k](/packages/carlcs-craft-assetmetadata)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)
