The Article That Inspired Roam to Implement Blockquotes: 5 Now Luckily Unnecessary Solutions and How to Do Them Properly

This article is completely unnecessary — but still funny!

Logo of Roam in the quotation marks
Logo of Roam in the quotation marks
Blockquote — where are you?

And this one, which is a little bit more striking.

Probably the first attempts to recreate them in Roam I made were soon after I discovered the great power of #tags in Roam. When put in front of various elements, like highlighted text, they can be used to change their appearance. I am using it, e.g., for adding colours to Roam like this:

Using #tags to change colors of highlighting.
Using #tags to change colors of highlighting.

Text-align hack

This was probably the first successful hack I attempted. The idea was simply to redefine text-align options of blocks. These ones:

Userscript

Before I address my favourite solutions, I have to point out the inspiration I got a long time ago: the userscript of Ryan Guill called Roam Experiments.

Blockquotes as done by Ryan Guill’s Roam Experiments userscript

ROAMEXT

Under this weird name (Roam Extended!!!), there is a little universal JavaScript that I made. It does one thing: it saves names of all tags in the main block of your bullet. Why? It then allows you to style the whole block based on your tags. This can have thousands of uses and one of them is a blockquote. You can read my article on this here on Medium.

Tables as quotes

The preceding solution is good. I really like it. Yet, the need for a special roam/js plugin makes it difficult to use, e.g., in databases with multiple users, because each user would have to allow such a plugin.

Lorem ipsum, source: https://www.lipsum.com

Back to the beginnings

Finally, I came back to beginnings and I started to ask myself: isn’t there an easier solution? When I tried to use a simple tag and highlighting, this did not work because <span> that contains the highlighting is an inline element. However, what if we change it?

Source
Source
  1. We have to highlight the text of the blockquote.

Just a humble Roaman duck.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store