Over the last week, we have been busy moving our main website from the Hubspot platform (where it has been since 2008 when I heard one of the Founders talk about it at the Business of Software Conference) to WordPress.
In this article, we have tried to document HOW we did this and things we found useful.
Comparison of Systems
Hubspot is designed as a complete, integrated system, providing a ‘walled garden’ without demanding high technical skills. WordPress is a basic platform with a huge number of add-ons. It is a bit like comparing a set menu (with a limited set of sensible/complementary choices) versus an alacarte menu with more choice but more complexity. Both are valid approaches.
Hubspot charges a monthly fee to use. The basic WordPress is free and there are many free plugins. There are also many commercial tools, themes and plugins on WordPress and you will also need to invest time in learning, backing up, etc.
It is wrong to see a comparison of Hubspot and WordPress as free versus commercial. I would not recommending moving just as a strategy to cut costs.
Have a clear and limited objective
We were very clear that we wanted to migrate the site to get a better site (especially on mobile) in first quarter 2014 to fit in with all our other activities in 2014.
We are launching several new products or major updates, hiring new staff and going to JavaOne in San Francisco in September and several other big promotional events. So 2014 is a very busy year for us and we had made detailed plans in last quarter 2013….
There was also a very strong dislike of the clunky nature of the Hubspot CMS (Hubspot have a new COS system but we have no experience of this system). The very wide range of the tools (both free and commercial) on WordPress was also an attraction.
We did not want to redesign the site at this point, just migrate the content. We found it very useful to have a notepad (or a tool like Trello) handy to log all the great ideas you come up with while you port the site. Note them down and make that phase two. Or go for a total redesign.
But be clear on what you want to achieve.
The actual process
We set aside a week and 4 of our team to migrate the site (which is about 150 pages). This process requires a reasonable level of technical skill (you really need to know at least CSS) if you intend to attempt this.
We also had separate discrete tasks to each person. We found several people on the Internet offering a migration service but cannot comment on them.
One gotcha to watch in WordPress is that there is no protection for people trying to edit the WordPress CSS file simultaneously and over-writing each others changes. It needs manual co-ordination.
Setting up a WordPress installation
You will need a WordPress installation setup. We just this on a sub-domain so we could test and work on.
We experimented with several WordPress themes with some dummy pages and eventually choose the Responsive theme from MailChimps (if you are making extensive use of it, the $34 upgrade to the PRO version is well worth it IMHO).
There are lots of plugins to install to extend WordPress. Our favourites included Tree View (which made working with the pages much easier), a responsive Carousel, and HTML import (which I will make use of later to automate much of my work copying across pages).
We also created a set of templates and menus (using different templates allows context-specific menus).
We have 2 products (a PDF library and a PDF to HTML converter) so we identified separate sections as PDF sales/PDF support/PDF downloads/HTML sales/HTML support/HTML downloads. We also had templates for About us, general pages and our newsletters. We built our new site on this and tested it.
Once it was ready, we made this our main domain by altering the DNS records to point www.idrsolutions.com away from Hubspot to our new version.
Migrating Content
You will have different types of data on the system. I will now cover each in turn.
1. Ordinary Pages
These are generally static pages (and the easiest to move across). The aim here is to preserve as much as possible (including SEO) and automate as much as possible.
I used a tool called WGET which allowed me to get a directory of files containing our website pages. We ended up with a large number of directories, each containing a HTML file. Each directory had the name of the page and the HTML file contained the page content. Because we have a regular design on the site, all the actual page content is found between some HTML tags.
I wrote a simple script to get the content between the tags and write it out as a file using the name of the directory. I ended up with 102 files containing the actual flat sales, support and marketing content.
The Landing pages have a different structure and produced empty files which I ignored. Using HTML import, I could import these files into WordPress as pages (with the same name as the current pages).
A nice touch in HTML import is that I can import with a Pending status and then make live as I work through. Wget also generates a directory called Portals which contains all the images. I copied this into WordPress and also the CSS from the Hubspot CSS file into the WordPress CSS file and the static content looks much as it did before.
The Time consuming bit then begins…. The pages do not have any navigation so I worked through each in turn, setting the template for the page. We attached the menus to the templates which made it very easy to structure and change the site.
I also had to manually paste in metadata, keywords and Page title. This is the boring bit so I recommend you get something interesting to listen to – I personally recommend bigfinish.com 😉
Once this was done we had the vast majority of the pages on the new site, looking correct and with the same name and metadata.
2. Blog
Our blog was already hosted on WordPress on a separate sub-domain so not an issue here. If I was migrating a blog as well. I would use the same strategy of keeping the same page name and extracting the content into WordPress as blog posts. You will probably lose any comments.
4. Calls To Action
You will find the images for any Calls To Action in the Portals directory but will need to recreate manually as they are using a new backend system to implement. We also took the opportunity to rewrite in text/CCS and move away from images.
3. Landing pages
You can manually cut and paste your content into new Landing pages. Again you will need to recreate in WordPress as you are now using WordPress to provide the backend functionality.
If you are using MailChimp to provide responses, emails are sent on the hour (in Hubspot they are sent immediately. You may want to change the content on the response page to reflect this.
5. Campaigns and Prospect details
Hubspot makes it very easy to export your details and import into another tool (we used MailChimp). You will be required to validate your leads list and pay a monthly subscription for both these. We setup a whole set of new Campaigns in MailChimp.
WordPress itself has some plugins to allow you to monitor leads and see when they reconnect.
Final Words
That completes our transfer of the website.
Overall we have been very impressed with the WordPress platform and the sheer variety of tools and options available. We will document some of these in later articles.
If you are happy with Hubspot they are adding some interesting new enhancements and there is no need to move.