hy(de)blog

a hybrid blog

Styles

A kitchen sink for supported styles via Markdown. Oh, and here's a footnote. 1

Table of Contents

Paragraphs
Emphasis
Headers
Lists
Links
Images
Code and Syntax Highlighting
Blockquotes
Horizontal Rule
Content Filters

Paragraphs

Paragraphs are boring, yet here I am typing out this sentence. Ok, I'm bored now. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc vitae dignissim sem. Aenean id eros auctor, molestie arcu at, viverra eros. In venenatis, elit eget porta convallis, dui tortor eleifend nisi, ut tempor ante risus in felis. Suspendisse potenti. Pellentesque at pharetra erat, et tempus lacus. Vivamus porttitor tortor porttitor odio feugiat dignissim. Vestibulum id pellentesque arcu, quis facilisis mauris.

Phasellus odio dui, mattis eget risus vel, laoreet sollicitudin turpis. Mauris feugiat nisl eu bibendum accumsan. Nullam porta tempor est, vitae dignissim urna. Curabitur imperdiet euismod sem, vitae pellentesque nulla maximus a. Donec sit amet placerat dolor. Nam et sem lacus. Aliquam tempus sem non orci volutpat iaculis.

Emphasis

Emphasis, aka italics, with asterisks or underscores.

Strong emphasis, aka bold, with asterisks or underscores.

Combined emphasis with asterisks and underscores.

Strikethrough uses two tildes. Scratch this.

Ut vestibulum scelerisque sagittis. Nam consectetur erat quam, at tincidunt enim euismod ac.

Morbi gravida pretium enim sed posuere. Morbi pretium nisl ut gravida ultricies. Phasellus malesuada pellentesque nisl. Sed quis magna auctor, tincidunt mi id, viverra tellus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Quisque interdum mi ac dui egestas, quis vestibulum turpis aliquam.

Headers

H1

H2

H3

H4

H5
H6

Lists

  1. First ordered list item
  2. Another item
  3. Actual numbers don't matter, just that it's a number
    1. Ordered sub-list
    2. and another item
  4. And another item.
  • Unordered list
  • and another item
  • one more for fun
    • sub list
    • sub list item
      • sub sub list
      • sub sub list item
    • backing out
  • backing out a bit more

Links

I'm an inline-style link

I'm an inline-style link with title

I'm a reference-style link

I'm a relative reference to a repository file

You can use numbers for reference-style link definitions

Or leave it empty and use the link text itself.

URLs and URLs in angle brackets will automatically get turned into links. http://www.example.com or http://www.example.com and sometimes example.com (but not on Github, for example).

Some text to show that the reference links can follow later.

Images

See more regarding images in teh content filter page.

Here's our logo (hover to see the title text):

Inline-style: alt text

Reference-style: alt text

Code and Syntax Highlighting

Inline code has back-ticks around it.

Blocks of code are either fenced by lines with three back-ticks ```, or are indented with four spaces. I recommend only using the fenced code blocks -- they're easier and only they support syntax highlighting.

var s = "JavaScript syntax highlighting";
alert(s);
s = "Python syntax highlighting"
print s
No language indicated, so no syntax highlighting. 
But let's throw in a <b>tag</b>.

Blockquotes

Support for <cite> tags within a <blockquote> is made easy with content filters

Blockquotes are very handy in email to emulate reply text. This line is part of the same quote.

Quote break.

This is a very long line that will still be quoted properly when it wraps. Oh boy let's keep writing to make sure this is long enough to actually wrap for everyone. Oh, you can put Markdown into a blockquote.

— cite

Horizontal Rule

A standard <hr>:



And a custom, 33% centered, <hr> using a content filter:

Content Filters

All of the following styles are made possible by the custom content filters. View the filters page for details on how to create these styles.

Standard HTML Tags

  • highlighting
  • deleting
  • underlining
  • superscript

    Details Header
    And some summary text



Custom HTML

Custom Inline Badge:

Custom Badge to be added inline to draw attention to things

Blockquote Citations:

"This is a quotation."

—with a citation

Media

Audio Player:



Non-Youtube Player:



Youtube Player:



.Webp Images:

  1. Footnote display & animations via bigfoot.js ↩