The overall style and format of Notebooks’ formatted documents is defined by the selected Document Style, which includes settings like hyphenation, line spacing, size and weight of headings, size and decoration of images etc.
The style is an inherited attribute which can be set at several levels:
- Globally in Notebooks’ settings
- For a book and its contents in a book’s info
- For a single document in the document’s info
If you want to go beyond Notebooks’ pre installed styles (and if you are familiar with cascading style sheets), you can easily define and add your own styles.
Add and Edit Styles on iPad or iPhone
- In Notebooks’ Settings > Write and Edit > Document Style select Add Your Own
- An editing window appears and displays the minimum settings that required for a style. Please note the placeholders for font, font size and other parameters that will be filled in automatically from a document’s settings.
- You are free to add and modify the style sheet to your liking. When you are done, tap Save and your new style will become available in the list of installed styles.
Custom styles are saved in a hidden book (NBResources/CSS) at Notebooks’ top level. This makes sure that styles you add on one device are synced and become available on all your other devices, too.
If you want to open/edit the styles like regular documents on your iPhone or iPad, just search Notebooks for NBResources and the hidden book will appear.
Add and Edit Styles on Mac or PC
If you use Dropbox or WebDAV to sync your documents, or if you are using Notebooks for Mac or PC, you can access and edit the styles directly from the NBResources/CSS folder at the top level of your sync folder, or Notebooks’ Home respectively.
In case the folder does not yet exist, feel free to create it (in Finder or Windows Explorer) and add your own css files.
A few style sheets are available in the download area; they can be a good starting point for your own styles.
Add Notebooks’ attributes to your CSS
If you want to dynamically include Notebooks’ settings for text alignment, hyphenation, font and colors you need to add a couple of variables to your CSS. The simplest way of doing that is to add the following lines to the
body section of your style sheet (as you can see in our default theme: