Logging In
If content management is all about through-the-web editing of content, the first thing you'll need to do is log into your new Plone site. You can use either the log-in box on the left or the log-in link in the blue bar near the top. Use the administrator password that you set up during installation of Plone. If you used the Windows installer, you set up an administrator user name and password already. If you're on Mac OS X, the administrator user name and password are listed in the /Applications/Plone-2.5.2/Instance/adminPassword.txt file. For other platforms, consult your documentation.
After logging in, you'll notice that the blue bar changes to something like the following:
This is called the personal bar and contains useful tools. Click "my folder" to head over to the administrator account's personal folder. By default, each user who signs up or is given an account on a Plone-based site gets a personal folder where he or she can practice creating and editing content with Plone. Naturally, you can configure this behavior, but for an out-of-the-box set up of Plone it makes a lot of sense to provide private work areas for people to experiment. And. that's exactly what you're going to do.
Uploading Images
If a picture can paint a thousand words, an uploaded image has got to be worth at least 498 or so. And so, create your first kind of content on your new Plone site: an image. Go ahead and grab one of your favorite pictures in the JPG, PNG, or GIF formats and get ready to upload it to your Plone site. (Because Developer.com is a family-friendly publication, I'll stick with a family photograph myself.)
After you've clicked "my folder" in the personal bar, you'll see that there's a green bar and frame surrounding the main part of the browser window. The green bar includes tabs for viewing and editing details about your folder, as well as some drop-down menus. Click the "add item" menu and select "image" from the list:
You'll get a short form to fill out. Enter the title of your image as well as a fuller but brief description of it. Why bother with a description in addition to the title? The description is useful because it gives additional text for Plone's built-in full-text search engine to use in locating the image. It's also handy for people with visual impairments; the description can fully describe what the image depicts, for example. Also, in search summaries, the description text appears to help guide people towards interesting content. So, always enter a description when you can.
After entering the title and description, use your browser's file-upload widget to find your image. When you can, try uploading a good, full-size image. Why? Because Plone automatically generates thumbnails of your image for you at various standard scales, so it makes sense to give Plone the best to work with, and give visitors to your site the option to see the full-size images when they can.
Below the space where you specify the file to upload, you can specify other content that this new images relates to; just ignore that section for now. Below that is a section where you can allow users to comment on your image; ignore that too. Finally, click "save" at the bottom. You've got a new image on your site now!
Click here for a larger image.
Oops, I forgot to rotate the image before I uploaded mine, but actually Plone can help me out here. By clicking the green "transform" tab at the top, you can rotate and flip your image as needed until it's just right. In my case, I chose "Rotate 90 clockwise" and hit "execute." Now it's perfect.
Creating Pages
Creating and editing web pages on your Plone site is purest simplicity. Whenever you see a page that you have permission to edit, you can click the green "edit" tab at the top to change the text. You can use the "add item" menu to add pages to a folder as well. Add a new page to the administrator's account folder now. Click "my folder" in the personal bar to go there, and then click the "add item" menu and choose to add a page.
As with adding an image, you'll have to enter the (mandatory) title of the page and (optional) description. It's "good practice" to enter a description, because it will appear in search summaries and help visitors determine whether they've found the right page to read.
Below that is the document editing toolbar:
Click here for a larger image.
If you've used word processing programs such aske Microsoft Word, you probably already know what nearly every button on this toolbar does. You can choose various text styles, justification, list styles, indentation levels, and more. The button on the far-right is the "zoom" button that hides all other parts of Plone so you can focus just on editing your text. The drop-down menu lets you select paragraph styles. The "HTML" button lets you edit the raw HTML, if that's your thing.
After entering some text of various kinds, it's time to add an image to this document. To do so, try clicking at the beginning of a paragraph in your text and click the "tree in a picture frame" button. A "window" will appear where you can navigate your Plone site to find images to insert. In this case, click the "Current folder" item in the far-left list. Then, click the image you previously uploaded. You'll get to see a thumbnail of your image to help you make sure it's the one you wanted. You then can set to ALT text (which is by default taken from the title of the image object), how to align the image, and, if you scroll down, you can pick the size of the image. Try picking "right" alignment and the "mini" size, then click "ok." Your results may resemble the following:
Click here for a larger image.
By choosing the "right" alignment, the text of your document automatically flows down the left side of the image. Choosing "left" alignment would make text flow down the right side of the image; and choosing "inline" means the image is treated as just another glyph in the text.
Finally, when you're happy with the page, exit the "zoom" mode if you entered it, scroll down to the bottom of the page, and click "save." You now have a new page in your site, ready for viewing by a anxious Internet audience.
So What?
For you hard-core developers out there, this is hardly rocket science. After all, you can easily FTP images and HTML files onto an Apache-based server, right? Of course; but the real benefit here is that now you don't have to: Rather than be shackled to web server duty, your sales rep, press secretary, regional manager, and even your boss will be able to help maintain vital product information, news releases, and more. And, you haven't even yet touched on customizing the look-and-feel of your site for your own company's requirements, or how workflow can be used in an publication cycle, or how you can insert editorial oversight, or how permissions and sharing can create collaborative and private work environments, and how customized content types can be leveraged to pioneer new web applications with little-to-no lines of code.
But, I'll have to save that for the next article.
About the Author
Sean Kelly discovered Plone about a year ago when he inherited a public portal project from another developer and instantly realized the potential for streamlining the development of web applications and deploying web sites using it. He's been a happy if somewhat tipsy Plone evangelist since, and is usually available for specialized software development for the media, medical, and aerospace industries.
He resides with his wife Mary and daughter Ariana, who are genuinely concerned by his wine-making hobby.
IE 7
Firefox 2.0
