Introducing the GraphicStack

GraphicStack makes it very simple to quickly incorporate SVG files into your webpages. It embeds SVG files using the correct HTML markup. Several options are provided to adjust the sizing, placement and positioning of your SVG files. You can even make the entire stack link to another page, a resource or an external website. Both local and warehoused graphics are supported. With this stack, you can exploit all the benefits of using SVG for vector graphics - like smaller file sizes, retina display optimisation, infinite scalability, search optimisation etc.

Alongside SVG, GraphicStack can confidently handle regular image formats too; like JPG, PNG and GIF. So this makes GraphicStack a useful tool for anyone new to the idea of warehousing images. To learn more about the GraphicStack, please click here.


Another brilliant new stack that fills a big hole in the available image stacks. Everyone should use this stack.

Very forward thinking of Will to set the default as Warehouse and shows he understands the advantages of using warehoused images in RapidWeaver.

There is also a Custom Classes box which opens up many additional options.


Thanks for feedback! Yes I forgot to mention the custom classes box - it is useful for giving your SVG files or other images a class and then targeting them with CSS code. So for example you could give a GraphicStack a custom class of redBorder and then enter the following in the RapidWeaver custom CSS box or theme custom.css file:

.redBorder {
border: 1px solid red;
padding: 5px;
border-radius: 5px;

That would then render a red rounded border around the image. Loads of other possibilities too.


This is great Will thanks, now much easier to get SVG’s into a Rapiweaver site using the correct tag.

If I wanted to use SVGs in Top Box it looks like I can drop a GraphicStack into the Trigger and Content areas of Top Box 4, I’ve just tried it and appears to work fine, any reason not to do this?

Thanks again.



1 Like