Enqueue SVG icons

Some of our components require Enqueue Icons Globally!

How to Enqueue Icons?

You can enqueue icons using the following code in function.php file:

PHP array

if ( ! function_exists( 'tweb_enqueue_icons' ) ) :

	function tweb_enqueue_icons() {
		wp_localize_script( 'wp-blocks', 'twebIcons', array(
			// 'icon-name'       => '1 path drawn as stroke'
			'sticker'            => 'M20 12l-2 .5a6 6 0 0 1 -6.5 -6.5l.5 -2l8 8 M20 12a8 8 0 1 1 -8 -8',
			'activity-heartbeat' => 'M3 12h4.5l1.5 -6l4 12l2 -9l1.5 3h4.5'
			// ...
		) );
	}

endif;

add_action( 'enqueue_block_editor_assets', 'tweb_enqueue_icons' );

JSON file

if ( ! function_exists( 'tweb_enqueue_icons' ) ) :

	function tweb_enqueue_icons() {
		wp_localize_script( 'wp-blocks', 'twebIcons', wp_json_file_decode(
			get_theme_file_path( 'path-to-your-icons/svg-icons.json' ),
			array(
				'associative' => true
			)
		) );
	}

endif;

add_action( 'enqueue_block_editor_assets', 'tweb_enqueue_icons' );

Icon Format

"icon-name" => "1 path drawn as stroke"

Icon Library

We use icons from Tabler Icons. You can view our icon list here and download it here.