{"id":28569,"date":"2018-11-29T23:13:10","date_gmt":"2018-11-29T15:13:10","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=28569"},"modified":"2023-04-06T19:00:46","modified_gmt":"2023-04-06T11:00:46","slug":"firefox-graphical-command-line","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/firefox-graphical-command-line\/","title":{"rendered":"15 GCLI Commands in Firefox for Front-End Developers"},"content":{"rendered":"

No matter how many fancy buttons and menus we\u2019ve got, there are always programmers who appreciate command line access<\/strong> in their work environment, especially when it eliminates a hunt for the right button or menu<\/strong> that displays the needed setting in our line of sight.<\/p>\n

Firefox has had a Graphical Command Line Interpreter<\/a><\/strong>, or in short a GCLI<\/strong> for a while now, and been expanding its command set over time. The GCLI commands provide developers with a quick access to development and configuration tools<\/strong>. It also has an autocomplete feature<\/strong>; if you press Tab<\/span> while typing any command, the commands suggested by GCLI will be entered.<\/p>\n

\n\t\t\t\t\tRead Also:<\/strong>\u00a0\n\t\t\t\t\t10 Coolest Hidden Firefox Settings You Should Know<\/a>\n\t\t\t\t<\/p>\n

The Toolbar<\/h2>\n

Firefox\u2019s GCLI<\/abbr> is also known as Developer Toolbar<\/strong>. There are three ways<\/strong> to open it:<\/p>\n

    \n
  1. Press the Shift<\/span> + F2<\/span> keyboard shortcut.<\/li>\n
  2. Click the \u201cOpen Menu\u201d<\/strong> (hamburger) icon on the rightmost side of the address bar (right to the Home button), then click the Developer > Developer Toolbar<\/strong> submenu.<\/li>\n
  3. In the top menu bar, tick the Tools > Web Developer > Developer Toolbar<\/strong> option.<\/li>\n<\/ol>\n

    Once the Developer Toolbar is open, you can see it at the bottom of the browser window<\/strong>. If you\u2019ve decided to work with the GCLI<\/abbr>, I\u2019d advise to just leave it open all the time while working.<\/p>\n

    \"Firefox<\/figure>\n

    Now let\u2019s see some useful tasks you can perform in Firefox using its GCLI<\/strong>.<\/p>\n

    1. Remove page elements<\/h2>\n

    Command:<\/strong> pagemod remove element <selector><\/code><\/p>\n

    When you need to take another look at the layout of a web page with some elements removed<\/strong>, just type the command pagemod remove element <selector><\/code> into the Firefox Command Line in order to remove those elements from the page.<\/p>\n

    The value of <selector><\/code> needs to be a valid CSS selector on the page<\/strong>. Say, in a page you want to remove all the links (specifically) of the class .btn<\/code>, the command is written as: pagemod remove element a.btn<\/code>.<\/p>\n

    Generally, the command pagemod<\/code> is used for modifying a page<\/strong>, by either removing or replacing chosen elements or attributes.<\/p>\n

    \"Remove<\/figure>\n

    2. Measure elements<\/h2>\n

    Command:<\/strong> measure<\/code><\/p>\n

    If you want to know the measurement<\/strong> of any visual module on a web page, there\u2019s a tool for that. The \u201cmeasure\u201d tool is accessible via both the typical web developer toolset and the GCLI.<\/p>\n

    Type and enter the measure<\/code> command into the command line, and the cursor will turn into a crosshair<\/strong>. The measurements will be shown in pixels<\/strong> next to the crosshair cursor, and are of the width, height and diagonal length<\/strong> of the area selected. To disable the tool, rerun the measure<\/code> command<\/strong>.<\/p>\n

    \"Measure<\/figure>\n

    3. Edit files quickly<\/h2>\n

    Command:<\/strong> edit <url><\/code><\/p>\n

    Start editing your page\u2019s resources<\/strong> with the edit<\/code> command. While typing the command, you will see the URIs of all the available resources<\/strong> from that page, which you can browse using the up and down arrow keys. Once you\u2019ve selected the resource you want to edit, press Tab<\/span> to autocomplete the suggestion, and hit Enter<\/span>, and the editor tool of the browser<\/strong> will open with the chosen file.<\/p>\n

    \"Edit<\/figure>\n

    4. Look up unfamiliar CSS properties<\/h2>\n

    Command:<\/strong> mdn css <property><\/code><\/p>\n

    This one is a pretty cool command\u2014it is kind of a popup dictionary for CSS properties<\/strong>. If you come across an unfamiliar CSS property, and want to check what it stands for for, run the command mdn css <property><\/code> in the GCLI with <property><\/code> replaced by the actual name of that unfamiliar property.<\/p>\n

    A popup will appear with the \u201cdefinition\u201d for that CSS property<\/strong> right above the toolbar. The definition is an extract from the official Mozilla Developer Network<\/a> (MDN) page<\/strong> of the given property. MDN\u2019s glossary of CSS properties, HTML elements and web APIs are highly cited.<\/p>\n

    If the text shown in the popup is not enough, and you want to know more<\/strong>, you can click the link Visit MDN Page<\/strong> inside the popup, and the respective MDN page for that property will be opened. Right now, this command is available for CSS properties only.<\/p>\n

    \"Look<\/figure>\n

    5. Resize page<\/h2>\n

    Command:<\/strong> resize to <width> <height><\/code><\/p>\n

    The resize tool lets you see how your page looks resized to specific dimensions<\/strong>, which can be useful when you want to preview your page\u2019s appearance in devices with dimensions different from the one you\u2019re working in.<\/p>\n

    Firefox also has a keyboard shortcut to open this tool<\/strong>: Ctrl<\/span> + Shift<\/span> + M<\/span> (Cmd<\/span> + Alt<\/span> + M<\/span> for Mac). But if you already know the exact dimensions<\/strong> to be used for the resizing, the quickest way is to run the resize<\/code> command with the dimensions you need.<\/p>\n

    The dimensions are interpreted in pixels<\/strong>. Once the command is run, you\u2019ll see the resized page.<\/p>\n

    \"Resize<\/figure>\n

    6. Restart the browser<\/h2>\n

    Command:<\/strong> restart<\/code><\/p>\n

    This command is self-evident. To restart Firefox, just type restart<\/code> into the command line, and press Enter<\/span>\u2014can come in handy when you install add-ons or plugins that require a restart.<\/p>\n

    7. Open your Firefox profile folder<\/h2>\n

    Command<\/strong>: folder openprofile<\/code><\/p>\n

    Every Firefox user gets their own local profile folder<\/strong> that stores user-specific files<\/strong>, such as bookmarks and the \/chrome<\/code> folder. When you personalize Firefox<\/a> you may need to view and modify the contents of this folder.<\/p>\n

    The alternative way to open this folder is to click the Show Folder<\/span> button on the about:support<\/code> page<\/a>. By running the command folder openprofile<\/code> in the Firefox Command Line, you will see your profile folder open at once<\/strong>.<\/p>\n

    8. Copy color values<\/h2>\n

    Command:<\/strong> eyedropper<\/code><\/p>\n

    Other than the fact that it supports only the hex format, eyedropper is a brilliant tool for copying the color value<\/strong> of any visible hue on a web page. Enter the command eyedropper<\/code> into the GCLI to toggle the tool\u2019s operationality.<\/p>\n

    \"Copy<\/figure>\n

    9. Test external libraries<\/h2>\n

    Command:<\/strong> inject <url><\/code><\/p>\n

    If you want to test some external libraries<\/strong> on your web page, instead of diving into the source code to make the temporary additions, just use the inject<\/code> command to insert the libraries<\/strong>. For instance, to include jQuery just type inject jQuery<\/code>.<\/p>\n

    On executing the command, the resource will be imported to the page<\/strong> by inserting a <script><\/code> tag into the <head><\/strong> section of the HTML document.<\/p>\n

    10. Take screenshots<\/h2>\n

    Command:<\/strong> screenshot <option><\/code><\/p>\n

    The built-in screenshot taking tool<\/strong> in Firefox is quite powerful. For instance, you can target individual elements using CSS selectors, use a timer, apply a dpr<\/abbr>. You can even take a screenshot of just the chrome portion of the browser<\/strong> (area surrounding the user content) by using the screenshot --chrome<\/code> command.<\/p>\n

    The screenshots are saved in the Download folder<\/strong> of the browser in PNG format<\/strong>.<\/p>\n

    \"Take<\/figure>\n

    11. Open rulers<\/h2>\n

    Command<\/strong>: rulers<\/code><\/p>\n

    Yet another cool tool from Firefox that is easily accessible via GCLI. The rulers<\/code> command displays horizontal and vertical rulers<\/strong> around the page. The measurements of the rulers are in pixels<\/strong>. Run the same command to deactivate the ruler.<\/p>\n

    \"Open<\/figure>\n

    12. Open the console & debugger<\/h2>\n

    Command:<\/strong> console open<\/code> and dbg open<\/code><\/p>\n

    If the keyboard shortucts for opening the web console or the debugger tool<\/strong> have slipped your mind, no worries, just type the simple command console open<\/code> or dbg open<\/code> into the Firefox Command Line to open the respective tool.<\/p>\n

    \"Open<\/figure>\n

    13. Count page elements<\/h2>\n

    Command:<\/strong> qsa <selector><\/code><\/p>\n

    This nifty command from GCLI takes a quick census of elements in a web page that match any given CSS selector<\/strong>. For instance, to get count of all <a><\/code> elements on a page, use the qsa a<\/code> command.<\/p>\n

    \"Count<\/figure>\n

    14. Enable or disable add-ons<\/h2>\n

    Command:<\/strong> addon list<\/code><\/p>\n

    If you ever need to survey and manage your Firefox add-ons, I recommend you to use the GCLI commands rather than the Add-ons menu<\/strong> because the GCLI version lists all add-ons and plugins, including the pre-installed ones<\/strong>, that may not be listed in the Add-ons menu.<\/p>\n

    You can toggle the add-on status in the GCLI with the command addon<\/code> followed by the relevant sub-command, either enable<\/code> or disable<\/code>.<\/p>\n

    On the demo below you can see how to quickly disable Pocket<\/strong> in Firefox.<\/p>\n

    \"Enable<\/figure>\n

    15. Manage settings<\/h2>\n

    Command:<\/strong> pref show <setting><\/code><\/p>\n

    There are tons of customization settings<\/strong> users can access via Firefox\u2019s about:config<\/code> page. The same settings can be viewed and modified using the GCLI as well.<\/p>\n

    Using GCLI for accessing the customization settings is the quicker option<\/strong> if you already know which configuration you want to view or change. To set a value for a setting<\/strong>, use the pref set <setting> <value><\/code><\/strong> command, and to reset a setting<\/strong>, type pref reset <setting><\/code><\/strong>.<\/p>\n

    On the demo below you can see how to check the URI<\/strong> the inject jQuery<\/code> command has injected into the page (see section #9 in this article):<\/p>\n

    \"Manage<\/figure>\n

    \n\t\t\t\t\tRead Also:<\/strong>\u00a0\n\t\t\t\t\t10 Useful Firefox Developer Tools<\/a>\n\t\t\t\t<\/p>","protected":false},"excerpt":{"rendered":"

    No matter how many fancy buttons and menus we\u2019ve got, there are always programmers who appreciate command line access in their work environment, especially when it eliminates a hunt for the right button or menu that displays the needed setting in our line of sight. Firefox has had a Graphical Command Line Interpreter, or in…<\/p>\n","protected":false},"author":145,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[352],"tags":[34,511],"topic":[4520],"class_list":["entry-content","is-maxi"],"acf":[],"yoast_head":"\n15 GCLI Commands in Firefox for Front-End Developers - Hongkiat<\/title>\n<meta name=\"description\" content=\"No matter how many fancy buttons and menus we've got, there are always programmers who appreciate command line access in their work environment,\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.hongkiat.com\/blog\/firefox-graphical-command-line\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"15 GCLI Commands in Firefox for Front-End Developers\" \/>\n<meta property=\"og:description\" content=\"No matter how many fancy buttons and menus we've got, there are always programmers who appreciate command line access in their work environment,\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/firefox-graphical-command-line\/\" \/>\n<meta property=\"og:site_name\" content=\"Hongkiat\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/hongkiatcom\" \/>\n<meta property=\"article:published_time\" content=\"2018-11-29T15:13:10+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-04-06T11:00:46+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/firefox-graphical-command-line\/ff-gcli-screenshot.jpg\" \/>\n<meta name=\"author\" content=\"Preethi Ranjit\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:site\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Preethi Ranjit\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"7 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/firefox-graphical-command-line\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/firefox-graphical-command-line\\\/\"},\"author\":{\"name\":\"Preethi Ranjit\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/e981676afae36d1ff5feb75094950ab3\"},\"headline\":\"15 GCLI Commands in Firefox for Front-End Developers\",\"datePublished\":\"2018-11-29T15:13:10+00:00\",\"dateModified\":\"2023-04-06T11:00:46+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/firefox-graphical-command-line\\\/\"},\"wordCount\":1336,\"commentCount\":1,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/firefox-graphical-command-line\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/firefox-graphical-command-line\\\/ff-gcli-screenshot.jpg\",\"keywords\":[\"Firefox\",\"Web Developers\"],\"articleSection\":[\"Web Design\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/firefox-graphical-command-line\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/firefox-graphical-command-line\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/firefox-graphical-command-line\\\/\",\"name\":\"15 GCLI Commands in Firefox for Front-End Developers - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/firefox-graphical-command-line\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/firefox-graphical-command-line\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/firefox-graphical-command-line\\\/ff-gcli-screenshot.jpg\",\"datePublished\":\"2018-11-29T15:13:10+00:00\",\"dateModified\":\"2023-04-06T11:00:46+00:00\",\"description\":\"No matter how many fancy buttons and menus we've got, there are always programmers who appreciate command line access in their work environment,\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/firefox-graphical-command-line\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/firefox-graphical-command-line\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/firefox-graphical-command-line\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/firefox-graphical-command-line\\\/ff-gcli-screenshot.jpg\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/firefox-graphical-command-line\\\/ff-gcli-screenshot.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/firefox-graphical-command-line\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"15 GCLI Commands in Firefox for Front-End Developers\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"name\":\"Hongkiat\",\"description\":\"Tech and Design Tips\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\",\"name\":\"Hongkiat.com\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"contentUrl\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"width\":1200,\"height\":799,\"caption\":\"Hongkiat.com\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/hongkiatcom\",\"https:\\\/\\\/x.com\\\/hongkiat\",\"https:\\\/\\\/www.pinterest.com\\\/hongkiat\\\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/e981676afae36d1ff5feb75094950ab3\",\"name\":\"Preethi Ranjit\",\"description\":\"A .NET developer with a JavaScript background, Preethi is expert in front-end coding, JavaScript, HTML, and CSS.\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/author\\\/preethi\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"15 GCLI Commands in Firefox for Front-End Developers - Hongkiat","description":"No matter how many fancy buttons and menus we've got, there are always programmers who appreciate command line access in their work environment,","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.hongkiat.com\/blog\/firefox-graphical-command-line\/","og_locale":"en_US","og_type":"article","og_title":"15 GCLI Commands in Firefox for Front-End Developers","og_description":"No matter how many fancy buttons and menus we've got, there are always programmers who appreciate command line access in their work environment,","og_url":"https:\/\/www.hongkiat.com\/blog\/firefox-graphical-command-line\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2018-11-29T15:13:10+00:00","article_modified_time":"2023-04-06T11:00:46+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/firefox-graphical-command-line\/ff-gcli-screenshot.jpg","type":"","width":"","height":""}],"author":"Preethi Ranjit","twitter_card":"summary_large_image","twitter_creator":"@hongkiat","twitter_site":"@hongkiat","twitter_misc":{"Written by":"Preethi Ranjit","Est. reading time":"7 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hongkiat.com\/blog\/firefox-graphical-command-line\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/firefox-graphical-command-line\/"},"author":{"name":"Preethi Ranjit","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/e981676afae36d1ff5feb75094950ab3"},"headline":"15 GCLI Commands in Firefox for Front-End Developers","datePublished":"2018-11-29T15:13:10+00:00","dateModified":"2023-04-06T11:00:46+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/firefox-graphical-command-line\/"},"wordCount":1336,"commentCount":1,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/firefox-graphical-command-line\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/firefox-graphical-command-line\/ff-gcli-screenshot.jpg","keywords":["Firefox","Web Developers"],"articleSection":["Web Design"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.hongkiat.com\/blog\/firefox-graphical-command-line\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/firefox-graphical-command-line\/","url":"https:\/\/www.hongkiat.com\/blog\/firefox-graphical-command-line\/","name":"15 GCLI Commands in Firefox for Front-End Developers - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/firefox-graphical-command-line\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/firefox-graphical-command-line\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/firefox-graphical-command-line\/ff-gcli-screenshot.jpg","datePublished":"2018-11-29T15:13:10+00:00","dateModified":"2023-04-06T11:00:46+00:00","description":"No matter how many fancy buttons and menus we've got, there are always programmers who appreciate command line access in their work environment,","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/firefox-graphical-command-line\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/firefox-graphical-command-line\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/firefox-graphical-command-line\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/firefox-graphical-command-line\/ff-gcli-screenshot.jpg","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/firefox-graphical-command-line\/ff-gcli-screenshot.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/firefox-graphical-command-line\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.hongkiat.com\/blog\/"},{"@type":"ListItem","position":2,"name":"15 GCLI Commands in Firefox for Front-End Developers"}]},{"@type":"WebSite","@id":"https:\/\/www.hongkiat.com\/blog\/#website","url":"https:\/\/www.hongkiat.com\/blog\/","name":"Hongkiat","description":"Tech and Design Tips","publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.hongkiat.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.hongkiat.com\/blog\/#organization","name":"Hongkiat.com","url":"https:\/\/www.hongkiat.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","contentUrl":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","width":1200,"height":799,"caption":"Hongkiat.com"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/hongkiatcom","https:\/\/x.com\/hongkiat","https:\/\/www.pinterest.com\/hongkiat\/"]},{"@type":"Person","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/e981676afae36d1ff5feb75094950ab3","name":"Preethi Ranjit","description":"A .NET developer with a JavaScript background, Preethi is expert in front-end coding, JavaScript, HTML, and CSS.","url":"https:\/\/www.hongkiat.com\/blog\/author\/preethi\/"}]}},"jetpack_featured_media_url":"https:\/\/","jetpack_shortlink":"https:\/\/wp.me\/p4uxU-7qN","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/28569","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/users\/145"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/comments?post=28569"}],"version-history":[{"count":3,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/28569\/revisions"}],"predecessor-version":[{"id":65565,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/28569\/revisions\/65565"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=28569"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=28569"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=28569"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=28569"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}