HackMD
Embedding another note
You can embed other notes into the current one. This allows you to "modularize" your notes and reuse common parts.
For example, you are writing a series of posts or even a book, and you want to reuse the below info block in all your posts:
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
Embedding notes will save you time by adding the same hint to each post. Also, if you want to change this hint later, you don't have to find them in all posts and change them all over again. Here's how.
Steps:
- Prepare a note that only has the thing you want to embed. Get its unique note ID.
We will create a new note here and move the Hint block to it. - Start embedding iframe with
{}at where you want to embed the note. Choose to embed a HackMD note and specify the note ID.
Image Not Showing Possible Reasons- The image was uploaded to a note which you don't have access to
- The note which the image was originally uploaded to has been deleted
Advanced Usage - Embed a theme
Even cooler, you can customize the style of your notes in HackMD, changing their appearance and applying your favorite themes. Once you know how to embed notes, we can use this feature more flexibly.
Use the HTML <style>...</style> element to set the styles of page elements.
Change the way the notes are presented
Notes in HackMD support partial HTML and CSS, which can be used to customize the style of your notes. Writing within the <style> tag is the most straightforward method.
You can refer to:
Example 1 - Colored background theme
Design your own theme in another HackMD note. You can find the example we used below:
{%hackmd @debbylin/theme-matcha %}
- 🍵 Matcha book theme 📗
Preview: https://hackmd.io/@debbylin/BJY6lnkWa
Theme: https://hackmd.io/@debbylin/theme-matcha-book
{%hackmd @debbylin/theme-matcha-book %}
Happy to use it or duplicate the CSS, customize it.
Example 2 - Vertical writing theme
Some languages, such as Mandarin, Japanese, and Korean, can be written vertically.
{%hackmd hackmd-vertical-writing-theme %}
- The image was uploaded to a note which you don't have access to
- The note which the image was originally uploaded to has been deleted
Try to paste the code below into one of your note. You shall see the theme of the note has changed accordingly.
{%hackmd @themes/dracula %}
This line is to tell HackMD: "Please go to the Workspace @themes and fetch the note whose slug of permalink is dracula. Include that note into the current one."
