A date or date like superscript (delete for large H1 title)

A Centered title that wraps and can be any number of lines you need. This is also the current page title.

Optional subtitle, which is best used when no "date" is used. A Centered paragraph that wraps and can be any number of lines you need

This goes together with the body text (left aligned) and is the first paragraph of the article. Rarely used with subtitle.

Page Title (H3)

You can use any of the Markdown Titles including # and ## for H1 and H2. But given we use those for the top of the page it is recommended to use ### H3 or #### H4 for the section page titles.

Body Text (Left Aligned)

All body text is left aligned and wraps to the width of the page. You can use any of the Markdown formatting options including:

  • Bold text using ** or __ (ex: Dennis)
  • Italics using * or _ (ex: Dennis)
  • Strikethrough using ~~ (ex: Dennis)
  • Links using [text](url) (ex: Dennis)
  • Inline code using ` (ex: Dennis)
  • Emoji using :emoji: (ex: 😄 👍 ✨ 🐫 🎉)
  • Comments using <!-- --> (ex: ... )

(if you need a line break, add two space characters at the end of the line, or force it with <br><br>)

  • Blockquotes using > ;
  • Code blocks using
  • Horizontal lines using ---;
  • Unordered lists using - or *
  • Ordered lists using 1.
  • Tables using | and - (see below)
  • Images using ![alt text](url)

Custom Components:

  • A Button using: ::LinkButton{link="/jobs"} ...
  • Tiny text using: ::Notabene ...

Blockquotes

Blockquotes are very handy to show what some other smart person said. Quotes " are added automatically when you use the > character. You can add some (not all) additional markdown inside a blockquote

I have started investigating how reflect.run built their browser-in-browser solution. It's a very interesting approach and I'm excited to see where it goes.

Code Blocks

You can use three backticks to create a code block. You can also specify the language of the code block to get syntax highlighting (which we are yet to add, but we should add the language anyway for the future).

function generatePrime() {
  var prime = 1;
  while (true) {
    prime += 1;
    if (isPrime(prime)) {
      return prime;
    }
  }
}

Horizontal Line


Tables

You can add tables using | and - characters. The first row is the header, the second row is the separator, and the rest are the data.

SyntaxDescription
HeaderTitle
ParagraphText

Lists

Unordered

  • Item 1
  • Item 2
    • Item 2a
    • Item 2b

Ordered

  1. Item 1
  2. Item 2
  3. Item 3
    1. Item 3a
    2. Item 3b

Table

Rural CountyApproximate total Host income in 2022
lexander$592,000
Alleghany$1,124,000
Anson$48,000
Ashe$5,631,000

Images

You can add images using ![alt text](url). The alt text is used for accessibility

Image from internal folder

LaunchBrightly Create Edition

Image from external URL

We should try to avoid this, and always use images from our own CDN alt text

FancyImage

An image place to the left of the prose

::FancyImage
---
img: https://news.airbnb.com/wp-content/uploads/sites/4/2023/03/Converted-Pub-Ireland-newsroom.jpeg?w=3000
format: square
align: left
---
::

FancyQuote

See about page for example!

::FancyQuote
---
img: /images/people/dennis2.jpg
---
If you don't know who I am, then maybe your best course would be to tread lightly 
#who
Walter White
::

Button

::LinkButton{link="/jobs"}
See opportunities
::

Tiny Text

Typically used below images to add a caption or to add a note to the reader.

::Notabene
† Don't see what you're looking for? Email jobs @ launchbrightly.com. We'd love to hear from you! :-)
::
† Don't see what you're looking for? Email jobs @ launchbrightly.com. We'd love to hear from you! :-)

</end> :)