If you are reading this tutorial, you've probably been put in charge of moving the contents of your existing website into your new Plone website. You also likely have some content that exists in word-processing documents, and even some pictures on your desktop that need to go on the new site as well.

This tutorial will teach you the best ways to move all that content into Plone, without having to re-write everything.

Finding Content

If you are working on building a new Plone-powered website, you fall into one of two categories:

1. Your organization has an existing site that you wish to transfer into Plone, or
   
2. Your organization doesn't already have a site and you want to create a new one using Plone.

In the first instance, most of your content already exists on your old website, and you simply wish to transfer it to the new one. As part of that process, you probably be doing some editorial work along the way: deciding what content to keep and what to get rid of. You may also need to write content for brand new sections.

In the second instance, your primary job is to write and/or gather content together for the new website. Your desktop computer will act as the staging area for all the images, text, links, and so on that eventually will be part of your new Plone website.

What's important to know? Your existing site (or content found in a Word document) may be using different fonts than the standard fonts found in Plone. When you copy and paste from Word or from your existing website, some formatting also gets copied along with the text. It's your job to remove the existing formatting of your content before pasting it into Plone. This is done in three steps:

1. You must first convert your content to Plain Text. To do this, copy some content using CRTL+C. Open Notepad and paste (CRTL+V) the content into Notepad.
2. Copy the same content again out of Notepad.
3. Paste the content from Notepad into Plone.
   
   

To copy content, simply highlight (click and drag the mouse pointer over the area you wish to copy) the text you want and push CTRL+C or right-click and choose Copy.

You'll probably notice that the spacing between paragraphs may have changed a bit. There isn't really a way around this, so you'll need to do some tidying up. Other formatting such as bold, italics, or numbered and bulleted lists may need to be re-created using the editing tools found in Plone.

It may seem like these are limitations of Plone, but in fact it's being picky to help you out. If you don't convert to plain text first, some HTML can find its way onto your site (such as table formatting) that can make things display strangely and requires editing the HTML to remove.
 

Things to remember:

• Links will not copy. The web address of the link is probably going to be different on your new site anyway.
  
• Images will not copy. Images must be saved to your desktop computer first, then uploaded to Plone.
• Fonts will not copy. Plone converts all fonts to a one standard, widely supported font. Using the text editor in Plone, you can override the standard font with styles available in the style menu.
  

Let's assume you've just copied some content over from your existing site or Word document. Below is some mock content to illustrate this example:
 

Latin 1-2-3

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nullam egestas lorem ullamcorper erat. Nulla eu nibh a ipsum tempus suscipit. Nam tortor nunc, molestie aliquam, fringilla in, commodo in, felis. Nullam nisi elit, pulvinar a, tempor facilisis, bibendum id, ipsum. Nam aliquet tellus. Cras cursus, justo ac interdum ornare, turpis sapien aliquet tellus, vitae euismod dui dolor id nunc. Nulla sagittis lorem non arcu. Donec volutpat suscipit risus. Sed vitae urna. In cursus consectetuer dolor. Vestibulum leo. Vestibulum non enim. Phasellus in odio. Integer ac nunc id odio pulvinar eleifend. Pellentesque quis mi non lectus laoreet consectetuer. Donec adipiscing velit ut urna. Donec tempor. Aliquam vitae quam nec lacus varius nonummy.
The following verb tenses can be found in the next paragraph:
•    Present Tense
•    Future Tense
•    Past Perfect
•    Imperfect
Nulla ut odio vel pede placerat commodo. Nullam odio urna, interdum volutpat, accumsan vitae, auctor nec, orci. Ut rhoncus. Phasellus scelerisque quam id nisi. Aliquam erat volutpat. Nam laoreet. Maecenas fermentum. Fusce imperdiet. Vivamus at lorem. Suspendisse laoreet ullamcorper est. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Ut semper lacus sed tellus. Sed erat diam, pellentesque non, molestie id, pretium at, velit. Suspendisse ac diam. Nam cursus auctor turpis.

The original document looks rather different. There are words in bold, italics, text that is centered, and a bulleted list is part of the page too.

Click the image to enlarge it.

Using only the formatting tools found in Plone's Kupu Editor, such as the style drop-down menu, the bold icon, the italics icon and the bulleted list icon, I can re-create the formatting of the original document. You may not be able to get it exactly the same, but you're writing for the web here, and should follow the best practices for writing online.

The final result looks like this:

Latin 1-2-3

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nullam egestas lorem ullamcorper erat. Nulla eu nibh a ipsum tempus suscipit. Nam tortor nunc, molestie aliquam, fringilla in, commodo in, felis. Nullam nisi elit, pulvinar a, tempor facilisis, bibendum id, ipsum. Nam aliquet tellus. Cras cursus, justo ac interdum ornare, turpis sapien aliquet tellus, vitae euismod dui dolor id nunc. Nulla sagittis lorem non arcu. Donec volutpat suscipit risus. Sed vitae urna. In cursus consectetuer dolor. Vestibulum leo. Vestibulum non enim. Phasellus in odio. Integer ac nunc id odio pulvinar eleifend. Pellentesque quis mi non lectus laoreet consectetuer. Donec adipiscing velit ut urna. Donec tempor. Aliquam vitae quam nec lacus varius nonummy.

