Catalog Post Tutorial

A catalog post is a post that will appear in the catalog section of Spotted. These posts are meant to be educational and to-the-point descriptions of a single species of plant (or fungi). They provide easy to read data about the plant, and offer further instruction on caring for the plant. They may include interesting facts about the plant, or other information that gives the plant context.

📝 Writing your own

To write your own post, begin by opening a text editor and creating a new markdown (.md) file. This file should be named with the date first (using the international standard), followed by the title of the post (the plant's common name). Use dashes to separate words, for example: 2018-06-18-Birds-Nest-Fern.md.

Next, copy the following template into the file.

---
layout: post
common-name: <ENTER COMMON NAME HERE>
author: <YOUR NAME HERE>
image: /images/<IMAGE NAME HERE>
data:
  latin-name: <LATIN NAME>
  native-to: <NATIVE REGION>
  ideal-climate: <CLIMATE>
  type: <ANNUAL OR PERENNIAL>
  height-range: <HEIGHT RANGE>
  sun: <SUN PREFERENCE>
  water: <WATER PREFERENCE>
---

<FURTHER DESCRIPTION HERE>

It is extremely important that you do not change anything that is not wrapped in < > brackets. This includes the dashes and layout type. If you are using a text editor primarily meant for "normal" writing, it may try to change the dashes into the longer "em dash" (changing - to —). This may seem like a small difference, but it will stop the page from loading, and should be carefully avoided (either by disabling the feature, copying the correct character, or using a different editor).

📊 Data and descriptions

Make sure to replace all the data tags with the correct information about the plant. For example, replace water: <WATER PREFERENCE> with water: infrequently. Make sure to use capital letters where appropriate (such as the Latin name). If a certain data tag does not apply to the plant, leave it blank, but remove the boilerplate < > text (so sun: <SUN PREFERENCE> becomes just sun: ). If it is not clear what one of the data tags is for, view other plants to see what each tag means.

Replace the <FURTHER DESCRIPTION HERE> text with your own words, describing the plant. Avoid re-explaining facts already covered by the data above, and instead consider including how-to-care-for guides, interesting facts, or more detailed descriptions. To include links, headers, lists, or styled text, use the standard markdown syntax.

Result	Syntax
link text	[link text](https://)
Header	## Header
• unordered list	- unordered list element
1. ordered list	1. ordered list element
italic text	*italic text*
bold text	**bold text**

🌿 Plant image

At the top of the page, a large (usually watercolor) image of the plant is displayed. Make sure this image is saved as a .png or .jpeg, and has a pure white background. The image should have dimensions of 350x350, otherwise it may appear warped or pixelated. Copy the name of this image to <IMAGE NAME HERE>. The name must match exactly. For example, the file lavendar.png would be added like so: image: /images/lavendar.png (note: the /images/ filepath is not wrapped in < > brackets, and therefore it must stay).

💻 Uploading to Github

Place the finished .md file into the catalog/_posts folder, and the corresponding image into the images folder. This can be done via the Github Desktop client, or by uploading the files directly on the Github page. Remember to commit, and push these changes. It may take about a minute for the website to update with your post.