Notes from a small website

A week ago, I tweeted:

After a long weekend of coding, I’ve got a brand new section on my website.

http://adactio.com/notes/

But that tweet did not originate on Twitter. That tweet is a copy. The original is here.

To be honest, I’ve never been that pushed about having my own bite-sized updates hosted on my own site and syndicated out to Twitter. I’m much more concerned about my photos. Still, I thought it was pretty cool the way that Chloe, Aaron, Amber, and Barnaby have a “notes” section on their sites hosting the canonical URLs of their updates, so I thought I’d give it a shot too.

Michael Bester has written about his online homesteading process. You can also read—or listen toChloe’s process.

Creating a new section on my own site is pretty straightforward. My home-rolled CMS is really creaky and ropey but it gets the job done. The notes section is just another kind of post, same as journal, links, and articles. The tricky bit (for me) was figuring out how to post a copy to Twitter.

It was pretty clear which API method I needed to use. The hard part was all the OAuth stuff. I’ve never meddled with that kind of voodoo before.

I signed into dev.twitter.com and created an application called adactio.com. I’m given an API key and an API secret. This application will only never need to post as me, so I was able to take advantage of single-user OAuth to generate my access token and access token secret:

By using a single access token, you don’t need to implement the entire OAuth token acquisition dance.

Now I had the four pieces I needed to send with a status update:

  1. my consumer key,
  2. my consumer secret,
  3. my access token, and
  4. my access token secret.

I found a small PHP library that uses Andy’s OAuth code. Looking at the source code, I was able to figure out what I needed to send to Twitter. The OAuth class is doing all the hard work—my PHP code is fairly basic.

Imagine my surprise when it actually worked.

I fiddled around with my site’s crude templating system so that if I’m logged into my little CMS, I’m presented with a simple update form on the front page of adactio.com.

Speak your brains on Dribbble

When I type a note into that form and hit “post”, here’s what happens:

  1. I store the note in my own database.
  2. I send a copy to Twitter as a status update.
  3. Twitter returns a JSON object with info about the tweet I just created.
  4. I take the ID of that tweet and store it in my database along with the original note.

Having the ID of the copy on Twitter allows me to provide some Twitter-specific actions from my own site: reply, retweet, fave, etc.

Note on Dribbble

Okay, so now I’m posting to Twitter from my own site. Nifty! But what about receiving notifications from Twitter? If someone replies to, or likes, or favourites the copy of my note on Twitter, it would be nice to get notified about it on adactio.com.

This would be a really complex problem to attempt to solve for myself, but fortunately I don’t have to. Brid.gy is a magical tool written by Ryan Barrett that you can authorise to watch your Twitter profile. It will send a webmention back to the canonical URL on your own site whenever anyone replies to, or retweets or favourites a post.

Because I’ve already got webmentions on my site, Brid.gy worked straight out of the gate—a lovely demonstration of some small pieces, loosely joined.

Responses on Dribbble

Like I said, I wasn’t all that pushed about hosting my own short updates but now that I’m doing it, I’m really, really enjoying it. It feels good.

It feels good to be using my own website for “microblogging”. I know that’s a distasteful phrase but it’s a fairly accurate way of describing how I tend to use Twitter. My earliest tweets definitely feel like short blog posts.

Conversely, looking back on how I was blogging very early on, a lot of those short posts feel like tweets. So it feels good to bring those notes back to adactio.com.

Responses

Josh Russell

oh, unless that is supposed to link to /notes then it’s fine.. just me being confused

adamsimpson.net

Manton Reece recently shared his microblogging setup with WordPress. I have a similar system that was inspired by Jeremy Keith’s example. Like Manton, I had to figure out the quickest way to create a new post. I eventually settled on SMS-to-post thanks (once again) to Twilio. SMS-to-post lets me text my Twilio number which sends the text to WordPress where it becomes a new “note”. Publishing that “note” to Twitter is just a matter of hooking into the WordPress publish_post action and sending the post to Twitter via its API.

