Converting Weebly to WordPress – Migration

How to convert Weebly sites to WordPressFor those who find themselves constrained by the more rigid Weebly environment, converting  to a flexible content management system such as WordPress can solve many issues. Weebly is not a bad choice per se, as it seems robust and very easy to use. What it seems to lacks (at present) is the huge designer and developer base that drives evolution of 3rd party applications, along with premium (paid) plugin versions, and diversity of design themes.

WordPress on the other hand has a decade of service behind it, many millions of users, thousands of design themes and a plethora of plugin applications designed to cover almost any feature or function you might want to add. On top of that, there are vast numbers of experienced designers at your disposal, hosting is available from all corners of the world, and you are therefore in complete control of your own destiny.

How to Migrate a Weebly Website to WordPress

It seems that some Weebly users outgrow their niche, become frustrated by constraints and need to expand beyond what Weebly offers. The difficulty in Weebly to WordPress migration – or to any other platform – almost seems to be a deliberate strategy to retain users. There is absolutely no Export option at all. Adding an Export To option could not possibly be an insoluble programming challenge, and given the number of questions on the topic floating about the web, there is an apparent user need for an escape sequence.

Moving from Weebly also requires you to change hosting… All of that can become a little daunting for a non-technical user, but professional help is available if you need it.

Human nature being what it is, no escape hatch provision makes us nervous – no one likes discovering that there is no easy way out – it may even trigger paranoia! Smart systems developers remove the potential for anxiety by ensuring that Import and Export functions are integral components. Simply providing an Export function eliminates the concern that not having one generates! It immediately takes away a compelling reason to migrate to a “safer” system.

In migrating from Weebly to WordPress, preservation, and preferably enhancement of search engine rankings is another consideration. It is straightforward enough to transfer the entire site and preserve the exact same URLs. However, you may want to take the opportunity to enhance URLs, and/or create an hierarchical file structure. That requires a structured approach where old file names have 301 Permanent Redirects put in place, pointing to their new location. See our tutorial on 301 redirects.

I was recently involved in migrating a 200+ page Weebly site to WordPress, and the following sections outline how that was achieved.

Import to WordPress via RSS

The problem I found is that the existing documentation available presumes that the ONLY solution is to use RSS outputs from Weebly to extract Posts only. Extracting Pages was viewed as utterly impossible. Equally daunting was the presumption that extracting more than 10 Posts could only be done by some URL trickery, using Google Reader! Unfortunately, the Reader app has been discontinued since the Weebly to WordPress migration process was first documented in the few helpful online examples. Therefore, that solution is no longer viable!

The Weebly to WordPress Migration Solution?

The best thing about being old is that you can remember how hard things once were, and the tricks built into old software to solve challenges. These days, solutions that once worked well have been forgotten, deprecated or seen as pointless features. A case in point is the excellent website “Import” function in both MS Frontpage and it’s successor – Expression Web… Whilst both may have faded into the mists of time, having a copy of either can be fortuitous!

Import Weebly via WP HTTP Importer

This is the best option available, able to extract hundreds of pages of posts with ease! The import process interprets the page / directory structure, and it should be possible to get ALL content transferred over into an hierarchical format.

This is a multi-stage process;

  1. Import the website via MS Frontpage, Expresion Web or similar software application
  2. Clean out unwanted code segments – headers, footers, sidebars
  3. Use HTML Importer for WordPress

Initial Import

The “import” function in MS Frontpage allows HTTP import of an entire web site. The software follows every link and downloads pages, posts and images into the same structure it was imported from. No matter that Weebly is a database-driven site with dynamically generated pages – these are simply imported as HTML pages!

File Name Extensions

If your Weebly site was set up to produce file externsions such as .html or .htm, you are in luck. MS FP or Expression Web will handle those with aplomb.

On the other hand, if you have URLs without extensions, and a nested page hierarchy, this creates a real mess. You end up with subdirectories where the parent page becomes index.html inside a directory.

