Importing Content from a Previous Drupal Site into a New One with BUEditor

The process of grabbing content from an old Drupal site and importing it into a new one involves just a few simple steps. The key is to be sure to copy the source content in HTML format. Once you have that, pasting it into your new Drupal site is a cinch.

Many people have used the Rich Text Editor (called "TinyTinyMCE") in previous Drupal sites. This module posed a number of problems, ranging from installation to improper rendering of code, causing a whole site to "break." Our new Drupal sites now use BUEditor, which is a simple HTML editor that helps people who want to format posts use HTML code easily.

The first step is to make sure that you are copying HTML code from the source. Follow these steps:

Copying the Source Content

A. Click on the Edit tab for the content that you want to copy from your old Drupal site. If you have used the Rich Text Editor in the past you'll see all the formatting buttons), you should see something like the image in Figure 1. Note that we have also expanded the "Input format" section, which shows the previously applied setting.

Figure 1. The edit screen using a Rich Text Editor in the content source.

B. Change the view in the source so that you see the underlying HTML code, then copy it using cut-and-paste commands.

1. Click on the "rich text editor" link just beneath the Body input box.
2. You will see the WYSIWYG buttons disappear, and the text will turn into the underlying HTML code. (This is what you will want to copy.) See Figure 2.
3. Select all of the HTML content that you want to copy. (With your cursor in the Body box, CTRL-A (Windows) or CMD-A (Mac) will select all of the text.
4. Copy the source text using the Copy command, either by using CTRL-C (Win) or CMD-C (Mac) or by right-clicking and selecting "Copy."

Figure 2. The source content now appears as HTML formatted code. Notice the "Overview" heading, for example, which has the <h3> (third-level header) tag applied to it.

Pasting the Source Content

C. Move the HTML source content into your new site.

1. Create the type of content you want using the "Create Content" link on the Navigation Menu. Once you have your content creation screen open, you'll want to paste the HTML source content into the Body ox.
2. With your cursor in the Body box, paste the HTML source content from your clipboard using CTRL-V (Win), CMD-V (Mac), or by right-clicking and selecting "Paste." The HTML coded text from the source site will be pasted.
3. Expand the "Input format" region beneath the Body box by clicking on the "Input format" link.
4. Under Input format, you can select "Filtered HTML," which is useful for most cases. There are formatting tips that tell you how Drupal will interpret the code and spacing that you enter in the Body box. You can also select Full HTML, which tells Drupal to interpret what you paste into the Body box literally. It will only render text that uses HTML tags. Since your source content is in Full HTML, you can select this option. See Figure 3. (Tip: I use this setting because I don't want my content filtered or re-formatted in any way; for routing posts, however, the "Filtered HTML" setting is useful because you can simply type in your message and have line breaks and URLs automatically converted into HTML when posted.)
5. Now you can adjust other settings for this new content (title, URL alias, book outline, publishing options, tags, etc.).
6. Preview your new content by clickin on the Preview button at the bottom of the page. See Figure 4.

Figure 3. The HTML source content has been pasted into the new content page and "Full HTML" has been selected under "Input format."

Figure 4. On the Preview screen, you will notice that the HTML code has now been rendered, with headings, links, and other formatting appearing exactly as they did in your old Drupal site.

Commentary

You will notice that we didn't actually even need to use the BUEditor buttons, so by itself, BUEditor played no role in importing old content into the new site. However, if we now want to reformat text (add headers, links, italics, etc.) we can do so easily. In the Body box, you just select the text you want to format and then click the corresponding button in BUEditor. I'll write up another guide for doing that soon.

--DB, 5/17/2009