Support » Plugin: Menu Icons by ThemeIsle » Can Menu Icons inline the SVG?

  • Hi, I’m trying out Menu Icons on a local server to see if I’m pleased with its behavior before actual usage. One thing I’m especially concerned about is how the plugin sets the SVG upload as image, img. I was hoping it would inline the SVG.

    Can this be planned as part of an update?

Viewing 6 replies - 1 through 6 (of 6 total)
  • I just managed to do it by myself. Include this code in your theme’s functions.php

    add_filter('menu_icons_item_title', 'mytheme_menu_icons_item_title', 10, 4);
    function mytheme_menu_icons_item_title($title_with_icon, $id, $meta, $title) {
    	if (strrpos($meta['url'], '.svg') !== FALSE && strlen($meta['url']) - strrpos($meta['url'], '.svg') == 4) {
    		$svg = file_get_contents($meta['url']);
    		$svg = substr($svg, strpos($svg, '<svg ')); // remove file headers
    		$title_with_icon = $svg . substr($title_with_icon, strpos($title_with_icon, '<span'));
    	return $title_with_icon;

    Hope it helps!

    Wow, Cazuma, this looks nifty. I’m trying it right away. If it works or not I’ll let you know. Thanks.

    Hi, back to you Cazuma. It actually works–it does inline the svg! Only one caveat though…it doesn’t seem to inline the width setting (of say 1em) from the plugin, css from my code fixed that.

    This is very much resolved, except that it’ll be nice if the plugin author could share some ideas.

    Thanks again Cazuma, really appreciate your help with the code.


    Thank you for the help Cazuma. I’ll try to find some free time to add support for inline SVG.

    O, Dzikri, that would be very nice of you. SVG is best practice, really. And support for icon fonts should be limited. I would say every icon on the page no matter where should be inline SVG and your plugin plus Cazuma’s help has helped me achieve that in an area where it was impossible for me to do so, the nav menu.

    Such an update would be very much welcome.


    Hello, Cazuma, you still there? Would you have any idea why I get this error upon applying your code?

    Warning: file_get_contents(//localhost:3000/wp-content/uploads/2017/10/recommended.svg): failed to open stream: Connection refused in /app/public/wp-content/themes/starter/inc/extras.php on line 141

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Can Menu Icons inline the SVG?’ is closed to new replies.