Skip to content
StoreDocsSupport
Get Divi Torque

Inline SVG

The Inline SVG module prints an SVG file from your Media Library directly into the page markup. Because the graphic is part of the page and not an image tag, you can control its size and color from the module settings.

Before you start

WordPress does not accept SVG uploads by default. Divi Torque includes a switch for this. Go to Divi Torque > Settings > Permissions and turn on SVG uploads. Uploads are limited to 1 MB per SVG file. Only upload SVG files from sources you trust.

The module also sanitizes every SVG before it prints it. It removes script, style, foreignObject, animation elements, embedded images, links and event handler attributes. If your graphic relies on any of those, it will render without them.

Content

SVG

  • SVG File: Upload or choose an .svg file. The module reads the file and prints its markup. If the URL does not end in .svg, the module shows "Please choose an SVG file." instead. There is no field for pasting raw SVG code.
  • Alignment: Left, Center or Right. The default is Center.
  • Preserve Aspect Ratio: On by default. Turn it off to let the SVG stretch to the width and height you set.
  • Remove Inline CSS: Off by default. Turn it on to strip style attributes from the SVG, so your own CSS controls the look.

Design

Size

  • Custom Size: Off by default. While it is off, the SVG keeps the size defined in the file. Turn it on to apply your own Width and Height.
  • Width and Height: 150px each by default, used only when Custom Size is on. Width accepts px, %, vw, em and rem. Height accepts px, %, vh, em and rem. The front end reads the desktop value only, even though the builder shows responsive controls.

Color

  • Custom Color: Off by default. When on, the module changes every fill and stroke value in the SVG (except "none") to use the color you choose.
  • SVG Color: The color used when Custom Color is on. The default is #000000.