Blogging, that’s not an easy job isn’t it? If you’re blogger then you probably know how exactly it feels to take up blogging right? If you’re passionate about it then for sure, it will be exciting but at the same the more and more blogging you do, the higher you have to dig into subject to present information accordingly to meet upto your quality standards and targets as much as possible, it will be challenging task that’s what makes it enjoyable and yeah for sure it’ll let you learn and pratice various skills like for instance content writing, proof reader, presentation, writing skills and many more on the go, which are useful in any era as since ancient times we’ve been using written communication and in future will use it as well as it’s quite necessary so the better you present the more amazing it will be isn’t it? We bloggers spend a lot of time like hours even days and months to write and present information in a way to reach our and viewer expectations thought there will many hurdles in doing it but yeah it has to done right? the more time, focus, concentration, skill and hard work we put in to accomplish writing content, the more experienced and skilled will become to be considered as professional Bloggers.
Do you know? Who exactly is Blogger, if you’re new to this stuff then for you in simple Blogger is basically modern word used for person who does blogging on internet site linked with certain Web2 or Web3 address like for ex : yoursite.com, while blogging is basically making and publishing text written digital content on internet, is it clear? I hope so anyway a blogger can take up multiple roles cause as said earlier blogging teachs you many skills on the flow mainly speeding up the typing, entrepreneurship, management, etc same as like running own newspaper but blogging is less cost, more flexibility and fast reach to people around the world, so a blogger can be said as journalist as well at the end both are similar like in Newspaper even if we write good content and don’t manage and maintain well, it will start to decline and eventually downfall likewise in blogging as well even if you write pretty good content still if you manage other factors of site badly like user interface and user experience etc then blog will start to decline and eventually downfall which is why optimization of not just content but also blogging site is necessary to lead up in ranks and attract visitors globally.
Ranking is everywhere right? We can rank almost anything in blogging like content, quality, writing, user interface and user experience of blog, what not you can rate almost everything, the better ranking your blog has the better and more chances it has to rank on search engines like Google, Bing, DuckDuckGo etc, in sense basically search engine optimisation inshort SEO is important for growth of blog which is why a lot of bloggers try their best and keep on improving seo to get high score so that the blog and it’s articles will rank on top of the search engines which will not just increase organic traffic of blog but also give benefit in many ways like in improving brand value and domain authority etc, that’s why a lot of bloggers use many methods to increase seo though there is both good & bad ones, at the end good methods are better and it will keep blog in safe zone, there are many ways to improve seo out of them speed of blog the higher it is the more you’ll get seo as people tends to view blogs which have less loading times, fast and responsive so if you are newbie blogger make sure your blog load everything in below 5 seconds to stay up in the charts of seo, gotcha?
I don’t wanna bore you off with details how internet and world wide web works and came into existence that’s another story for that you can read our related articles, here in this context will be focusing on evolution of blogs, at first in early era of world wide web almost all people used to make and publish content on static site blogs developed primarily using high level programming language HTML – hypertext markup language by hosting and serving blog contents from computer, as HTML is less resources blog used to be small thus it used to load pretty fast on world wide web browsers, but as time goes in order to evolve a lot of people started using CSS – cascading styling sheets, Javascript, PHP and some other programming languages to make and improve structure of blogs, but the problem here is they add up some more resources and external load on blog, they will reduce blog load time thought optimization like minify and compression of blog code used to improve load times but thing is at the end making, managing, and running blog from own computer used to be bit hard and difficult task for sure.
Especially, if you’re newbie and not web developer setting up static site and manually building and hosting them on your personal computer and serving them on web can be challenging task, it not just takes a lot of time but also can be quite expensive when you’re site has large scale traffic, which is why a lot of people back in time wanted simple and better method to create blog and publish content on web, as there is such huge demand and usage of internet rising rapidly around the world, many companies to supply tried to build digital software portals to simplify all this, in that process we got revolutionary cms aka content management platforms which are easy to utilize with them you can easily create dynamic blog sites and publish content on web in few minutes as most cms platforms offer not just cloud server hosting for blog but also provide all in one tools with simple intuitive user interface and experience to manage blog on the go thanks to that large percentage of people shifted and started using cms platforms that led to evolution of Web 1.0 to 2.0.
Yes, indeed emerging technologies will evolve web like concept of crypto currency and decentralisation etc directly and indirectly played role in evolution of internet to decentralised web 3.0, but at present internet is mostly web 2.0 where we use centralized cms platforms, thought there are many free and paid cms platforms but out of them Blogger by Google and WordPress by Automatic inc. are free and popular ones used by millions of users worldwide, are you one of them? If you’re then you may probably know Blogger and WordPress use number of server-side programming languages, databases, scripts, software components etc in front and backend to publicize your blog and it’s content on web, thought if you take good care in optimizing your blog site making it less size and resources then it will be fast but in any case dynamic server side blog site and content has more resources so they usually take more time to load than static ones which is why a lot of people who want the blog to load faster instead make and use static site blogs.
However, as said earlier unless you’re developer it’s hard to maintain static blog sites atleast you need to have geeky level smartness to cope up and run static blog sites which if you have already then all is well, but if you don’t then cms platforms like Blogger or WordPress are way better choice, but incase you for whatever reason can’t, unable or don’t want to use cms platforms anymore instead want much better and simple way to build and use static blog sites then we have static site generators though in early days of web we don’t have them but as time goes people want simple and fast way to build static sites as there is demand to supply number of developers made and released amazing static site generators like Hugo and Jekyll etc which you can install and run on your server to build and serve static sites in few minutes, so do you wanna use them? If you do then in order to do that first you have to import and convert blog articles from Blogger or WordPress to compatible meta format of static site generators.
Even though, at present there are many static site generators but in this context will be discussing about Hugo an free and open source static site generator written using programming language Go created by Steve Francia back in year 2013 after that it’s development is continued by Bjørn Erik Pedersen with few other contributors, thought at the end as said earlier generally all static sites are fast but when it comes to build time Hugo is promoted and better known for blazing fast site build times then most static site generators, so if you have big site with a lot of articles then Hugo may have slight better edge in comparison to bit slow build time static site generators like Jekyll, anyhow it depends on various factors and mainly it’s user specific, kindly choose the one which works for you, if you choose to use Hugo then you’re at right place, now we are going to show you how you can migrate from Blogger or WordPress to Hugo with GitHub Pages, so do you like it? are you interested in Hugo, If yes then let’s explore more.
• Hugo official and unofficial support •
– Forums
– Discord ( unofficial )
– Telegram ( unofficial )
Note : I’m going to use Ubuntu as it worked and has better compatibility.
• How to setup cloud Ubuntu server to create Hugo site •
~ Enter and execute below commands ~
– sudo apt update
– sudo apt upgrade
– sudo apt install nodejs
– sudo apt install npm
– node -v && npm -v ( check version )
– sudo apt install hugo
– npm install hugo
Note : if you’re theme require hugo extended then use command : npm install hugo-extended on supported platforms like Ubuntu ( it didn’t work on Termux ) and if you use termux use pkg over sudo.
That’s it, you’re basic setup is done.
• How to backup site from Blogger •
– Open Blogger.com.
– Go to settings then scroll down.
– Tap on Back up content
– if download complete, let’s now move forward to import it’s articles using Blog2md tool by PalaniRaja.
• How to import articles from Blogger or WordPress using blog2md •
– Open your Ubuntu terminal.
~ Enter and execute below commands ~
– Example : node index.js b|w <BLOGGER BACKUP XML> <OUTPUT DIR> | Blogger |
– Here, in above command add your blogger xml file name and output directory like this : node index.js b your-blogger-backup-export.xml out ( kindly remember b for Blogger and w for WordPress )
Done, if so let’s proceed further.
• How to create public repository for GitHub pages •
– Go to Github.com, login into your account, then go to your repositories.
– Tap on New ( to create a new repository )
– Enter repository name : techtracker5.github.io ( replace techtracker5 with your GitHub username )
– Scroll down, tap on Create repository.
Well, now let’s move on to setting up Hugo site using Ubuntu.
• How to setup Github and build Hugo site using Ubuntu •
~ Enter and execute below commands ~
– sudo apt install gh
– sudo gh auth login ( now use available options to login into your Github account )
– hugo new site “ yoursitename “
– cd “ your site name “
– git init ( this adds empty repository and set branch always to master )
– git submodule add ( theme url ) themes/ ( theme name ) | replace with your ones |
– ( In above command just change theme url and theme name )
~ Now you have to add Hugo theme of your choice ( I’m using Blist ) ~
– Get hugo themes from themes.gohugo.io or from GitHub repository etc.
Note : each hugo theme has it’s own guide, make sure to check it from official sources before you dive into this stuff for instance Blist theme setup will go like below and it may work for many other hugo themes.
– cd themes
– cd blist-hugo-theme ( your theme name )
– ls
– cp package.json package-lock.json ~/blank ( add your hugo site name root directory )
– Now go back to root directory of your hugo site using command : cd .. twice.
– echo ‘theme = “blist-hugo-theme”‘ >> config.yml ( it will set theme to blist, you can replace with your theme name )
– I’m using config.toml for this theme, but you may use hugo.toml as well, it changes syntax of code, so keep that in mind.
– Once we set theme in config.yml, you can add extra code which you can get from the hugo theme Github public repository.
– In config.toml ( don’t forget to change baseURL to your GitHub respository, it’s important else your blog and imported articles will not work for sure. )
– git config user.email ( GitHub email )
– git config user.name ( GitHub username )
– npm install
– npm i -g postcss-cli
– su ( enter root mode on Ubuntu if npm install & postcss got some errors )
– it asks you to enter root password, if you didn’t already set any root password, set it by using command : sudo passwd root )
– npm install ( Again )
– npm i -g postcss-cli ( Again )
– exit ( to go back to no-root mode )
~ Now it’s time to copy articles to your hugo site directory ~
– cp ~/folder/* ~/sitename/content/ ( replace folder with your folder name in root directory, where you imported your articles and then your hugo site name )
– you can also create sub folder in content directory using mkdir ” sub-folder “ and import your articles over there as well.
– cd .. ( go to hugo site root directory )
– nano config.toml ( copy and paste config.toml code from official theme available in GitHub or anywhere else and then make changes as per needs well )
– CTRL S to ( Save ) and CTRL X to ( Exit )
– nano .gitignore ( enter node modules )
– CTRL S to ( Save ) and CTRL X to ( Exit )
– nano .gitmodules ( copy and paste . gitmodules code from official theme available in GitHub or anywhere else and then make changes as per needs well )
– Hugo ( Command )
– If you getting errors like above missing modules, then install them accordingly as each theme may need different modules.
– npm install postcss
– npm install postcss-cli
– npm install postcss autoprefixer
– npm install tailwindcss
– npm install postcss-import
– npm install postcss-reporter
– Hugo ( now send this command again, after installing all required modules )
– If it shows similar output like above then your hugo site building is success.
– git remote add origin ( your github public repository that we created earlier )
– git remote -v ( to verify it’s origin )
– git add . ( it will stage all changes so far )
– git status ( to verify staged changes )
– git commit -m ” add your description to commit changes here ” )
– git push origin master ( it will push whatever changes to GitHub repository )
– git push -f origin master ( use this if terminal shows any error )
Done, you successfully created Hugo site using Ubuntu and GitHub.
• How to setup GitHub Pages •
– Open your GitHub pages repository, tap on … and then tap on Settings.
– Scroll down, tap on Pages.
– Now change Source: GitHub Actions and then tap on browse all workflows.
– Search Hugo, tap on Configure.
– Tap on Commit Changes…
Note : remember, when you push files to public repository, make sure there are in root directory not in any sub folder.
– Now, wait for a minute and go to your GitHub pages site, it should mostly work if it didn’t check GitHub Actions for any type of errors and then fix them by getting support from Hugo Forums or support groups.
Bingo, you successfully created a Hugo site using Ubuntu and GitHub pages.
Atlast, this are just highlighted features of Hugo and GitHub pages, there may be many hidden features in-build that provides you external benefits to give the ultimate usage experience, anyway this is how you can migrate from Blogger to Hugo hosting on GitHub pages.
Overall, Hugo comes with many super cool themes, it may be user friendly setup and code synax that may works for web developers and geeks, that ensures quite productive experience, but in any project there is always space for improvement so let’s wait and see will Hugo get any major UI changes in future to make it even more better, as of now Hugo is nice.
Moreover, it is definitely worth to mention Hugo is one of the very few static page generators out there on world wide web of internet, which promote itself for blazing fast page build times better than most other static site generators, yes indeed if you’re searching for such static page generator then Hugo is worthy choice.
Finally, this is how you can migrate from Blogger or WordPress by hosting Hugo on GitHub pages, Hugo a free and open source static site generator, are you an existing user of Hugo? If yes do say your experience and mention why you like it in our comment section below, see ya