Blogspot to jekyll

Well… with the jekyll importer plugin, now we can easily and quickly move our blogspot blog to jekyll, then why do we use jekyll??

Now the question is, can jekyll run fast with 1k articles?? and yes… we have tried and implemented it, this blog contains 1500 articles both post pages and blog content, and jekyll can handle this easily!!

Run build time of only 32 seconds !!

Superb !!

Before using jekyll we started running this site using blogspot blogger, we created a custom theme, we also optimized… but when you use mobile to access your website, you will be redirected to /?m= this is the mobile version for blogspot, and it has drawbacks with redirect to this mobile-only page. because it will affect the speed of your site.

And yes.. we have inject google ads script, it is very heavy loading for all page, we can’t hide it in custom page, because we need to include ad script code in </head> with this step of course ad script is ready for all your page , you can’t customize other pages if you don’t need to use ad scripts. its a problem, because with this ad script your site is very heavy on page load if you have test on google lighthouse.

this is the reason why we finally decided to go with jekyll.

and actually we also feel very comfortable with blogspot blogger, we admit that this is the best blogging platform in our opinion, because it is owned by Google, and it is very secure.

How to migration for blogspot blogger to jekyll ??

for first make sure you have blog on blogspot platform, then you will need to backup your content. visit on settings - scroll down - configure blog - and backup your content.

you will download .xml backup files

After that now you can open your jekyll project, or you can use our free jekyll themes template , download jekyll themes →

Move your backup.xml files to jekyll project on root.

Next step :

we have two options , options one if your blog have under 50 article content so you can select this step .if your blogspot have 1000 article so you can use options 2.

Blogspot to jekyll import options 1

we need install feedjira so open terminal on root jekyll project then run gem install feedjira

and we need to install httparty so run terminal with this command gem install httparty

now create new migrate.rb files on root jekyll project , open and edit with code editor and copy paste this script code

include RbConfig

require 'rubygems' if CONFIG['host_os'].start_with? "darwin"
require 'feedjira' # gem install feedjira
require 'date'
require 'optparse'
require 'httparty' # gem install httparty

def parse_post_entries(feed, verbose)
  posts = []
  feed.entries.each do |post|
    obj = Hash.new
    created_datetime = post.updated
    creation_date = Date.parse(created_datetime.to_s)
    title = post.title
    file_name = creation_date.to_s + "-" + title.split(/  */).join("-").delete('\/') + ".html"
    content = post.content
    
    obj["file_name"] = file_name
    obj["title"] = title
    obj["creation_datetime"] = created_datetime
    obj["updated_datetime"] = post.updated
    obj["content"] = content
    obj["categories"] = post.categories.join(" ")
    posts.push(obj)
  end
  return posts
end

def write_posts(posts, verbose)
  Dir.mkdir("_posts") unless File.directory?("_posts")

  total = posts.length, i = 1
  posts.each do |post|
    file_name = "_posts/".concat(post["file_name"])
    header = %{---           
layout: post
title: #{post["title"]}
date: #{post["creation_datetime"]}
updated: #{post["updated_datetime"]}
comments: false
categories: #{post["categories"]}
---
}
    File.open(file_name, "w+") {|f|
      f.write(header)
      f.write(post["content"])
      f.close
    }
    
    if verbose
      puts "  [#{i}/#{total[0]}] Written post #{file_name}"
      i += 1
    end
  end
end

def main
  options = {}
  opt_parser = OptionParser.new do |opt|
    opt.banner = "Usage: ./blogger_to_jekyll.rb FEED_URL [OPTIONS]"
    opt.separator ""
    opt.separator "Options"
    
    opt.on("-v", "--verbose", "Print out all.") do
      options[:verbose] = true
    end
  end

  opt_parser.parse!
  
  if ARGV[0]
    feed_url = ARGV.first
  else
    puts opt_parser
    exit()
  end

  puts "Fetching feed #{feed_url}..."
  xml = HTTParty.get("https://hockeycomputindo.blogspot.com/feeds/posts/default").body
  feed = Feedjira.parse(xml)
  
  puts "Parsing feed..."
  posts = parse_post_entries(feed, options[:verbose])
  
  puts "Writing posts to _posts/..."
  write_posts(posts, options[:verbose])

  puts "Done!"
end

main()

note : change https://hockeycomputindo.blogspot.com/ with your blogspot or your domain name .

then open terminal again and run migration command ruby migrate.rb http://hockeycomputindo.blogspot.com/feeds/posts/default

now you can see on _posts folder all your blog post article from blogspot will be export in to jekyll.

so let’s run your jekyll and view your jekyll site - blogspot to jekyll import article , run this command

bundle exec jekyll serve or use jekyll serve

then open web browser and visit on localhost:4000

congratulations you have successfully import your blog post article to jekyll.

Blogspot to jekyll import options 2

If you have many post article content let’s say you have 1k article so you can use this step.

or you can read jekyll blogspot importer documentation here →

download you backup-blogspot.xml files and move to your jekyll project

after that we need to install importer plugins,open your terminal and run gem install rexml safe_yaml

Now we need to create new files - so just create new files and rename it with blogger.rb

then open files and copy paste this blogspot to jekyll script →

now open your Gemfile and add gem 'jekyll-import'

open terminal and run bundle install

and we can import blogspot post with run

bundle exec jekyll import blogger --source blog.xml --no-blogger-info --replace-internal-link --comments

or use

jekyll import blogger --source blog.xml --no-blogger-info --replace-internal-link --comments

that’s it !!

run your jekyll site bundle exec jekyll serve and open localhot:4000

Congratulations you have successfully to migration from blogspot to jekyll !!

Now you just need to create permalink concept on _config.yml for make same with blogspot url link , for example jekyll by default is use site.com/years-month-date-post

blogspot is use site.com/years-month-post

so if you need to fix url link same with blogspot, you just need settup your _post permalink on _config.yml

you can follow how to create permalink on jekyll here →

with fix this permalink so you not lose your blog url for SEO reason. like this site is use custom permalink with site.com/years-month-post

We hope this article help you for migration progress from blogspot to jekyll