https://github.com/stevie-mayhew/silverstripe-svg

Basic SVG support for SilverStripe
https://github.com/stevie-mayhew/silverstripe-svg

php silverstripe svg svg-support

Last synced: 17 days ago
JSON representation

Basic SVG support for SilverStripe

• Host: GitHub
• URL: https://github.com/stevie-mayhew/silverstripe-svg
• Owner: stevie-mayhew
• License: mit
• Created: 2014-11-23T22:30:58.000Z (about 10 years ago)
• Default Branch: master
• Last Pushed: 2024-06-26T21:16:18.000Z (7 months ago)
• Last Synced: 2024-12-23T02:07:40.726Z (24 days ago)
• Topics: php, silverstripe, svg, svg-support
• Language: PHP
• Size: 27.3 KB
• Stars: 22
• Watchers: 2
• Forks: 8
• Open Issues: 3
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# SilverStripe SVG

Basic SVG support for SilverStripe templates

## Requirements

SilverStripe 4 or higher

## Installation

```composer require stevie-mayhew/silverstripe-svg```

## Configuration

You can set the base path for where your SVG's are stored. You can also add extra default classes to the SVG output

```yml

StevieMayhew\SilverStripeSVG\SVGTemplate:

  base_path: 'themes/base/production/svg/'

  default_extra_classes:

    - 'svg-image'

```

## Usage

In a SilverStripe template simply call the SVG template helper.

```html

{$SVG('name')}

{$SVG('with-id', 'testid')}

```

There also helper functions for width, height, size, fill, adding extra classes, setting a custom/alternative base path and specifying a sub-folder within the base path (for those who want to categories and folder off your images).

```html

{$SVG('name').width(200)}

{$SVG('name').height(200)}

{$SVG('name').size(100,100)}

{$SVG('name').fill('#FF9933')}

{$SVG('name').stroke('#FF9933')}

{$SVG('name').extraClass('awesome-svg')}

{$SVG('name').customBasePath('assets/Uploads/SVG')}

{$SVG('name').addSubfolder('MyDir')}

{$SVG('name').addSubfolder('MyDir/MyOtherDir')}

{$SVG('name').addSubfolder('MyDir').addSubfolder('MyOtherDir')}

```

These options are also chainable.

```html

{$SVG('name').fill('#45FABD').width(200).height(100).extraClass('awesome-svg').customBasePath('assets/Uploads/SVG').addSubfolder('MyDir')}

```

### Example Output

```html

```