TWITTER

The Twitter integration connects your Roam graph to Twitter!

Installation

You could use the Copy Extension button below to individually install this extension. To install, just paste anywhere in your Roam graph and click "Yes, I Know What I'm Doing".

Manual Installation

If instead you prefer to manually install, first create a block with the text {{[[roam/js]]}} on any page in your Roam DB. Then, copy and paste this code block as a child of the block.

var existing = document.getElementById("roamjs-twitter");
if (!existing) {
  var extension = document.createElement("script");
  extension.src = "https://roamjs.com/twitter.js";
  extension.id = "roamjs-twitter";
  extension.async = true;
  extension.type = "text/javascript";
  document.getElementsByTagName("head")[0].appendChild(extension);
}

Usage

The Twitter extension supports a few features, including sending and searching tweets.

Sending Tweets

When navigating to a roam/js/twitter page, a log in with Twitter button will be rendered on the configuration screen.

Clicking the button will create a popup window, prompting you to authorize RoamJS to be able to send tweets on your behalf. You may need to allow popups from Roam for this to work. After authorizing RoamJS, a block will be created in your roam/js/twitter page:

This block contains access tokens that RoamJS could use to send Tweets. DO NOT SHARE THIS BLOCK WITH ANYONE.

To send a tweet, create a {{tweet}} button and nest the content of the tweet as a child.

The button will be replaced with a Twitter icon. Clicking the icon will render an overlay with a "Send Tweet" button.

Clicking "Send Tweet" will send the first child as the content of the Tweet!

If the tweet button has multiple children, clicking "Send Tweet" will send each block as a tweet as part of a single Tweet thread.

Images, gifs, or videos in the Roam Block inline with the rest of the tweet, will be uploaded as media embedded in the tweet! The ![](url) block text will be stripped from the tweet content. Up to four images, one gif, or one video are allowed by Twitter.

After Sending

There are various behaviours you could configure to occur after tweets are successfully sent.

It could be useful to denote which blocks in Roam have already been sent by moving them to another page or block reference after sending. On the roam/js/twitter page, you could add a block that says 'Sent' with a block reference as a child.

This will move all the blocks sent as children of this block upon sending.

The label by which Sent tweets are nested under could be configured with a block that says 'Label'.

The child of that block will be used as the label. {now} will be replaced with the time the tweet was successfully sent.

Instead of moving blocks, tweeted blocks could also be edited upon sending. This could be configured with a block that says 'Append Text'.

The child will be appended to the end of the tweeted block. {link} will be replaced with the link of the created tweet.

Instead of appending text to individual tweet blocks, you could append text to the parent block of the tweet thread. This could be configured with a block that says 'Append Parent'. {link} is a placeholder that will be replaced with the link of the first tweet of the thread.

Demo

Twitter Feed

You could configure the extension to show a feed of all tweets you liked the previous day upon opening your daily notes page.

On the [[roam/js/twitter]] page, add a block that says feed and then reload Roam. Now navigate to the daily notes page or to today's page. A dialog will appear and show you a feed of all the tweets that were published yesterday and that you liked.

Clicking "Import" will add a #[[Twitter Feed]] tag to your Daily Notes page with links to all the tweets nested below it.

By default, the Twitter feed only appears on the current daily notes page and log. You can configure the feed to appear on any daily notes page by nesting a block that says Any Day under the feed block.

By default, the tweets are imported at the top of the page. Add a block that says bottom under the feed block to import the tweets to the bottom of the page.

By default, the Twitter feed just outputs links to the tweets into the daily note page. To customize the format, add a block under the feed block that says format. You could then specify the format as a child of the format block. There are certain placeholders that will get replaced in the format:

  • {text} - The text of the tweet
  • {link} - The link to the tweet
  • {handle} - The twitter handle of the user
  • {author} - The name of the user on Twitter

Demo

Searching Tweets

The script supports the following configuration attributes, to be added in the [[roam/js/twitter]] page:

  • Username - (Required) This is your twitter handle.

Here's an example configuration page:

In any page, create a Twitter References button by typing in {{twitter references}} (case-insensitive) in a block. Upon clicking the button, the extension will clear the button and fill the page in with the tweets where you've mentioned that page title. So, if you've tweeted about books a lot on twitter, you can head over to the books page on roam, and then pull all your tweets about books!

One caveat is that this can only pull tweets made in the last 7 days.

Demo

Contributors

This extension is brought to you by RoamJS! If you are facing any issues reach out to support@roamjs.com or click on the chat button on the bottom right. If you get value from using this extension, consider sponsoring RoamJS by clicking on the button below!

A special thanks to those who's contributions also helped make this extension possible:

ROAMJS DIGEST

Add your email below to stay up to date on all RoamJS features, fixes, and news!

Other Extensions