Skip to content

Instantly share code, notes, and snippets.

@piotrpog
Last active August 5, 2020 03:21
Show Gist options
  • Save piotrpog/fc4caa031fc5545e5f20e67433df9746 to your computer and use it in GitHub Desktop.
Save piotrpog/fc4caa031fc5545e5f20e67433df9746 to your computer and use it in GitHub Desktop.
SVG map-based navigation for Craft CMS. More info: http://localhost/_pog/craft-snippets-craft/web/articles/creating-map-based-navigation-in-craft-cms
{# settings #}
{% set map = include('usa.svg') %}
{% set mapLinks = entry.mapLinks.all() %}
{# logic #}
{% set map = map|retconRemove('style') %}
{% set regionsUsed = [] %}
{% for link in mapLinks %}
{% if link.linkRegion is not empty and link.linkEntry.exists() and link.linkRegion not in regionsUsed %}
{% set regionsUsed = regionsUsed|merge([link.linkRegion]) %}
{% set linkRegion = link.linkRegion|upper %}
{% set linkUrl = link.linkEntry.one().url %}
{% set map = map|retconWrap( 'path#'~linkRegion, 'a#link-'~linkRegion ) %}
{% set map = map|retconAttr( 'a#link-'~linkRegion, { 'href' : linkUrl } ) %}
{% endif %}
{% endfor %}
{# output #}
{{map|raw}}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment