Instantly share code, notes, and snippets.

Embed
What would you like to do?
How to export and rehost your Tumblr site

How to export and rehost your Tumblr site

(Update: Version 3.2.0 of Jekyll looks like it's breaking a few things, so I've changed the guide to make you specifically install the version I was using, 3.1.3. I believe this is the issue: jekyll/jekyll#5145.)

You will be using jekyll-import to export your Tumblr site, Jekyll to (re)create it, and Surge to rehost it.

Setup and installation

You will need:

  • Ruby installation
  • Node installation
  • Knowledge of how to use the terminal

This guide is not optimized for Windows, because I can never get Ruby to work on the damn thing.

In your terminal, type:

mkdir tumblr 
cd tumblr
# Replace `myblog` with your Tumblr blog name
jekyll new myblog
cd myblog

npm install --global surge
gem install jekyll -v 3.1.3
gem install jekyll-import
touch myblog.rb

Exporting your Tumblr site

Open myblog.rb and enter this:

require "jekyll-import";

JekyllImport::Importers::Tumblr.run({
    "url"            => "https://myblog.tumblr.com",
    "format"         => "html", # "md" misses links and images etc
    "grab_images"    => true,
    "add_highlights" => false,
    "rewrite_urls"   => false # `true` breaks build
})

If this returns an error, it's possible you may need to replace the "https" with "http".

Run the file to export your blog:

ruby myblog.rb

This will export your site into two folders: _posts/ and tumblr_files/.

Creating your own site

Now use the exported data to build your own blog using Jekyll:

jekyll build

I recommend you take a minute to review the file _config.yml in your text editor. It should look like this:

# Welcome to Jekyll!
#
# This config file is meant for settings that affect your whole blog, values
# which you are expected to set up once and rarely need to edit after that.
# For technical reasons, this file is *NOT* reloaded automatically when you use
# 'jekyll serve'. If you change this file, please restart the server process.

# Site settings
title: Your awesome title
email: your-email@domain.com
description: > # this means to ignore newlines until "baseurl:"
  Write an awesome description for your new site here. You can edit this
  line in _config.yml. It will appear in your document head meta (for
  Google search results) and in your feed.xml site description.
baseurl: "" # the subpath of your site, e.g. /blog
url: "http://yourdomain.com" # the base hostname & protocol for your site
twitter_username: jekyllrb
github_username:  jekyll

# Build settings
markdown: kramdown

If you don't plan on defining a Twitter and GitHub username as well as an e-mail address, I recommend you just delete those lines, since the defaults will be featured on your site otherwise.

These are the required parts:

title: Your awesome title
baseurl: "" # the subpath of your site, e.g. /blog
url: "http://yourdomain.com" # the base hostname & protocol for your site

# Build settings
markdown: kramdown

Hosting your site

Time to host the built site (in the folder _site/) with Surge

surge --project _site/

You will be asked to create an account with e-mail and password.

The site will now be hosted at <random>.surge.sh; if you want a custom domain, I recommend you read Surge's guide on custom domains, since it assumes some technical proficiency on your end.

Updating your site

To view your site locally, you can run jekyll serve. It's now viewable at localhost:4000, if you enter it into your address bar.

To build it with any new changes, run jekyll build.

To view your site locally and automatically update it when you make changes, run jekyll serve --watch. Note that this doesn't work for updating _config.yml, so you will have to end the running process and re-run it for the changes to carry through.

When your site has been built with the new changes, you can upload the changes with surge --project _site/.

Customizing your site

Clearly, the default design is so-so, but if you feel like experimenting, you can try some of the available themes at the sites below:

I've got zero experience with any of the sites, and all appear to have an awful ease of use---after all, the three main draws of Tumblr are its CMS, its themes, and its Dashboard, none of which are available here.

If you do try your hand at customizing your site, just remember to keep your _posts/ and tumblr_files/ folders and their content intact. If you mess up, you can always re-export your Tumblr site while it's still available.

HOWEVER! It looks like a dedicated theme feature is forthcoming, albeit indeterminately.


Hit me up on Twitter: @pessimism.

@jennschiffer

This comment has been minimized.

Show comment
Hide comment
@jennschiffer

jennschiffer May 15, 2018

thank you so much, this is great and worked awesomely. there were two errors i'd encounter - first the https vs http one you mentioned. another one was sometimes the images couldn't be accessed so script would stop. when this happened, i'd go to that post on tumblr and mark it as "private" and tried again and then it worked because the post was skipped. i had about 5500 posts and this error only happened 5 times. anyway, thank you so much for writing this up!!

jennschiffer commented May 15, 2018

thank you so much, this is great and worked awesomely. there were two errors i'd encounter - first the https vs http one you mentioned. another one was sometimes the images couldn't be accessed so script would stop. when this happened, i'd go to that post on tumblr and mark it as "private" and tried again and then it worked because the post was skipped. i had about 5500 posts and this error only happened 5 times. anyway, thank you so much for writing this up!!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment