{"id":2017,"date":"2018-06-16T12:51:26","date_gmt":"2018-06-16T17:51:26","guid":{"rendered":"http:\/\/bluegalaxy.info\/codewalk\/?p=2017"},"modified":"2018-06-16T12:51:26","modified_gmt":"2018-06-16T17:51:26","slug":"atom-enable-minimap-file-icons-extensions","status":"publish","type":"post","link":"https:\/\/bluegalaxy.info\/codewalk\/2018\/06\/16\/atom-enable-minimap-file-icons-extensions\/","title":{"rendered":"Atom: How to enable minimap and file-icons extensions"},"content":{"rendered":"<p>This article describes a couple of useful plug-ins for the Atom code editor. In order to install the &#8220;minimap&#8221; and &#8220;file-icons&#8221;\u00a0packages, you can follow the same package installation instructions that were used for the &#8220;data-atom&#8221; package found in this previous article:<\/p>\n<blockquote class=\"wp-embedded-content\" data-secret=\"nwRt9mP9Iw\"><p><a href=\"http:\/\/bluegalaxy.info\/codewalk\/2018\/04\/04\/how-to-run-mysql-queries-in-atom-using-a-package-called-data-atom\/\">Atom: How to run MySQL queries in Atom using a package called Data Atom<\/a><\/p><\/blockquote>\n<p><iframe loading=\"lazy\" class=\"wp-embedded-content\" sandbox=\"allow-scripts\" security=\"restricted\" style=\"position: absolute; clip: rect(1px, 1px, 1px, 1px);\" src=\"http:\/\/bluegalaxy.info\/codewalk\/2018\/04\/04\/how-to-run-mysql-queries-in-atom-using-a-package-called-data-atom\/embed\/#?secret=nwRt9mP9Iw\" data-secret=\"nwRt9mP9Iw\" width=\"600\" height=\"338\" title=\"&#8220;Atom: How to run MySQL queries in Atom using a package called Data Atom&#8221; &#8212; Chris Nielsen Code Walk\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\"><\/iframe><\/p>\n<p>&nbsp;<\/p>\n<p>Once installed, the packages will appear like this in your list of installed packages (Settings &#8211;&gt; Packages):<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-2019\" src=\"http:\/\/bluegalaxy.info\/codewalk\/wp-content\/uploads\/2018\/06\/minimap-file-icons.png\" alt=\"\" width=\"730\" height=\"284\" srcset=\"https:\/\/bluegalaxy.info\/codewalk\/wp-content\/uploads\/2018\/06\/minimap-file-icons.png 730w, https:\/\/bluegalaxy.info\/codewalk\/wp-content\/uploads\/2018\/06\/minimap-file-icons-300x117.png 300w, https:\/\/bluegalaxy.info\/codewalk\/wp-content\/uploads\/2018\/06\/minimap-file-icons-676x263.png 676w\" sizes=\"auto, (max-width: 730px) 100vw, 730px\" \/><\/p>\n<p>The minimap package is great in that it generates a zoomed out view of the code in your file that acts as a high level scroll. If you remember visually what section of code you were working on in the minimap, you can use the minimap to quickly scroll back to that area. Here is what the minimap looks like in Atom:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-2021\" src=\"http:\/\/bluegalaxy.info\/codewalk\/wp-content\/uploads\/2018\/06\/minimap.png\" alt=\"\" width=\"167\" height=\"508\" srcset=\"https:\/\/bluegalaxy.info\/codewalk\/wp-content\/uploads\/2018\/06\/minimap.png 167w, https:\/\/bluegalaxy.info\/codewalk\/wp-content\/uploads\/2018\/06\/minimap-99x300.png 99w\" sizes=\"auto, (max-width: 167px) 100vw, 167px\" \/><\/p>\n<p>The file-icons package provides nice color coded icons for each of the files listed under a project. The icons appear to the left of each file name. For example:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-2023\" src=\"http:\/\/bluegalaxy.info\/codewalk\/wp-content\/uploads\/2018\/06\/file-icons.png\" alt=\"\" width=\"227\" height=\"129\" \/><\/p>\n<p>For more information about these Atom plug-ins, see:<br \/>\n<a href=\"https:\/\/github.com\/atom-minimap\/minimap\">https:\/\/github.com\/atom-minimap\/minimap<\/a><br \/>\n<a href=\"https:\/\/github.com\/file-icons\/atom\">https:\/\/github.com\/file-icons\/atom<\/a><\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>This article describes a couple of useful plug-ins for the Atom code editor. In order to install the &#8220;minimap&#8221; and &#8220;file-icons&#8221;\u00a0packages, you can follow the same package installation instructions that were used for the &#8220;data-atom&#8221; package found in this previous article: Atom: How to run MySQL queries in Atom using a package called Data Atom &hellip; <a href=\"https:\/\/bluegalaxy.info\/codewalk\/2018\/06\/16\/atom-enable-minimap-file-icons-extensions\/\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">Atom: How to enable minimap and file-icons extensions<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[78],"tags":[121],"class_list":["post-2017","post","type-post","status-publish","format-standard","hentry","category-technologies-and-tools","tag-atom"],"_links":{"self":[{"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/posts\/2017","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/comments?post=2017"}],"version-history":[{"count":3,"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/posts\/2017\/revisions"}],"predecessor-version":[{"id":2025,"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/posts\/2017\/revisions\/2025"}],"wp:attachment":[{"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/media?parent=2017"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/categories?post=2017"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/tags?post=2017"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}