Jump to:

5450 Posts in 1672 Topics by 1197 members

Customising the CMS

SilverStripe Forums » Customising the CMS » SVG image fill not showing on the frontend

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

Page: 1
Go to End
Author Topic: 189 Views
  • pixelninja
    Avatar
    Community Member
    3 Posts

    SVG image fill not showing on the frontend Link to this post

    Hi,

    This is my first post, so sorry if I have missed some guidelines.

    I am building a site that utilises RaphaelJS and SVG. Shapes created using the library work as expected, but when I try to replace an image with a SVG path and image fill, it just shows as having a black fill.

    If I copy the exact code generated by Raphael and place it into an html page, it works as expected. And the code follows the SVG spec so is above board.

    My initial thoughts were a permissions error, so I 777'd everything (locally of course) and made sure the owner was correct but still nothing.

    Is there somewhere in Silverstripe's page generation that could be blocking SVG image patterns? Has anyone come across this before?

    Attached is an image of the black fill, and one of what it looks like in non Silverstripe setup.

    Thanks for your help.

  • pixelninja
    Avatar
    Community Member
    3 Posts

    Re: SVG image fill not showing on the frontend Link to this post

    Oh and it's Silverstripe version 3.1.1

  • sol1
    Avatar
    Community Member
    4 Posts

    Re: SVG image fill not showing on the frontend Link to this post

    The reason why the image isn't appearing is usually the base href tag that silverstripe includes by default in the template.

    <base href="http://example.com" target="_blank">

    It be in the head of the template and look like below.

    <% base_tag %>

    If you remove that tag it should fix the issue. But some other functions in silverstripe may have issues without it.

  • pixelninja
    Avatar
    Community Member
    3 Posts

    Re: SVG image fill not showing on the frontend Link to this post

    That's great, thanks very much! It works now.

    189 Views
Page: 1
Go to Top

Want to know more about the company that brought you SilverStripe? Then check out SilverStripe.com

Comments on this website? Please give feedback.