erikyo / OH-MY-SVG

The (missing) SVG block for wordpress
GNU General Public License v3.0
8 stars 1 forks source link
gutenberg-blocks svg wordpress wordpress-plugin

=== OH MY SVG === Contributors: codekraft Tags: svg, blocks, vector, icon, upload, sanitize Requires at least: 5.7 Tested up to: 6.3 Stable tag: 0.1.4.3 Requires PHP: 7.1 License: GPLv3 or later License URI: http://www.gnu.org/licenses/gpl-3.0.html

Unlock the magic of your website with the SVG block. Out-of-the-box security and turbocharged speed optimization!

== Description ==

Enhance your WordPress website with the power of SVG images using the Svg Block plugin. Easily add and manipulate SVG images with the block editor. This plugin provides an intuitive Svg Block that allows you to incorporate SVG icons, images, or HTML snippets effortlessly. Experience the convenience of automatic markup sanitation, optimization (svgo), and a range of useful utilities, such as color customization and markup modification for creating image variations.

The Svg Block offers the same controls as regular images, but with the flexibility of XML markup editing. Unleash your creativity with endless possibilities—animate SVGs using CSS animations or JavaScript, modify inner text, and create unique variations of the same SVG. Unlike traditional image formats, SVGs always render sharply and are incredibly lightweight, eliminating the need for multiple resized images for different screen sizes and resolutions.

Boost your website's performance with inline SVGs, which drastically reduce page load time by minimizing server requests and conserving bandwidth. Enjoy seamless integration and customization options that embedded SVGs offer, making your website visually stunning.

== Svg are awesome because: ==

= 🔒 Security =

The Svg Block plugin prioritizes security by not allowing uploads of SVG images into the media library, making it a safer option compared to other plugins that enable such uploads. SVGs used with this plugin are cleaned with DOMPurify, a robust JavaScript purifier, ensuring that only safe and validated SVGs are rendered. Unlike SVGs processed by external tools like ImageMagick, the SVGs included within your pages as XML fragments cannot be uploaded by unauthorized users from the website side. Only those with appropriate permissions to use the block editor can include SVGs.

Svg will be included within the pages as xml fragments, so they will not be processed by imagemagick and cannot be uploaded by anyone from website "side". Only those with permissions to use the editor will be allowed to 'upload' (or rather include) them.

= Inspirations, links =

Mario Heiderich the-image-that-called-me

Fortinet - Anatomy of Scalable Vector Graphics (Svg) Attack Surface on the Web

== Installation ==

This plugin can be installed directly from your WordPress site.

  1. Log in to your WordPress site and navigate to Plugins → Add New.
  2. Type "OH MY SVG" into the Search box.
  3. Locate the OH MY SVG plugin in the list of search results and click Install Now.
  4. Once installed, click the Activate button.

It can also be installed manually using a zip file.

  1. Download the OH MY SVG plugin from WordPress.org.
  2. Log in to your WordPress site and navigate to Plugins → Add New.
  3. Click the Upload Plugin button.
  4. Click the Choose File button, select the zip file you downloaded in step 1, then click the Install Now button.
  5. Click the Activate Plugin button.

== Frequently Asked Questions ==

= Can I use SVGs for buttons, icons, and other elements? =

Absolutely! The Svg Block allows you to use SVGs for various elements on your website, such as buttons, icons, and more. Simply create a reusable block to conveniently use the same SVG across multiple locations.

= Can I animate SVGs with CSS or JavaScript? =

Yes, you can easily animate SVGs using CSS or JavaScript. The Svg Block provides the flexibility to add CSS animations or implement JavaScript scripts to bring your SVGs to life.

== Changelog ==

= 0.1.4 - 2023-05-18 =

= 0.1.3 - 2023-02-02 =

= 0.1.2 - 2022-10-22 =

= 0.1.1 - 2022-08-03 =

= 0.1.0 - 2022-07-25 =

== Resources ==

= Contribute =

We love your input! We want to make contributing to this project as easy and transparent as possible, whether it's:

We use GitHub to host code, to track issues and feature requests, as well as accept pull requests. By contributing, you agree that your contributions will be licensed under its GPLv3 License.

== Screenshots ==

  1. Svg edit capabilities
  2. Svg as icon (link, alignment)

= Downloads =

GitHub Repository Developer resources WordPress directory