You’ve heard about it and read about it, but have you ever tried the open source Plone CMS? This enterprise-grade system is surprisingly easy to set up and get going. In this article, you’ll jump into Plone, create simple content objects, and start personalizing the system. In future articles, you’ll start to explore how content management systems can model most web applications by treating business objects as content and business rules as management.
When Tim Berners-Lee first came up with the technologies that would be the foundation of the web—URLs, HTML, and HTTP—he might or might not have had in mind the explosion of systems that would spring into existence to ease development, deployment, and ongoing management of web-based applications, corporate webfronts, blogs, image repositories, portals, intranets, extranets, and more. Design tools have lowered the bar to entry for those unwilling to learn HTML. Web frameworks have simplified application development. And application servers streamline deployment of web applications.
Today, you’re seeing a new breed of web applications specifically designed to solve the problem of content management. A content management system (CMS) provides through-the-web publication management of all sorts of content, including regular web pages, images, and media files, and often provides the basis for collaborative editing, version control, editorial approval, and so forth. With such features, CMSs are ideal for portals, intra- and extranets, and presence management. Moreover, custom web applications can be realized as content management with minimal development.
A special note for Safari users: Plone works okay with the default browser on Mac OS X, Safari; however, the built-in WYSIWYG editor doesn’t work with Safari. Unless you’re comfortable editing HTML directly, you might want to try Firefox or Camino.
You Do Windows?
Windows users have it just as easy as the Mac folks when it comes to installing Plone. I don’t have Windows Vista myself, so I can’t tell whether it works on Vista, but it’s quite happy on XP. Here’s how it goes: Visit http://plone.org/products/plone and click the link for “Get Plone for Windows.” Use the first link, not the second one, which assumes you already have the Zope application server installed.
Depending on your browser, you’ll have an icon for Plone somewhere that you can open:
Follow the on-screen instructions until you get to the “Enter a password” page. Here, you’ll set up the name and password for the administrator account on your new Plone site. Traditionally, people use the name admin, but you can use whatever you like:
Finish the installation wizard and then head over to your Start menu and point to All Programs. You’ll have a new program group, Plone; point to that and select Plone. That’ll make the Plone Control Panel appear:
Click the Start button followed by the View Plone… button and Plone will start up and your favorite web browser will open to the Plone start page.
Welcome to your new Plone site!
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.
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!
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 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:
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:
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.
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.