Icons Block is a WordPress plugin designed to import and manage libraries of SVG icon files, allowing you to use and customize icons in your WordPress site. It supports different icon styles (such as outline, solid, etc.) and provides a user-friendly block for the WordPress Block Editor (Gutenberg).
- SVG Library Support: Import collections of SVG icons organized by type (e.g., outline, solid).
- Customizable: Icons can inherit text color, font size, and other styles from your theme or the WordPress Site Editor.
- Block Editor Integration: Easily select, preview, and insert icons into your content using a custom block.
- Type Switching: Seamlessly switch between icon styles (outline, solid, etc.) if the same icon exists in multiple styles.
- GPL Licensed: Distributed under the GNU General Public License v2 or later.
- Copy the plugin folder to your
wp-content/plugins/directory. - Run
npm installin the plugin directory to install dependencies. - Add the
icons/directory with your SVG files, organized by type (e.g.,outline/,solid/).- Ensure your SVG files are named consistently (e.g.,
icon-name.svg).
- Ensure your SVG files are named consistently (e.g.,
- Run the following command to generate the React components from your SVG files:
This will scan the
node generate-icons.jsicons/directory for SVG files and generate thesrc/icons.react.jsfile, which is used by the block. Make sure your SVGs are organized by type (e.g.,icons/outline/,icons/solid/). - Run
npm run buildto compile the plugin assets. - Upload the plugin to your WordPress site via the admin dashboard or by copying it directly to the
wp-content/plugins/directory. - Activate the plugin from the WordPress admin dashboard.
- Insert the Icons block and select an icon from your imported SVG library
- Switch between available icon types/styles using the radio selector.
- Customize icon color, size, and background using the Site Editor or block settings.
This plugin is licensed under the GNU General Public License v2 or later (GPL-2.0-or-later). You can redistribute and/or modify it under the terms of the GPL.