SVG Block
Last updated
Last updated
The SVG block allows you to add icons, SVG images and inline SVG code snippets in an instant.
Select required block.
Click the "+" icon at the bottom of the Quick Inserter.
Search for the SVG block.
Click to add to page.
The Icon property allows you to add an unwrapped SVG Icon to your page. This is useful for one-off SVG icons.
Select SVG block.
In the Primary tab, set Type to Icon.
Click "Icon" to open the Icon library or search for required icon.
The Customise property allows you to modify your Icon as required including size, height, width, stroke as well as fill, stroke and text colours.
Customise as required.
The Image property allows you to add an SVG image to your page.
Imported images present a security risk. Although Cwicly sanitises them as well as possible, make sure you trust the source you import them from.
Select SVG block.
In the Primary tab, set Type to Image.
The SVG Uploads property enables you to upload SVG images to the media library.
Cwicly sanitises SVGs but make sure you trust the source of the SVG before uploading it.
Navigate to the Cwicly tab in the Dashboard.
Open the Role Editor.
In Miscellaneous, toggle SVG on to enable.
The Source property allows you to set the source of the image, Static or Dynamic.
Set source as required.
The Customise property allows you to modify your Image as required including size, height, width, stroke as well as fill, stroke and text colours.
Customise as required.
The Inline property allows you to add an SVG code snippet to your page.
Imported SVG snippets present a security risk. Although Cwicly sanitises them as well as possible, make sure you trust the source you import them from.
Select SVG block.
In the Primary tab, set Type to Inline.
Allows you to add inline SVGs.
Cwicly sanitises SVGs but make sure you trust the source of the SVG before adding it to your content.
Navigate to the Cwicly tab in the Dashboard.
Open the Role Editor.
In Miscellaneous, toggle Inline SVG to enable.
The SVG property allows you to paste an SVG code snippet.
Find the SVG field.
Paste required SVG snippet.
The Customise property allows you to modify your SVG snippet as required including size, height, width, stroke as well as fill, stroke and text colours.
Customise as required.