My booklets

A booklet is a small website made of snippets. It has one root and any number of pages.

• The root holds the booklet's CSS and stylepack, its name, description and folder name. It isn't a page itself: it has no address of its own.
• Each page is a snippet with its own HTML. A new page starts as a copy of the root, so it gets the root's HTML, CSS, SVGs and active stylepack.

The Booklet table

The table lists your Local booklets (stored in this browser) and your Remote ones (stored on the server, visible when you're signed in). Select a booklet to make it the current one.

• Edit opens the Booklet page.
• Upload saves the whole booklet on the server: the root and all its pages.
• Download loads a local instance of the remote booklet. Download is not possible while the local booklet has changes that aren't uploaded.
• Delete local and Delete remote delete the booklet and all its pages, locally or on the server.

Root

• Edit: the booklet's name, description and folder name. The folder name is the first part of every address of the booklet.
• Update page CSS and SVGs replaces the CSS, stylepack and SVGs of every page with a copy of the root's current CSS, active stylepack and SVGs. Each page keeps its own HTML. Use it after changing the root's CSS or SVGs.
• Publish makes the booklet public (see below).
• Stylepacks, Code import, Snippet import and Tidy snippet CSS work like for standalone snippets:
  • Stylepacks: choose and edit the root's stylepack: colours, fonts and settings.
  • Code import: paste HTML and CSS code, and import to the root.
  • Snippet import: copy HTML, CSS or SVGs from one of your standalone snippets into the root.
  • Tidy snippet CSS: remove CSS and SVGs that neither the root's HTML nor its pages' HTML uses.

Pages

• Tree shows the pages in their order and nesting. One page is always selected: the one you clicked, otherwise the first. Add pages, copy the selected page (the copy comes right after it, named "… (copy)"), move them, or delete them (or keep them as standalone snippets).
• Edit: the selected page's name, description and file name. The file name is the last part of the page's address.
• Code import and Snippet import bring HTML into the selected page. CSS and SVGs in what you import are skipped, with a warning: add them on the root.

Editing in the Editor

The Editor always edits the active snippet. To edit a booklet's root or one of its pages:

1. Make it active:
   • the root: select it in the Booklet table;
   • a page: select its root in the Booklet table; click Edit booklet; in Pages › Tree select the page.
2. Open the Editor in the top navigation. Its snippet list at the top shows the active snippet, the one you're editing. You can also switch here to another local Booklet or standalone Snippet.

What you can edit:

• Root: everything, as for a standalone snippet: HTML, Selector, Property and SVG. Changes to its CSS and SVGs reach the pages only when you click Update page CSS and SVGs.
• Page: HTML only. Style it with the classes it got from the root, under Assign CSS, and add the root's SVGs to it with an HTML svg element. A page has no Selector, Property and SVG: its CSS and SVGs are always a copy of the root's. To change the CSS of all pages, edit it on the root, then click Update page CSS and SVGs.

Your edits are saved in this browser as you go. To put them on the server, use Upload; to make them public, click Publish in Booklet › Root › Edit.

Tables of contents

On a page, Add HTML › Booklet › Booklet TOC inserts the booklet's table of contents as plain HTML: nested lists with a link to every page. The link to the page you add it to is marked as the current page (aria-current="page"), so screen readers announce it and you can style it. You can style and edit it freely.

Tables of contents in your pages aren't updated automatically. After changing the page structure (adding, moving, renaming or deleting pages), update them in the pages by hand: delete each TOC and add it again.

Publishing

Publish on the root uploads any unsaved changes and makes the booklet and all its pages public:

• every page at /folder/file-name;
• the first page also at /folder, the booklet's start page.

Changes go live only when you publish again (Publish changes). Unpublish takes the booklet offline.