Hello guys from WordPress, lol. This week was full of surprises actually, moving into WP be like ‘Woah this is new, so let’s just act like we know everything,’ and began to tapping all the coding thingy. We have so much fun discovering (and drolling actually) with all the new stuff and not to mentioned some tiny obstacles. Thats my friend, the purpose of this post*winking*.
I’ve thought that there is no way I can explain all the coding part of this blog (as you know, am more into writing), hence for that very reason I would like to invite Hamzah, as my coding backbone to be my special guest in delivering all the facts on how actually we move into the new ‘world’.
Hamzah is a programmer, now working remotely for KLSandbox . He even writes blog using the html tab (the actual html tab) for fun cause he have this bench mark defining quality of the post from its core (the codes, I mean). As a technologist, he often shares his thought on Blog Budak Geek. You may find his blog full of tech info and coding/programming thingy.
Here from Hamzah himself;
Before I start, let me write first a nice quote about change I found in the internet,
Without change there is no innovation, creativity, or incentive for improvement. Those who initiate change will have a better opportunity to manage the change that is inevitable.
So about a week ago Eyqa are telling me about her idea of buying a new domain name for her blog, as a way to make the blog more personal. So, i on the other hand then give her more radical idea, what if we make a full transition, from Blogger to WordPress ? Just to learn new things, this also makes us having more control over the blog. Due to the openness of the WordPress, we can access the code and make changes however we want.
After that, we try to install WordPress locally ( on my laptop ) first and do some work, like testing bunch of templates & plugins, this is just to get a general idea on how it works. The tools i use to install it locally are, Laragon. It is a simple webserver that has an option to install WordPress easily, but this is for Windows user only. After some testing, Eyqa bought the domain name and virtual private server (vps), then the migration process takes place.
I choose to use vps and not the shared hosting because i want to access the server more easily, plus i did not want to be restricted by the hosting company on what the server can and cannot do. For example, maybe someday in the near future we want to mount the server with dropbox to extend the size of storage ( not tested yet, but i found the codes for it here ).
However, like anything else, things sometimes didn’t go the way we want or planned. There are some hiccups we encounter while trying to migrate from blogger to WordPress.
Some issue while migrating
Slug are changed on WordPress
While migrating the posts from blogger into WordPress, we are using the official tools provided by WordPress. But after migrating, we found out that the tool arent working perfectly, it create some bug. The major flaw are when it store the slug ( slug are the part of the url that created as a permalink for the post, it usually using the post title by transforming the words into url, for example on this post, Our Emotion , WordPress make the url as http://www.thehundredpages.com/2017/03/our-emotion.html ) WordPress isnt realy use old slug from Blogger, but it create it own new slug based on the post title it saved.
This lead to another bug when migrating Disqus to new domain . If you are using their service for comment, slug are very important, because it is the one Disqus use to identified the discussion for the post. Thus, when the slug are changed, the old comments wouldnt show up anymore.
I create a tool to check the slug, by comparing the posts link on blogger and wordpress to see if both links matches, but it not really perfect yet. I will share the tool later after i clean the code. So, bookmark this post if you are having a plan to migrate from blogger to wordpress. I’ll put the link for the tool on this post later.
If you found out there are some links between Blogger and WordPress are not same, there are 2 ways you can can edit the slug manually. First by accessing the database using phpMyadmin. The posts are stored on wp_posts table , and the slug column are known as post_name. Click the wp_posts table , then click on the SQL tab. After that, replace this the string inside the textarea with this command
SELECT * FROM `wp_posts` WHERE `post_name` LIKE '%keywords-over-here%'
You will need to change keywords-over-here with your own keywords, use your instinct on what will the WordPress gonna replace the slug ( remember, WordPress usually use the post title to make a slug ).
The second approach is, by editing the post slug from WordPress dashboard. You need to go to All Posts, then click the post. Then in the post editor, it should show a word known as permalink, after the post title. Edit this to make it match with permalink from blogger.
Post contents are not optimized on WordPress, at least not on mobile phone
After migration, post contents are not optimized on WordPress. This is due to the different content structure the post editor created while we write the post. In blogger, it creates a different set of tag, with its own class and attributes. But to be honest, i’m not really sure actually, it is just based on my assumption for now. Nevertheless, the different platform has it own way to deal things.
This, however, leads a bug on the design of the template. Some post has a small font, some of the images are missing, also some of the post layouts seems broken on a mobile phone.
The workaround i can think for now is just by editing the post manually, which is might be a bit cumbersome. But at least the post will look nicer and faster because WordPress are optimizing the image load time, when you are using their tag.
?m=1 or mobile mode from Blogger causing a chaos
If you are viewing the website from the smartphone, usually the url will be append with
?m=1 , for example http://icahya.blogspot.com will become http://icahya.blogspot.com/?m=1. This is to notify blogger to use the specific template for mobile. Well it maybe a good approach, because in this smartphone era, we want our website can easily accessible from mobile phone. Unfortunately, when we migrate the blog into WordPress, it handle
?m=1 as a page and in WordPress we didnt have that kind of page, thus it show no page found error. Of course we did not want that, we just want WordPress to ignore that query.
To fix it, i use the plugin called Simple 301 Redirects on WordPress. It simply redirects reader to actual page whenever it see
?m=1 inside the url.
After installing it, just go to the Settings, then go 301 Redirects. It should show a forms asking for the request and it destination, just do it like how i do it on the screenshot bellow.
On the first entry, you just need to put /?m=1 on the Request part and on the Destination part, you just need to put / symbol. For the second entry, put /*?m=1 on the Request part and for the Destination, you just need to write /* .
Tips before migration
Do some research
Before we making the transition from blogger to wordpress, we are making some research first. Reading our fellow blogger who already makes their jump into WordPress. Here are the very nice posts regarding their experience also some tips to consider.
- This are very nice post containing some details on what other problem we might encounter while making the transition, 10 PROBLEMS I FACED AFTER MOVING TO WORDPRESS AND HOW I SOLVE IT by Atheera Dayana
- This post contain some information on what plugins to be considered to install after migration, WORDPRESS PLUGINS THAT HELPED MY BLOG + FREE THEMES by Erin Azmir.
- This is another posts i would recommended you to read, it cover lot of things need to do while doing the migration, How To Perform A Website Migration by Julie
Test it first
I encourage to test it locally first, to make sure all the post and the slug are working. So then we just need to migrate the post table after we test it. But it might a bit overkill, so another approach is by buying a hosting and the domain, then work from there ( or just used wordpress.com it much simpler )
Check the slug after migrating the post
If you want reader can still reach your blog from the old url, make sure the slugs from old blog from blogger are matching up with the new one. I will share the tool i create to test the slug later, and i will share the code too.
Do not delete the old blog
We can actually redirect reader into the new domain by redirecting them using what we call as 301 redirect. It also helps telling the Search Engine about we are moving our site into new url. But in order to do that, we still also need the old blog, to put our redirection code. Also to prevent Blogger from removing the subdomain from their database.
Create a backup blog
Create another backup blog on blogger, import your blog posts into this backup blog. This is to refer the posts someday, in case if you stumble upon the old post and it has a broken images link or whatsoever. But make sure this backup blog arent showing up on search engine, by hiding it on blogger setting.
Go to Blogger dashboard, click on Setting, then Basic Setting. Find the Blog Reader section, and the set it up just for the blog writer only.
How to set 301 redirect on blogger template
After making sure the blog in blogger has the same permalink with the new wordpress site, you will need to edit the template to include this code. This code are simply just telling your reader that your site has been moved to a better place, no pun intended #sorrynotsorry .
Log in to your blogger dashboard, then click on Template and Edit Html. Find
<head> tag , after that copy and paste these codes.
<meta content='0;url=http://www.your_new_url.com' http-equiv='refresh'/>
var oldURL = "your_old_url.blogspot.com";
var newURL = "www.your_new_url.com";
var url = location.href;
var newURL = url.replace(document.domain,newURL);
window.location = newURL
Dont forget to change the url according to your needs.
Migrating the Disqus into new post
Thankfully Disqus got us covered on this thing, to migrate the comment into new domain go to the Disqus dashboard panel, click on Tools > Migration Tools. Then click on start domain migration tools button. If things are properly setup, it should be showing all the comments into new website.
But in our case, at first we didnt know that wordpress are changing some of the slug, so some of the comment arent really migrated properly. In order to fix it, we have to change the slug on wordpress first, and then use the second tool from disqus, URL Mapper to set the url manually.
Done (Is it ?).
So, after a week trying to fix what not working and add some more functionality we needed. Finally, we manage to make the transition from Blogger to WordPress . To be honest, this is have been a fun experiment, there are lots of things we need to improve and maybe need the fix. But we didnt have to fix all it in one go, we will do it one by one & learn from there.
Also i want to take this opportunity to say thanks to Eyqa for giving me the chances to learn about WordPress by helping her on making the transition. Allright that’s it, till next time fellas.
You may ask here if you have question regarding the matter. 😀