The following verb tenses can be found in the next paragraph:

• Present Tense
• Future Tense
• Past Perfect
• Imperfect
  
  

Nulla ut odio vel pede placerat commodo. Nullam odio urna, interdum volutpat, accumsan vitae, auctor nec, orci. Ut rhoncus. Phasellus scelerisque quam id nisi. Aliquam erat volutpat. Nam laoreet. Maecenas fermentum. Fusce imperdiet. Vivamus at lorem. Suspendisse laoreet ullamcorper est. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Ut semper lacus sed tellus. Sed erat diam, pellentesque non, molestie id, pretium at, velit. Suspendisse ac diam. Nam cursus auctor turpis.

There's some simple tricks that can really help you to get your pages to look right. The most common difficulty is getting the spacing between lines or paragraphs correct.

Paragraphs and Line Breaks

When you push the Enter button on your keyboard, Plone assumes that you are starting a new paragraph. If you want to force a single line break, you need to hold down the Shift key, then press Enter. Here's an example:

sampletextsampletextsampletextsampletextsampletextsampletextsampletext

sampletextsampletextsampletextsampletextsampletextsampletextsampletext

sampletextsampletextsampletextsampletextsampletextsampletextsampletext
 

I pushed the Enter key between each of those lines. Notice the amount of space between those lines. Now look at the same lines of text, this time using Shift+Enter:

sampletextsampletextsampletextsampletextsampletextsampletextsampletext
sampletextsampletextsampletextsampletextsampletextsampletextsampletext
sampletextsampletextsampletextsampletextsampletextsampletextsampletext

can also be quite useful for positioning text in relation to images.

Paragraph Style and <no style>

Highlight some text on your Plone site, and look at the style drop-down menu in the toolbar. If you chose a regular block of text (not a heading or table), you should see the words Normal Paragraph. Normal paragraph, is the standard text style used in Plone. The style gives each line a particular height, and the font a particular size and color. Sometimes, you may encounter lines of text that appear closer together than they do with Normal Paragraph. This is because, somehow or another, the text isn't recognized as being in a paragraph. When this is the case, you'll see the words <no style> in the drop-down menu.

The Apostrophe and Quotation Marks

You wouldn't think that such a benign thing could be so much trouble, but it can be from time to time. Basically, computers have several ways of displaying these characters. For best results you want the ASCII apostrophe and quotation mark which is a straight hash mark, not a stylized curly one. The reason is that not all web browsers know how to render stylized apostrophes and will replace them with strange looking characters such as an upside-down question mark, diamond, or something like that. It's exactly the same situation with quotation marks (which are essentially just a double apostrophe).

Example:

“The other day I went to the store,”   This is using the bad quotation marks

"And I bought 14 apples to make pies."    Here's the what you should use instead

When does this problem arise? Usually when you are copying from a word processor into Plone. Even pasting into Notepad which strips out all formatting won't work. You'll have to either change them by hand, or run a find-and-replace operation to get rid of them. You'll notice that in the Plone editor, all you get are "plain-text" apostrophes and quotation marks, so you can fix them there as well.

How do you stop it from happening again? If you're using MS Word, you should turn off Smart Quotes to force all quotes and apostrophes to render as normal ASCII characters.

For Word97, Word2000, and WordXP

1. Pull down the Tools menu
2. Select AutoCorrect.
3. Select AutoFormat As You Type.
4. Deselect Replace as you type "Straight quotes" with "smart quotes".
5. Select AutoFormat.
6. Deselect Replace "Straight quotes" with "smart quotes".
7. Click OK.

So far we've covered how to copy-and-paste text, but let's now turn to images. Here's an example of how to move an image from an existing site into your new Plone site:

The following screen-shots were made using Firefox. Things may look a bit different if you're using another browser.

Find the Image

We'll use the ONE/Northwest website for this example. Let's say I'm trying to re-create the homepage and I'm ready to start moving the images.  Your job is to save a copy of the image to your desktop computer.

Save the Image

Hover your mouse over the image you want to move and right-click. This should bring up a menu similar to the one in this screen-shot:

Depending on how your browser is configured, the items in this list may be different that what is pictured here.

However, you should see a choice there called Save Image As. This operation will allow you to save a copy of the image to your desktop computer. Remember where you saved the file, because you're going to need to find it again!

You also have the opportunity to rename the image file during this process. It's better to give your image files names that make sense. A name like homepage-sprout.jpg is more useful than something like HP0101-46.JPG, which tell you nothing about the image at all. Digital cameras tend to name image files like the latter example.
 

Upload and Insert the Image

Now you are ready to upload the image to your Plone website. Read this tutorial if you need to review how to upload images.

Once the image has been uploaded, you are ready to place it on a page. A reminder about how to do that can be found in this tutorial.

Also, be aware that images may need to be prepared before upload. Read this FAQ to find out how.