Here are a few other implementation notes:

  • I created a custom post type in WordPress called “Notes”.
  • The the post status API makes this entire process smooth.
  • SMS-to-post has a few gotchas, the biggest one is that SMS with emoji are limited to 70 characters.
  • I don’t have an RSS feed for my Notes…yet
  • I save the tweet ID of every post that gets posted to Twitter. I use that ID to pull in the favorite and retweet counts and display them next to each “note” in the WordPress dashboard.
  • Twilio needs an endpoint to POST incoming texts to WordPress. Creating custom endpoints is trivial thanks to this great guide. I also recommend the rewrite rules inspector plugin for working with rewrite rules.

# Thursday, June 25th, 2015 at 10:14am

Tom Coates

@adactio That link’s not working. Probably my internet, unless your site has gone down or something…

# Posted by Tom Coates on Wednesday, July 8th, 2015 at 11:19pm

Tom Coates

@adactio I feel the same way about people using Less instead of Fewer. Everyone tells me to shut up when I go on about it, though.

# Posted by Tom Coates on Wednesday, July 8th, 2015 at 11:23pm

Dorcas ☆

Okay cool! Thanks for answering! And may I ask if you think that’s a good way to drive traffic/another reason? You’re the only person I follow who does this.

# Posted by Dorcas ☆ on Wednesday, October 23rd, 2019 at 9:30am

Jeremy Keith

It’s because I want to own my own data. I consider my site to be the canonical link and the Twitter version to be the copy. I include links in both directions. adactio.com/notes/16002

Florian Geierstanger

Thanks! I was not aware of the name for this. Next: how to do Publish on your Own Site with a static file generator like @astrodotbuild or @eleven_ty since there is no publish hook. Maybe a github action that checks for new .md files and then sends the req to Twitter API

1 Share

# Shared by Rob. on Wednesday, October 23rd, 2019 at 9:26am

10 Likes

# Liked by Ryan Barrett on Sunday, June 1st, 2014 at 4:49pm

# Liked by Tantek Çelik on Monday, June 2nd, 2014 at 1:40am

# Liked by Kyle Mahan on Monday, June 2nd, 2014 at 1:41am

# Liked by mirthe on Monday, June 2nd, 2014 at 3:15pm

# Liked by 爆撃機伍號 on Monday, June 23rd, 2014 at 11:20am

# Liked by Web Component Bytes on Wednesday, April 20th, 2022 at 7:29am

# Liked by Florian Geierstanger on Wednesday, October 5th, 2022 at 10:55am

# Liked by Spinal: Git-based CMS on Wednesday, October 5th, 2022 at 9:26pm

# Liked by Nico Hoffmann ෴. on Saturday, November 5th, 2022 at 6:36pm

# Liked by Bart Vandeputte on Sunday, November 6th, 2022 at 10:07am

Related posts

adactio.com on Mastodon

@adactio.com@adactio.com

The syndicate

Cross-posting to wherever is flavour of the month.

Image previews with the FileReader API

Adding `alt` text to uploaded images.

A decade on Twitter

The first ten years of microblogging.

A little progress

Some code to show a progress bar for file uploads.

Related links

Autonomy Online: A Case For The IndieWeb — Smashing Magazine

A wonderful introduction to the indie web—Ana really conveys her sense of excitement!

Tagged with

Tagged with

Keynote: The Building Blocks Of The Indie Web - YouTube

Here’s the video of the talk I gave at Design4Drupal last week in Boston. There’s a good half an hour of questions at the end.

Tagged with

To PESOS or to POSSE? | Dries Buytaert

In trying to decide on his indie web approach, Dries gives an excellent breakdown of the concepts of PESOS (Publish Elsewhere, Syndicate to Own Site) and POSSE (Publish to Own Site, Syndicate Elsewhere).

There are some great responses in the comments too, like this one from Chris and this one from Tantek (syndicated from their own sites, obvs).

Tagged with

Medium is only an edge server of your POSSE CDN, your own blog is the origin

Medium, Twitter, Facebook and others are edge services for your content … Your platform is the origin.

Tagged with

Previously on this day

12 years ago I wrote Device expansion

Some more device grist for the communal testing mill.

14 years ago I wrote Sketchleft

I know kung-fu. Where by kung-fu, I mean scribbling.

17 years ago I wrote Reboot slides

If it’s Thursday, it must be Copenhagen.

18 years ago I wrote Reboot 8, day 1, second part

The fun begins as the sun goes down.

18 years ago I wrote Reboot 8, day 1, first part

A quick update from Copenhagen.