Shared settings
The settings that have the same name and do the same thing in every section of Plain Jane.
Some settings appear in many sections. They always have the same name and the same options, so once you know one, you know them all. Section pages link here instead of explaining them again.
Space above and Space below
Space above and Space below set the empty space at the top and bottom of a section. The section's background color fills that space.
| Option | What you get on desktop | What you get on phones |
|---|---|---|
| None | No space. The section starts and ends at its content. | No space. |
| Small | 48 px | 32 px |
| Medium | 64 px | 48 px |
| Large | 96 px | 64 px |
| Custom | The number you set | The same number |
Choose Custom and a slider appears under the setting: Custom space above or Custom space below, from 0 up to 200 px in steps of 4 (some sections stop at 100 or 120 px). The slider is hidden for every other option.
To make two sections sit closer together, lower Space below on the first one and Space above on the second. The gap you see between them is the two added together.
Things to know:
- Small, Medium and Large are smaller on phones by themselves. Custom is not: 120 px on desktop is 120 px on a phone. If you use Custom, check the phone preview.
- Sections that fill the screen start at None. Most others start at Medium, or at Custom with a number chosen for that section. Each section's page names its starting value.
- You do not need to add space to keep the first section clear of your header. Plain Jane does that for you.
Color scheme
Color scheme sets a section's colors in one choice: its background, its text and headings, its lines and borders, and its buttons. You create and edit schemes in Theme settings, under Color Schemes. Change a scheme there and every section using it changes with it.
Give two neighboring sections different schemes to set one apart from the other. Give them the same scheme to make them read as one.
Each section's page says what the scheme colors there. For example, on Page not found: Crowd the scheme's border color draws the floor's lines.
Height
Height sets how tall a section is, in named steps rather than pixels.
| Option | What you get |
|---|---|
| Small, Medium, Large | Three steps of height. With a shorter step, whatever comes after the section shows sooner. |
| Full screen | The section is as tall as the visitor's screen. |
Not every section offers every step, and a few add one of their own. Page not found: Crowd offers all four. Some sections leave out Small, and the plain "Page not found" section offers only Auto (as tall as its words) and Full screen. Each section's page lists the steps it has and says exactly what they change.
Corners
Corners sets how round something's corners are.
| Option | What you get |
|---|---|
| None | Square corners. |
| Slight | Gently rounded corners. |
| Round | Fully rounded. On a button this is a pill shape. |
Speed
Speed sets how fast an animation plays: Slow, Medium or Fast. It usually appears only after you choose an animation, and starts at Medium.