{"id":95,"date":"2016-03-15T13:01:34","date_gmt":"2016-03-15T13:01:34","guid":{"rendered":"https:\/\/grooni.com\/docs\/groovy-menu\/?page_id=95"},"modified":"2019-01-28T08:11:10","modified_gmt":"2019-01-28T08:11:10","slug":"managing-icon-packs","status":"publish","type":"page","link":"https:\/\/grooni.com\/docs\/groovy-menu\/global-settings-2\/managing-icon-packs\/","title":{"rendered":"Managing icon packs"},"content":{"rendered":"<p><span style=\"font-weight: 400;\">Generally, Icon package is a set of vector icons generated according to a unified iconic font that you can use in web. A great example of it is Font Awesome.\u00a0<\/span><\/p>\n<p>Groovy menu gives you the ability to change icons for:<\/p>\n<ul>\n<li>Search icon<\/li>\n<li>Cart icon<\/li>\n<li>Social icons<\/li>\n<li>Misc icons from the toolbar<\/li>\n<li>Navigation link icons (within Appearance &gt; Menus)<\/li>\n<\/ul>\n<p>Groovy menu comes bundled with icons packs:<\/p>\n<ul>\n<li>Iconsmind &#8211; Premium icon pack with 2000+ Icons (Line and Solid Version, sent by mail after request)<\/li>\n<\/ul>\n<p><span style=\"font-weight: 400;\">All existing icon packs can be found at <code>Groovy Menu &gt; Dashboard &gt; Global settings &gt; ICON PACKS tab<\/code><\/span><\/p>\n<p><img loading=\"lazy\" class=\"alignnone size-full wp-image-399\" src=\"https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/01\/icon-pack-location.jpg\" alt=\"\" width=\"1920\" height=\"959\" srcset=\"https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/01\/icon-pack-location.jpg 1920w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/01\/icon-pack-location-300x150.jpg 300w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/01\/icon-pack-location-768x384.jpg 768w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/01\/icon-pack-location-1024x511.jpg 1024w\" sizes=\"(max-width: 1920px) 100vw, 1920px\" \/><\/p>\n<h2>Adding icon pack<\/h2>\n<p><span style=\"font-weight: 400;\">Groovy menu has the ability to add various icon packages with your own <strong>SVG<\/strong> icons or any existing <strong>SVG<\/strong> icon font. To add icon font:<\/span><\/p>\n<ol>\n<li>Upload SVG icon to\u00a0<span style=\"font-weight: 400;\">Icomoon <a href=\"https:\/\/icomoon.io\/app\">web app<\/a>\u00a0<\/span><br \/>\n<img loading=\"lazy\" class=\"alignnone size-large wp-image-424\" src=\"https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/import-icons-1024x602.jpeg\" alt=\"\" width=\"835\" height=\"491\" srcset=\"https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/import-icons-1024x602.jpeg 1024w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/import-icons-300x176.jpeg 300w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/import-icons-768x451.jpeg 768w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/import-icons.jpeg 1084w\" sizes=\"(max-width: 835px) 100vw, 835px\" \/><\/li>\n<li>From Icomoon dashboard\n<ul>\n<li>Select necessary icons and click on\u00a0<code>Generate Font<\/code> button\u00a0<br \/>\n<img loading=\"lazy\" class=\"alignnone size-large wp-image-423\" src=\"https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/screen-1024x528.jpeg\" alt=\"\" width=\"835\" height=\"431\" srcset=\"https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/screen-1024x528.jpeg 1024w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/screen-300x155.jpeg 300w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/screen-768x396.jpeg 768w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/screen.jpeg 1920w\" sizes=\"(max-width: 835px) 100vw, 835px\" \/><\/li>\n<li>On next page click on <code>Preferences<\/code> button and give your Icon font a name and uncheck <code>Support IE8<\/code> checkbox\u00a0<br \/>\n<img loading=\"lazy\" class=\"alignnone size-large wp-image-425\" src=\"https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/set-name-of-icon-font-1024x594.jpeg\" alt=\"\" width=\"835\" height=\"484\" srcset=\"https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/set-name-of-icon-font-1024x594.jpeg 1024w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/set-name-of-icon-font-300x174.jpeg 300w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/set-name-of-icon-font-768x446.jpeg 768w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/set-name-of-icon-font.jpeg 1461w\" sizes=\"(max-width: 835px) 100vw, 835px\" \/><\/li>\n<li>Click on <code>Download<\/code> button\u00a0<br \/>\n<img loading=\"lazy\" class=\"alignnone size-large wp-image-426\" src=\"https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/download-icon-font-1024x528.jpeg\" alt=\"\" width=\"835\" height=\"431\" srcset=\"https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/download-icon-font-1024x528.jpeg 1024w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/download-icon-font-300x155.jpeg 300w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/download-icon-font-768x396.jpeg 768w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/download-icon-font.jpeg 1920w\" sizes=\"(max-width: 835px) 100vw, 835px\" \/><\/li>\n<\/ul>\n<\/li>\n<li>From Groovy menu dashboard\n<ul>\n<li>Go to <code>Global settings &gt;\u00a0ICON PACKS tab<\/code>and\u00a0click on <code>UPLOAD ICON PACK<\/code> button\u00a0<br \/>\n<img loading=\"lazy\" class=\"alignnone size-large wp-image-427\" src=\"https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/upload-icon-pack-1024x576.jpeg\" alt=\"\" width=\"835\" height=\"470\" srcset=\"https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/upload-icon-pack-1024x576.jpeg 1024w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/upload-icon-pack-300x169.jpeg 300w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/upload-icon-pack-768x432.jpeg 768w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/02\/upload-icon-pack.jpeg 1700w\" sizes=\"(max-width: 835px) 100vw, 835px\" \/><\/li>\n<li>Select\u00a0zip file previously generated from Icomoon web app and wait for a little\u00a0until the page is reloaded<\/li>\n<\/ul>\n<\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">And that\u2019s it. Now you can use uploaded icons.<\/span><\/li>\n<\/ol>\n<blockquote>\n<p><span style=\"font-weight: 400;\">Note. Groovy icon package manager works properly with <a href=\"https:\/\/icomoon.io\/app\">Icomoon<\/a> web app only. It is free and powerful way to generate any kind of vector icon package.<\/span><\/p>\n<\/blockquote>\n","protected":false},"excerpt":{"rendered":"<p>Generally, Icon package is a set of vector icons generated according to a unified iconic font that you can use &hellip; <a href=\"https:\/\/grooni.com\/docs\/groovy-menu\/global-settings-2\/managing-icon-packs\/\">Read more &rarr;<\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"parent":69,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":[],"_links":{"self":[{"href":"https:\/\/grooni.com\/docs\/groovy-menu\/wp-json\/wp\/v2\/pages\/95"}],"collection":[{"href":"https:\/\/grooni.com\/docs\/groovy-menu\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/grooni.com\/docs\/groovy-menu\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/grooni.com\/docs\/groovy-menu\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/grooni.com\/docs\/groovy-menu\/wp-json\/wp\/v2\/comments?post=95"}],"version-history":[{"count":0,"href":"https:\/\/grooni.com\/docs\/groovy-menu\/wp-json\/wp\/v2\/pages\/95\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/grooni.com\/docs\/groovy-menu\/wp-json\/wp\/v2\/pages\/69"}],"wp:attachment":[{"href":"https:\/\/grooni.com\/docs\/groovy-menu\/wp-json\/wp\/v2\/media?parent=95"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}