To save yourself time and anguish, I suggest you first attempt to re-set the URL format to .html for the duration of the import process. Change it back after you are done.

The page structure of header, sidebar/s and footer is imported intact, and this is the area where some work is required before the third stage – importing into WordPress – is done.

Removal of Surplus Weebly Content

MS Frontpage has an excellent “search & replace” function that works across a single page or all pages in the imported site. This is ideal for trimming out the unwanted elements, the goal being to reduce imported pages to the core page content elements.

MS FP also adds a raft of proprietary _vti_cnf directories – once you’ve completed the import into the “My Websites” folder, find and copy the imported site’s directory to your Documents directory where you can work on it. That way, you’ve got a backup if anything goes wrong…

NB 1: Win7 Windows Explorer allows you to Search for folders within a folder. Use this to find and remove the MS FP garbage directories.

NB 2: Make a backup copy of all your imported pages so that you can recover from any “search & replace” disasters that occur!

Open a page in code view, and copy each unnecessary code block. Use “all pages” search, and replace with “blank’ to get rid of it. Do this on;

  • Header menu chunks
  • Footer
  • Sidebar
  • Google analytics
  • Tagline in <title> section, as WordPress auto-adds this

Basically, remove all the stuff that is not required to be imported into WordPress.

Do leave the page title and description, as these can be preserved in the final import phase.

Set The Heirarchy

Depending on how your Weebly site was structured, you might want to take this opportunity to implement a parent/child hierarchy in your WordPress site. The 200 page Weebly site I imported did not have any structure – all pages were generated as if in the root directory.

Importing as a hierarchy requires some additional preparation work so that the WordPress HTML Importer can build this for you.

  1. For each Parent page, create a directory with the same name as the parent page. Copy the child pages and the parent page into the directory
  2. Rename the parent page as index.html

When the WordPress import process is run, the directories are replaced in WordPress with sequentially numbered index.html pages. I had to manually rename these correctly, but that may simply have been a missed setting on my part.

Set the Link Paths

Both MS Frontpage and Expression Web are going to create a working website on your PC – the problems is that all the image and link paths are going to point to internal locations.

BEFORE you upload the files for import, you need to use MS FP’s “search and replace” to change all the link paths from internal (file:/C:) to the original domain name!

<href='”file:/C:/Users/Jim/Documents/My%20Web%20Sites/TestSite/about.html”‘ />

That is mission-critial for images too – having those set to the correct Domain will allow HTML Importer 2 the opportunity to download all the site’s images and add them to the media library.

<img src='”file:/C:/Users/Jim/Documents/My%20Web%20Sites/TestSite/uploads/6/4/2/1/6421668/1358800088.png” />

WP HTML Importer Plugin

I ended up running the import process three times before I got an optimal result. There were a couple of little tricks that I discovered as I went along.

  • Set the Import to start at the <div id=”content”> tag – that eliminates almost all the garbage!
  • Edit the Title and Page Name settings so the WordPress page ends up with an accurate <title> and the correct page name
  • Check the Allows HTML codes and Attributes divs for names that you might want to allow, but are missing from the allowed list*

Example: if there are image maps, allow: area,map,shape,coords,poly

I suggest taking a sample set that includes a couple of parent pages plus a directory with some pages.

  1. Run the Import and examine the results.
  2. Delete the new WordPress pages if they are ugly
  3. Amend HTML Importer’s settings and repeat

After the WordPress HTML Importer Process

It is possible that some residual code embedded within the <body> section of the imported may still appear. Odd little bits like this can be cleaned up with a WordPress “Search & Replace” plugin.

Make a backup before you start this stage!

CSS classes, divs with ID numbers and sundry other elements that the old site had but WordPress or your theme do not may need to be removed this way.

By this time,  your salvaged site should be taking shape within your chosen theme and you can get stuck into formatting your pages to achive your desired look.