SVG in the SilverStripe backend

The other day WMK mentioned that lck_ on IRC used SVG's as icons in the backend. So I thought why not...

...but misunderstood that he used this for a ModelAdmin icon like:

private static $menu_icon = 'calendar/images/calendar112.svg';

Not that much of a surprise it actually works, since SVG-support in Browsers is pretty good these days but I like this :) Since I just added a random SVG from the web with a different size than 16x16px I also had to add preserveAspectRatio="xMinYMin meet" to the svg-tag and add background-size styles to make it fit. You probable do not need to set those in versions newer than 3.1.

_config.yml
LeftAndMain:
  extra_requirements_css:
    - mysite/style/fixCMSstyle.css

fixCMSstyle.css
.cms-menu-list li a .icon.icon-16 {
	background-size:16px auto;
}

menu

Ok but as I said, I misunderstood... what came out were inline SVG Thumbnails in GridField :)

grid

This I have done with a extension on File.php

_config.yml
File:
  extensions:
    - InlineContentExtender

InlineContentExtender.php
public function InlineContent() {
	if ($this->owner->getExtension() == "svg" && file_exists($this->owner->getFullPath())) {
		$obj= HTMLText::create();
		$obj->setValue(file_get_contents($this->owner->getFullPath()));
		return ($obj);
	}
}

..and in the Dataobject managed with GF used it in Summary

static $summary_fields = array(
	"Image.InlineContent" => "Thumbnail",
	"Title" => "Titel"
);

This dumps the SVG-File content straight into the CMS-Backend which is proable not everyones taste. If you need an idea how to parse, look at SilverStripe SVG.

Next thing is to find a Solution how to have a preview icon in UploadField. Can you help? Leave a comment :)

Rate this post

Post your comment

Comments

  • Werner Krauss 14/04/2016 10:27am (2 years ago)

    Just found a module that seems to handle SVG in an upload field: https://github.com/micschk/silverstripe-svg-images/

  • Lukas 09/03/2016 9:12am (2 years ago)

    Well probable https://github.com/unclecheese/silverstripe-dropzone is the answer for having previews for SVGs - has anybody made this work?

RSS feed for comments on this page | RSS feed for all comments