title | permalink |
---|---|
Starting a New Theme |
/new-theme/ |
- Activate the theme for which you wish to create thumbnails.
- Open your test site's homepage in Firefox Developer Edition.
- If you're logged in, add
/?_bare
to the end of the url to remove the admin toolbar. - Open Responsive Design Mode (cmd + opt + m).
- Above the responsive page frame, enter the page dimensions for your screenshot (for mobile, 320x576; for desktop, 1280x800).
- Ensure the control bar above your page's dimensions says "DPR: 1". If it says something else (like "DPR: 2"), click it and select "DPR: 1" instead.
- On the right of the control bar above your page dimensions, click the camera icon.
- Open your Downloads folder to see the screenshot.
- Open ImageOptim and drag your new screenshots into the software.
- Observe that the screenshots' file sizes have been greatly reduced.
- Move the files to the root folder of the appropriate theme (ex. SUThemeGumwood/).
- Rename the screenshots to
desktop.png
,phone.png
,desktop~asc.png
, etc, as appropriate.