Overview
You may add User Styles to add CSS styles to your book. CSS styles control the appearance of the content, i.e., the colors, spacing, background images, etc.
In each User Style item, you may enter up to five rules. For each rule, you enter a CSS selector to determine which HTML elements to modify and a set of CSS parameters to specify the actual modifications.
The Edit Menu in the User Style window includes the Copy User Style and Paste User Style commands. See Copy / Paste User Style on the Edit Menu help page for usage instructions.
Properties
Title
All User Style items have a Title property. Enter a title that will remind you of the purpose or use of the User Style.
Enabled
Enabled. The default value is checked.
The Enabled checkbox controls whether or not the CSS rules in the item are processed when Gedcom Publisher is making the book. If Enabled is unchecked, all the rules in the section are ignored.
Property Pairs
Each User Style includes five pairs of properties. selector-1 and parameters-1 are a pair, selector-2 and parameters-2 are a pair, etc.
The selector-N properties are for CSS selectors. Selectors are patterns used to select the elements you want to style. When an HTML element matches the selector pattern, the parameters paired with that selector are applied to the element.
It is beyond the scope of this help system to describe CSS selectors and parameters, but you can learn about them on the web. You can also ask for help on the Gedcom Publisher mailing list where users with CSS expertise can help you achieve your goal.
Step by Step
Example 1: To add a User Style by manually entering the selector and parameters, follow these steps:
- With your Gedcom Publisher file open, go to the User Styles section. Sections are listed in a list on the left-hand side of the main window.
- Click the [+] button under the list of User Styles on the right hand side of the main window. Select the only item in the sublist, which is "User Style". That will open the Add User Style window.
- Enter a title that will remind you of the purpose or use of the User Style.
- In the
selector-1
textbox, enter the CSS "selector". A selector is a pattern that matches one or more HTML elements; for example, the selector "td
" matches all TD (table data cell) elements, and the selector ".myclass
" matches any element that hasclass="myclass"
. - In the
parameters-1
textbox, enter the CSS parameters. For example, to assign the font-weight, enter "font-weight: bold
". You may specify multiple parameters by separating them with the ";" character: "font-weight: bold; color: #ff0000
" - Click [OK] to save the User Style and close the Add User Style window.
Example 2: To add a User Style from text sent to you in an email message:
- With the email message open in your email client, select the text and copy it. The text will have this general format:
selector-1: .myclass parameters-1: font-weight: bold;
The actual selector and parameter values will be different, and there may be multiple of them, including
selector-2
, etc. - With your Gedcom Publisher file open, go to the User Styles section. Sections are listed in a list on the left-hand side of the main window.
- Click the [+] button under the list of User Styles on the right hand side of the main window. Select the only item in the sublist, which is "User Style". That will open the Add User Style window.
- Enter a title that will remind you of the purpose or use of the User Style.
- Select the Paste User Style command from the
Edit menu. Gedcom Publisher will paste the text into the appropriate textboxes.
- Click [OK] to save the User Style and close the Add User Style window.