Your first seed

doc

The list of new options in this repo includes:

Callouts

  • support obsidian format (not yet nested)
  • format markdown inside callouts

Math Equations

  • Math equations are now supported.
\[c = \pm\sqrt{a^2 + b^2}\]

RTL support

You must use the ar layout for full RTL notes. It also supports mixed content.

مرحبا

أهلا بكم أعزائي .

Table Of Content

I used the following project for the table of content generation: jekyll-table-of-contents

Hash Tags page

  • Add a page that contains all the used hashtags (in YMAL) and the tagged pages.
  • Tags with url to the specific tag.
  • Inspired by: nickcharlton.net

Local Graph view

  • Link previews work on all the internal links and the local graph view.
  • can scroll Link previews.

Easy deployment through GitHub in three steps

  • I used the following GitHub action:

Callouts

  • Available types: note, abstract, info, tip, success, question, warning, failure, danger, bug, example, quote.
  • The used CSS files from admonitions obsidian plugin. “
  • Nested Callouts not yet supported.
Example

This is an example.

SUCCESS

This is a success message

WARNING

You need first see this guide

RTL Callouts

  • You need just to add * to make it RTL.
مثال

هذا مثال.

نجاح

هذا نجاح

تحذير

هذا تحذير

Welcome!

This is your first note. You’ll find it in the notes/ directory.

To link to another note, you can use multiple syntaxes. The following four use the “double-bracket” notation (view the Markdown source file to see the underlying syntax).

You can organize notes in subdirectories and link them normally. For example, the links above all point to the _notes/animals/cats.md file. Here’s another example: tigers.

Non-latin languages are supported too: 안녕하세요.

Dashes and underscores in file names are supported, and may be omitted in the bracket link syntax. As an example, the your-first-note.md file can be linked to with your first note or your-first-note, or even yOuR-FiRsT Note.

In all cases, if the double-bracket link does not point to a valid note, the double brackets will still be shown, like this: there is no note that matches this link .

Alternatively, you can use regular Markdown syntax for links, with a relative link to the other note, like this: this is a Markdown link to the note about cats. Don’t forget to use the .internal-link class to make sure the link is styled as an internal link (without the little arrow).

Since the Web is all about HTML, you can always use plain HTML if you want, like this: This is a link to the note about cats with HTML.

Of course, you can also link to external websites, like this: this is a link to Wikipedia. Again, you can use plain HTML if you prefer. Footnotes are also supported and will be treated like internal links.1 You can point to other notes in your footnotes.2

Tweet embedding

Note: This behavior is disabled by default for privacy reasons. See “Site configuration” section below to enable it.

You may include a tweet URL on its own line (like below), and it would be replaced with an official Twitter embed if the site configuration demands it.

https://twitter.com/jack/status/20

Media embedding

You may embed media files within a note using HTML5 media tags. Here’s an example for an audio file:

“Jazzy Frenchy” by Benjamin Tissot from bensound.com

Site configuration

Some behavior is configurable by tweaking the _config.yml file.

use_html_extension: if you use a static host that doesn’t support URLs that don’t end with .html (such as Neocities), try changing the use_html_extension value to true in the _config.yml file and restart the Jekyll server (or re-build the site). This adds a .html extension to note URLs and may resolve issues with links. If you’re still having trouble, I recommend using Netlify to host your digital garden: it’s free, easy to use, and fully supports this template’s features out of the box.

open_external_links_in_new_tab: when set to true, this makes external links open in new tabs. Set to false to open all links in the current tab.

embed_tweets: when set to true, tweet URLs on their own lines will be replaced with a Twitter embed. Default value is false.

Notice in the “Notes mentioning this note” section that there is another note linking to this note. This is a bi-directional link, and those are automatically created when you create links to other notes.

If you’re on a device with mouse support, try hovering your mouse on internal links to preview the notes: a note about cats.

Links that have been previewed will be cached to avoid redundant requests.

Images and other Markdown goodies

Finally, because you have the full power of Markdown in this template, you can use regular Markdown syntax for various formatting options.

Lists work as expected:

  • List element A
  • List element B
  • List element C
  1. List element
  2. List element
  3. List element

If you’d like to quote other people, consider using quote blocks:

Lorem ipsum dolor sit amet

And of course, images look great:

You can also highlight some content by wrapping it with ==.

Non-latin languages are supported too: 你好, 안녕하세요, こんにちは.

Code syntax highlighting

You can add code blocks with full syntax color highlighting by wrapping code snippet in triple backticks and specifying the type of the code (js, rb, sh, etc.):

// Here's a bit of JavaScript:
console.log('hello!')
# And now some Ruby
def foo(bar)
  "baz"
end
$ cat /dev/urandom | grep "the answer to life" # shell scripts look nice too

Next steps

This digital garden template is free, open-source, and available on GitHub here.

The easiest way to build your own digital garden based on this template is to read this step-by-step guide explaining how to set this up from scratch.

Go forth, have fun, and learn new something every day! ✌️

  1. This is a footnote. For more information about using footnotes, check out the Markdown Guide

  2. This is another footnote that links to the note about cats. You may also point to notes that do not exist if you wish. 

Table of contents

Local Graph

Mentions