Using The Built on Cardano Flavor of Markdown

2022-02-12

If you’re posting, planning on posting, or have posted a listing to the Built on Cardano platform then this post is for you! Here you’ll learn how to make the most of our proprietary markdown and how to show your listing in the best possible light! (with no coding skills required!)

What is Markdown?

Markdown is a lightweight language that gives everyone, no matter their level of coding knowledge, the ability to jazz up their text, personalize it to suit their needs, and to display things how they want them to be displayed.

Markdown is universal across devices and applications and is easy to understand because it uses minimal amounts of punctuation to apply formatting to text. Once you’ve learnt markdown you’ll be able to apply it anywhere that allows you too!

As an example of how easy markdown is to use: the above blockquote, and this one, were create with a simple ‘>’, that’s it!

A Flavor?

No, it’s not a shoddy pun! There is a general standard of markdown that can be found here and, just because, this is the website of one of the two creators of the language.

The "flavor" tag come from the fact that anyone can edit the markdown output to suit their own needs. Meaning that the instructional keys are the same but they can be used to denote different outcomes in the text for that particular site or tool. So when someone takes the original form of markdown and tweaks it to suit their needs their new creation is called a "flavor" of markdown 😋


While we want you to have fun personalizing your content with markdown, please don’t forget to follow our content guidelines.

Our content guidelines can be found here and they’re also handily linked above the markdown editor on both our create and edit pages.


Our Flavor of Markdown

Before we begin we have a small public service announcement.

One of the first things you'll do when adding something to this catalogue of the ecosystem, is add a title and a blurb. That happens at the top of the page, right here:

alt

This will display above the text you write into the markdown section, found much further down the edit and create pages. It will display to the user like this:

alt

Therefore, in the markdown section, there’s no need to repeat this text or to reenter the title of your project as a header, etc. You can jump straight into the important information about the member of the ecosystem that you’re listing.

Public service announcement over.

Now let’s get into our markdown. We’ve split it into two sections:

  • The Essentials
  • The Next Level

With each element we’re first going to show you what punctuation to use and how to use it. below that we'll then show you how it will display to the user. When you are creating content on Built on Cardano you get a live preview right next to the markdown editor. This allows you to check for errors before hitting save!


The Essentials

These nuggets of knowledge are going to help you to curate a piece of content that is visually stunning!

Titles

There are two types of title you can use:

  • Title
  • Subtitle

To make a title place two ## and a space before the word you want to be a title.

To make a subtitle place three ### and a space before the words you want to be a subtitle.

Like so:

## This is a Title

This is a Title

### This is a Subtitle

This is a Subtitle


Highlighting and Bolding

There are three options for highlighting text on Built on Cardano. highlighted, bold, and the double. Here’s how to execute all three.

*To highlight text add and asterisk to either side of it, like this*

To highlight text add and asterisk to either side of it, like this

**To bold text add two asterisks to either side of it, like this**

To bold text add two asterisks to either side of it, like this

***To do the double add three asterisks to either side of the text, like this***

To do the double add three asterisks to either side of the text, like this

Highlighting, bolding and, the double can be added to both title types. Simply surround the words of the title with the amount of asterisks you want. For example:

### *I'm a Highlighted Subtitle*

I'm a Highlighted Subtitle


Links

If you want to link a piece of text to another part of the internet then you have to surround the word(s) you want to link with square brackets. The link for the place on the internet that you want to link out to goes next to it in a pair of round brackets, like so:

