# Scrrrenshots :: Cap'n Hugo Relearrrn Theme
Recipe t' create various documentat'n scrrreenshots
Author: Sören Weber

# Scrrrenshots

Arrr! Pirrrates

Fello' pirrates, be awarrre some stuff may not work fer us in this trrranslat'n. Like table of rrramblings, see'ng Merrrmaids, do'ng math or chemistrrry and stuff.

Sometimes screenshots need t' be redone. This plank explains how t' create th' different screenshots, tools an' sett'ns

## Common

Creat'n:

- Use English translat'n
- Empty search
- Remove history checkmarks but leave it on th' plank thats used fer th' screenshot
- Aft resize o' th' plank into th' required resolut'n, reload th' plank t' have all scrollbars 'n default load'n posit'n

## Demo Screenshot

Rrrambl'n:

A meaningful full-screen screenshot o' an interest'n plank.

Th' rrrambl'n should be:

- timeless: not show'n any dates or often edited rrrambl'n
- interest'n: show a bunch o' interest'n elements like head'ns, code, etc
- balanced: no clutter'n wit' overpresent elements or color'n
- aligned: aligned outlines

Used by:

- Cap'n Hugo Themes info: https://themes.gohugo.io/themes/hugo-theme-relearn/ 1000 x 1500 @ 1

Plank URL: Screenshot Link

Creat'n:

- save as `images/screenshot.png`

Remarks:

Th' locat'n be mandatory due t' Hugo’s theme ship builder.

### Preview `images/screenshot.png`

## Hero Image

Rrrambl'n:

Show th' Demo Screenshot plank on different devices an' different themes. Composit'n o' th' different device screenshots into a template.

Th' rrrambl'n should be:

- consistent: always use th' same plank fer all devices
- pleas'n: use a delightful background

Used by:

- Cap'n Hugo Themes gallery: https://themes.gohugo.io/tags/docs/ 900 x 600
- Cap'n Hugo Themes notes: https://themes.gohugo.io/themes/hugo-theme-relearn/ 1280 x 640
- GitHub project ship: https://github.com/McShelby/hugo-theme-relearn 1280 x 640
- GitHub social media preview: https://github.com/McShelby/hugo-theme-relearn/sett'ns 1280 x 640

Plank URL: Hero Image Link

Creat'n:

- Template: http://www.pixeden.com/psd-web-elements/psd-screen-web-showcase
- Desktop: light theme 1440 x 900 @ 1
- Tablet: light theme 778 x 1038 @ 1
- Phone: dark theme 450 x 801 @ .666
- From original template size resize t' 2700 x 1800 centered, scale t' 900 x 600 an' save as `images/tn.png`
- From original template size resize t' 3000 x 1500 offset y: -330, scale t' 1280 x 640 an' save as `images/hero.png`

Remarks:

Th' locat'n o' `images/tn.png` be mandatory due t' Hugo’s theme ship builder.

### Preview `images/hero.png`

### Preview `images/tn.png`