dwyl / dwyl/dev-setup

How To Use `Firefox` to take Mobile-first Screenshots *Fast* on Any OS

Open
#55 1 comment 0 reactions 0 assignees View on GitHub
discuss enhancement technical
Dominant language
No language data
Stars
84
Forks
22
PR merge metrics
No merged PRs in 30d

Description

> If you don't _already_ have **`Firefox`** installed, download and install it: #9 "Install a Dev Browser"! Do it _now_! ⏳

Once you have **`Firefox`** installed, open the Application.

In the top-right corner of the Firefox window, click on the "3 Horizontal Lines" (pancakes) Menu, Then Click on "More tools":
![firefox-menu-more-tools](https://user-images.githubusercontent.com/194400/204639785-87ad2556-5ee7-4470-8749-40e7974e622b.png)

In the "More Tools" sub-menu, click on "Customise Toolbar":
![firefox-customise-toolbar](https://user-images.githubusercontent.com/194400/204640113-8221665c-947f-4d0a-ac28-a2c92ffc9776.png)

Drag the "Screenshot" icon to your toolbar:

![firefox-customise-toolbar-drag-screenshot-icon-to-toolbar](https://user-images.githubusercontent.com/194400/204641867-849b5c0b-f7aa-4c1b-a077-1a169bf876fe.png)

You should end up with the following:

![firefox-toolbar-with-screenshot-icon](https://user-images.githubusercontent.com/194400/204641901-02e2181d-9d9d-4405-b946-98b2e9c6ee20.png)

Once you have everything setup, it's easy to take full-screen screenshots by clicking on the "Screenshot" (scisors) icon
followed by "**Save full page**":

![firefox-take-full-screenshot](https://user-images.githubusercontent.com/194400/204643060-a398adf7-3fef-488f-8266-5e3af7c4bb8a.png)

Once you've taken the screenshot, you can click "Copy":
![firefox-copy-screenshot](https://user-images.githubusercontent.com/194400/204643366-21942afe-1fa1-4c7f-9305-cc3ad9ab19f1.png)

And paste the screenshot into any GitHub Issue Comment:

![firefox-mobile-first-screenshot](https://user-images.githubusercontent.com/194400/204644019-befd0624-7c1a-4cb4-982c-5a8467200562.png)

This excludes all the browser chrome including the URL.

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.