[I made a link!](https://builtoncardano.com/)

I made a link!

Links on Built on Cardano come in our signature orange not the traditional blue.

If you just add a URL to the editor it will automatically recognize it and turn it into a link. Like so:

https://builtoncardano.com/

https://builtoncardano.com/

You can combine bolding and highlighting with both types of links, but doing so does replaces the orange color. See below:

**[I made a link!](https://builtoncardano.com/)**

I made a link!

*https://builtoncardano.com/*

https://builtoncardano.com/


Blockquotes

Blockquotes help to highlight important parts of the text and makes them stand out from the rest of it. Whilst they make things stand out do be careful with overusing blockquotes, if they’re overused they lose their meaning and have little affect besides making the reading experience more difficult for the user. To make a block quote you do the following:

>Simply add a > (greater than sign) before the text you want to blockquote and ta da! You have a blockquote!

Simply add a > (great than sign) before the text you want to blockquote and ta da! You have a blockquote!

If you want to make a blockquote with multiple paragraphs in it then you simply add “>” on the lines between blockquoted lines, like so:

>This is a multi-
>
>line
>
>block-
>
>quote example for you to see!

This is a multi-

line

block-

quote example for you to see!

You can also combine links, bold, and blockquotes to real show off your markdown skills:

>If you want you can **bold**, *highlight*, or ***double*** text in a blockquote but [links (like this one)](https://builtoncardano.com/) don’t display in orange in blockquotes so they aren't noticeable. So we recommend bolding your [**links like this**](https://builtoncardano.com/) so they’re recognizable. Or you can highlight or double them, your choice.

If you want you can bold, highlight, or double text in a blockquote but links (like this one) don’t display in orange in blockquotes so they aren't noticeable. So we recommend bolding your links like this so they’re recognizable. Or you can highlight or double them, your choice.


Lists: Unnumbered and Numbered

Unnumbered lists can be created using a hyphen, -, an asterisk, *, or a plus sign, +. You have to put a space between the piece of punctuation and the words on the list.

- This works
- As a list
  • This works
  • As a list
+ This also works
+ As a list
  • This also works
  • As a list
* This also also works
* As a list
  • This also also works
  • As a list

Numbered lists will always go in numerical order, no matter what numbers you type. They are made by typing a number with a fullstop after it. An example:

1. fish
1. fish
1996811. fish
42. Thanks for all the fish

Always becomes:

  1. fish
  2. fish
  3. fish
  4. Thanks for all the fish

The fullstop after the number is what makes it turn into a list. So if we remove the fullstop from the above list then we just get:

1 fish

1 fish

1996811 fish

42 Thanks for all the fish.

It doesn’t format to a list at all, it stays the same as we typed. So, if you want to do

10 a

9 countdown

8 list,

7 then

6 write

5 the

4 numbers

3 without

2 the

1 fullstops.

Just like that there ^^. We have LIFTOFF!!


Separators

You may have seen seperators, like this:


neatly cutting up the sections of this blog post. These are easy to make! Simple put a *** on a line on its own like this:

***

and it turns into this:


Simply done! If you want to make a thicker separators simply stack lines of triple asterisks, ***, like this:

***
***
***
***
***
***
***
***

This is the resulting size of the separator:









The more you stack the thicker it gets! So stack until your heart’s content.


The Next Level

The above essentials allow you to really jazz up your text and make it exciting and engaging for people to read. The next few items are slightly more complex, but not difficult, and allow you to add images, add emojis, add alt text to images and links, and to prevent markdown from formatting things you don't want it to.

Stopping Markdown from formatting

Let’s say you want to write something like we’ve done here that shows off the code without the editor formatting it for you. To do this you must add three back ticks, ```, on the lines before and after the content you want to not have formatted.

>This should
>
>Be a multi-line, **Bolded** quote.
>
>But with the three backticks "```" on the lines before and after it
>
>it displays like this.

Not like this:

This should

Be a multi-line, Bolded quote.

But with the three backticks "```" on the lines before and after it

it displays like this.


Adding Images

Adding an image is almost the same as adding a link. You just have to put an exclamation point, !, at the beginning.

![logo](https://builtoncardano.com/_next/image?url=https%3A%2F%2Ffirebasest[...]w=1920&q=75)

Becomes:

logo

Note that this, unfortunately, does NOT work for IPFS files.


Adding Alt Image and Link Text

You can add alt text (text that pops up when you hover over it) to both images and links. This is done by putting what you want the alt text to be into quotation marks and adding it to the second set of brackets containing the link or the image location. Like this:

[No Alt Text Here](https://builtoncardano.com/)

No Alt Text Here

[Hover me Baby](https://builtoncardano.com/ “Oooooh Yea!”)

Hover me Baby

![logo](https://builtoncardano.com/_next/image?url=https%3A%2F%2Ffirebasest[...]w=1920&q=75 "See, I'm a Special One!”)

logo


Task Lists

You can add task lists in markdown and can use them to show users what you plan on doing, and what you've already accomplished. These are also very easy to update, meaning that it's easy to have your as up to date as possible. To create a task list you need to add boxes, [ ] or [x], to a list. This list can be numbered or not, it’s your choice.

- [ ] unticked box (must have a space in it)
- [x] Put an x in it to make a ticked box!
  • unticked box (must have a space in it)
  • Put an x in it to make a ticked box!
1. [ ] unticked box (must have a space in it)
2. [x] Put an x in it to make a ticked box!
  1. unticked box (must have a space in it)
  2. Put an x in it to make a ticked box!

Note: These tick boxes don't format without the list element. Meaning that:

[ ] unticked box (must have a space in it)
[x] Put an x in it to make a ticked box!

Stays as:

[ ] unticked box (must have a space in it)

[x] Put an x in it to make a ticked box!


Emojis

You can copy and paste emojis into markdown to make your text cooool 😎 or whatever you want.... 💩

Use Emojipedia, or a platform of your choosing, to find the emojis that fit your needs! 🥳


That, everyone, is how you can spice up the markdown section of your listing on Built on Cardano and potentially entice more people to click through from Built on Cardano to your project, stake pool, organization or skill! Have fun making your ecosystem listing snazzy!