thezenmonkey/silverstripe-svgspritefield

A module add SVGSprites to Silverstripe

Installs: 26

Dependents: 0

Suggesters: 0

Security: 0

Stars: 2

Watchers: 1

Forks: 0

Open Issues: 0

Type:silverstripe-vendormodule

dev-master 2018-09-07 13:40 UTC

This package is auto-updated.

Last update: 2024-03-26 09:15:39 UTC


README

This module lets you assign icons to a DataObject using SVG Sprites. It can be configured to use a default sprite file or a custom sprite file can be on a per-field basis. This module is heavily based on jaedb/IconField and if you need a solution that used multiple image files for icons you should use th one.

Requirements

SilverStripe CMS ^4.2 Silverstripe SVG ^2 (for inlining Sprites)

Installation

composer require thezenmonkey/silverstripe-svgspritefield

Configuration

The Sprite field is a subclass of OptionSetField and takes the same parameters with a SVG Sprite File being used as the source array.

Usage

  • Set your $db field to type Icon (eg 'Icon' => Sprite::class)
  • SpriteField::create($name, $title, $iconFolder)
    • $name is the database field as defined in your class
    • $title is the label for this field
    • $sourceFile (optional) defines SVG Sprite file with Icons.

Setting Up Sprites

The module will use the symbol as the value stored in your database. The <title> provides the Name od the Icon.

Templates

To use in you theme use the stndard SVG use markup with $Value as the name of your DataBase field

<svg viewBox="0 0 100 100" class="icon">
    <use xlink:href="#{$Value}" />
</svg>

Ensure you include the SVG source file somewhere on the page set to display none

{$SVG('mysource.svg').customBasePath('my/base/path').extraClass('myhiddenclass')}

Please see SilverStripe SVG for correct implementation.

Acknowledgments

ToDo

  • More Configuration Options
  • Built-in Template
  • Built in inclusion of SpriteFile on page