Perl programmer for hire: download my resume (PDF).
John Bokma's Hacking & Hiking

Adding Twitter Card and Facebook Sharing Support to Tumblelog

August 11, 2019

In the afternoon I added a new template variable to tumblelog, both the Perl and the Python version. Thanks to this additional variable, page-url, it's easy to add support for Twitter card and Facebook sharing to a static blog generated with tumblelog.

Modifying the Blog Template

After you have done a git pull add the following lines before the line containing </head> in the template you use for your blog:

    <meta property="og:url" content="[% page-url %]">
    <meta property="og:type" content="article">
    <meta property="og:title" content="[% title %]">
    <meta property="og:image"
    <meta property="og:description" content="Link to: [% page-url %]">
    <meta name="twitter:card" content="summary">
    <meta name="twitter:image:alt" content="SOME SITE logo">

You have to modify the following for your own blog:

For my tumblelog, Plurrrr, I created a simple 512x512 pixels logo showing an orange P. Because I use the summary Twitter card this logo is shown to the left of the title and description:

A tweet for a Plurrrr post
How a tweet for a blog post on Plurrrr looks in the browser.

Sadly, a rectangular cut-out is shown on Facebook, but since I made this mostly for Twitter I don't care much. If you prefer a rectangular logo set the content attribute of twitter:card to summary_large_image. For more information, please read Twitter Card and Facebook Sharing.

Generating Tweets

I use a Perl program called to post a tweet at random chosen from a text file in fortune cookie format.

A simple Perl program, given below which I named, can be used to create such a file from the Markdown file used as input for tumblelog.

Edit: I have updated the program to handle UTF-8 correctly.


my $filename = shift;
defined $filename or die "Usage: FILENAME.MD\n";

binmode STDOUT, ':encoding(UTF-8)';
open my $fh, '<:encoding(UTF-8)', $filename
    or die "Can't open '$filename' for reading: $!";

while ( my $line = <$fh> ) {
    $line =~ /^(\d{4})-(\d{2})-(\d{2})\s+(.+)/ or next;
    print <<"END_TWEET"

\x{1f449} Please retweet if you like my #blog Thanks! \x{1f44d}$1/$2/$3.html

You call it as follows:

perl > site-tweets.txt

The program iterates over all lines in the given Markdown file and if a match is found of a date followed by a title a tweet is printed to the standard output which is redirected to a text file.

Don't forget to replace the URL in this Perl program with the one to your blog.

One caveat of this program though, if you have a blog post which has a line starting with a date in year-month-day format, for example:

2019-08-11 This is an example

this will also be seen as a blog post; a false positive. Writing a program that avoids this special case is left as an exercise to the reader; you could use code from tumblelog, either the Perl or Python version, as a starting point.


As I use a Makefile to generate my tumblelog it's easy to call the aforementioned Perl program as part of the make process:

TUMBLELOG = ../../projects/tumblelog
PERL = perl
SCSS = soothe.scss
SASS = sass --sourcemap=none -t compressed
CSS  = soothe.css
TEMPLATE = plurrrr.html
AUTHOR = 'John Bokma'
NAME = 'Plurrrr'

all: local tweets
	rsync -avh --delete -c htdocs/ ti:sites/

	@perl > $(TWITTERTOOLS)/plurrrr-tweets.txt

	@echo "Building latest version of blog using Perl"
	@$(SASS) $(TUMBLELOG)/styles/$(SCSS) htdocs/$(CSS)
	@$(PERL) $(TUMBLELOG)/ --output-dir htdocs \
	  --template $(TEMPLATE) --css $(CSS) \
	  --author $(AUTHOR) --blog-url $(BLOG_URL) \
          --name $(NAME) --quiet

Note that I added a new rule; tweets and added this as a dependency to the all rule. Don't forget the latter.

Now, if you run just make the tweets target should run and create the text file with tweets.

You can use a cron job to tweet automatically, daily, as explained in Running a Perl program via cron.