|
| 1 | +# Symbiota Docs Documentation Style Guide |
| 2 | +Please refer to and update this style guide to help maintain consistency and readability across the user documentation for [Symbiota](https://github.com/BioKIC/Symbiota). |
| 3 | + |
| 4 | +## Page-level Frontmatter |
| 5 | +Each page in Symbiota Docs should contain the following elements, some of which format the citations on the bottom of each page: |
| 6 | +``` |
| 7 | +title: "Page Title in Title Case" |
| 8 | +date: 20XX-MM-DD |
| 9 | +weight: # |
| 10 | +draft: false |
| 11 | +authors: ["Firstname Lastname"] |
| 12 | +keywords: ["x", "y", "z", "etc"] |
| 13 | +``` |
| 14 | +- `date` should refer to the first day that the page was created, not modified (see below). |
| 15 | +- Title values should be succinct and often reflect an action using a gerund, e.g. "Deleting Records". |
| 16 | + |
| 17 | +If a page is modified, add values for `lastmod` and `editors`: |
| 18 | +``` |
| 19 | +lastmod: 20XX-MM-DD |
| 20 | +editors: ["Firstname Lastname"] |
| 21 | +``` |
| 22 | + |
| 23 | +Include a weight value (an integer) to organize the order in which a page's title appears within the left-hand navigation menu in Symbiota Docs. It's best to keep the organization alphabetical: |
| 24 | +``` |
| 25 | +weight: # |
| 26 | +``` |
| 27 | + |
| 28 | +## Formatting Conventions |
| 29 | + |
| 30 | +Introduce the topic on a page using classes, e.g. |
| 31 | +``` |
| 32 | +{{< notice info >}} |
| 33 | + This Symbiota Docs page is about... |
| 34 | +{{</ notice >}} |
| 35 | +``` |
| 36 | +Or to add tips: |
| 37 | +``` |
| 38 | +{{< notice tip >}} |
| 39 | + Here's a tip about this feature... |
| 40 | +{{</ notice >}} |
| 41 | +``` |
| 42 | + |
| 43 | +Use _italics_ for: |
| 44 | +- Filenames, e.g. _identifications.csv_ |
| 45 | +- Names of columns/fields, e.g. _Additional Identifier Value_ or _basisOfRecord_ |
| 46 | +- File and navigation paths paired with carrots, e.g. _My Profile > Occurrence Management > Administration Control Panel_ or _Sitemap > Additional Resources > Glossary_ |
| 47 | + |
| 48 | +Use quotation marks `"..."` when referencing: |
| 49 | +- Example values, e.g. "PreservedSpecimen" |
| 50 | +- Buttons, e.g. "Create/Refresh Darwin Core Archive" |
| 51 | + |
| 52 | +Use capitalization for: |
| 53 | +- Tabs, e.g. Traits tab |
| 54 | +- Modules, e.g. Material Sample module |
| 55 | + |
| 56 | +Use **bold** for: |
| 57 | +- emphasis, e.g. "Before batch editing, remember to **backup your dataset**". |
| 58 | + |
| 59 | +For code and commands: |
| 60 | +- Format shorter code snippets with \`...\`, e.g. `bundle exec jekyll serve`. |
| 61 | +- More extensive code and commands can be recorded à la: |
| 62 | +``` |
| 63 | +{{< highlight batchfile >}} |
| 64 | +cd Documents/symbiota-docs/ |
| 65 | +hugo server -D |
| 66 | +{{< /highlight >}} |
| 67 | +``` |
| 68 | + |
| 69 | +Additionally: |
| 70 | +- Top-level headings within documentation pages should use `##` and generally should be written in title case. |
| 71 | +- File extensions written as part of a filename are lowercase, e.g. *example.jpg*, but when written alone are uppercase, e.g. "The file should be a JPG." |
| 72 | + |
| 73 | +## Including Media |
| 74 | +To include a basic image with a caption, do so e.g.: |
| 75 | +``` |
| 76 | +{% include figure image_path="/symbiota-docs/static/images/edittaxon.png" alt="alt text goes here" caption="Figure caption text goes here." %} |
| 77 | +``` |
| 78 | + |
| 79 | +``` |
| 80 | +|  | |
| 81 | +|:--:| |
| 82 | +| Caption. | |
| 83 | +``` |
| 84 | + |
| 85 | +To include a basic image without a caption, do so e.g.: |
| 86 | +``` |
| 87 | + |
| 88 | +``` |
| 89 | +To resize, align, or add an alt attribute (for screenreaders) to an image: |
| 90 | +``` |
| 91 | +<img src="/symbiota-docs/static/images/filename.png" alt="Description of image" width="100"/>{: .align-right} |
| 92 | +``` |
| 93 | + |
| 94 | +To include a video, do so e.g.: |
| 95 | +``` |
| 96 | +{{< youtube ed2VEZCJwEI >}} |
| 97 | +``` |
| 98 | + |
| 99 | +## Naming Files |
| 100 | +Markdown files (.md) being added to Symbiota Docs should be named descriptively yet succinctly. Do not use any character other than `a-z`. |
| 101 | + |
| 102 | +Image files should be named descriptively in lowercase. Do not use any character other than `a-z`, `-`, or `_`. Images (.png, .jpg) should be saved to `/symbiota-docs/tree/master/static/images`. |
| 103 | + |
| 104 | +## Related Resources |
| 105 | +- [GitHub Formatting Syntax](https://docs.github.com/en/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax) |
| 106 | +- [Markdown Guide's Cheatsheet](https://www.markdownguide.org/cheat-sheet/) |
| 107 | +- [Markdown Emojis Directory](https://gist.github.com/rxaviers/7360908) |
0 commit comments