- Choosing an Open Source CMS: Beginner's Guide
- Nirav Mehta
- 2926字
- 2025-02-23 09:38:24
Time for action-adding a page
- Log in to the administration section of Joomla!. It is generally at http://yoursite.com/joomla/administrator/.
- Click on the large icon that says Add New Article.
- We want to create a page about Surya Namaskara, or Sun Salutation, one of the most popular yoga postures. Enter Surya Namaskara in the Title field, and Sun Salutation in the Alias field.
- We have already created a few sections and categories in Joomla!. Select Postures as Section, and Featured as Category from the drop downs.
- The Word-like area below is a content editor. It is also known as the WYSIWYG (What You See Is What You Get) editor. Type in the following text in the area that looks like a white page. We took this text from Wikipedia, but you can type a statement of your choice.
Surya Namaskara or Sun Salutation (lit. "salute to the sun"), is a common sequence of Hatha yoga asanas. Its origins lie in a worship of Surya, the Hindu solar deity.
Note
Don't see a Word-like editor?
If you don't see a Word-like text editor, you may be missing some browser plug-ins. Your browser may warn you of missing plug-ins. In such a case, go ahead and install the missing plug-ins. If it still does not work, go to Site | Global Configuration | Site | Site Settings | Default WYSIWYG Editor and select TinyMCE or XStandard. You can also configure the editor per user from User Manager.
- Press Enter after the first paragraph. Add two more sentences like this:
Surya Namaskara is an excellent exercise for the whole body. Mastering this asana will help you stay fit forever.
- We want to highlight that Surya Namaskara is an excellent exercise for the whole body. Select that portion of text and click on the B icon to make it bold. You will immediately see the result in the editing window. At this stage, your editing window will look like this.
- If you want to write additional text, go ahead and add it.
- Click on the large Save icon at the top right of the page when you are done.
- Now our content is saved. Click on the Preview link in the Joomla! menu bar and you will see the content on the site's home page. Here's how it will look:
What just happened?
We used Joomla! to create our first content page. We added a page title, an alias, and the section and category this page belongs to. We then used a Word-like editor to enter text for our page.
We emphasized keywords by making them bold. This was done by selecting the keywords, and clicking on the B icon button in the toolbar. Notice that we can use this editor to apply a variety of other formatting to selected text. This kind of text editor is called a WYSIWYG editor.
What is WYSIWYG? Why is it important?
WYSIWYG (pronounced 'wizē,wig) is an acronym for What You See Is What You Get. The Word-like content editor we saw is WYSIWYG because our page looks the same in the editor as it does on the site. The fonts, formatting, colors, and alignments—all work consistently between the editing interface and the actual site.
Most CMSs come with a WYSIWYG editor. Such editors make it very easy for authors to add content and the formatting style that they like. These formatting options look and behave in a way similar to Microsoft Word or OpenOffice Writer. But the complexity of options provided may vary between CMSs.
The following image shows the WYSIWYG editor toolbars of Joomla! (top) and WordPress (bottom). As you see, WordPress offers a simpler editor, but with lesser options. An amateur user will find it easier to work with an editor with fewer choices. As a matter of fact, WordPress's editor toolbar shows only the first row of options by default. You can enable a second row by clicking on the last button in first row: Show / Hide Kitchen Sink. On the other hand, Joomla! comes ready with all options visible. This is useful for a professional who wants better control over content formatting.

Evaluate how important is it for you to have a WYSIWYG editor. Also, see if the CMS comes with it by default, or you have to add it via a plug-in or extension. For example, Drupal does not have a WYSIWYG editor module by default; but you can easily add it via a module.
This also means some CMSs may not have a WYSIWYG editor. So, if there is no WYSIWYG editor, how do you add content? Well, if your content does not require a fancy format, you can live with simple textual content. Else, you can always use HTML.
Note
Do I need to learn HTML?
HTML is the language to layout and format web site pages. If you know HTML, it will be easier to manage your CMS. If HTML is not an option, a WYSIWYG editor can be really helpful. Here are some links for learning the basics of HTML:
Adding images
We have added the basic content to our page. Now, we will try to include some pictures in our page. Images add a lot of meaning to the content, apart from adding a decorative value. Let's add an image to our page now.
Time for action-adding images
- If you are not already logged in to the Joomla! administration, log in now.
- Click on Site in the main menu. That should open a submenu of site management options. Click on Media Manager.
- You will see previews of current images in Joomla!. Click on the stories folder to go into it. You will now see images within this folder.
- Let's create a new folder here to store images of different asanas/postures. In the Create Folder text box near the top right side, type in asanas and click on the button.
- This should create a new folder within stories. Click on it to move inside.
- We can now upload an image here. Click within the text box of the Upload File section at the page end. This will bring up a dialog window to select a file you want to upload. We want to upload an image for Surya Namaskara. Select an image of your choice. Now click on the Start Upload button.
Note
File uploading requires correct permissions on the server
To upload files to your site, you require correct permissions on your server. In technical terms, this is called making a folder world-writable or changing mode to 777. You can change folder permissions using an FTP application, or your site's control panel. Technically, it's sufficient to give a 666 permission—read-and-write permission to the owner, group, and others—but normally everyone gives a 777 permission, including execute permission for all three. Here's a screenshot of setting these permissions using FireFTP, an FTP extension for the Firefox browser.
- The file upload operation may take a few seconds to complete, depending on image size. Once the image is uploaded, you will see its thumbnail in the list. Upload more images if you want to.
- Finally, your folder may look like this.
- We are now ready to insert an image in our page. Select Content | Article Manager from the main menu. Click on the Surya Namaskara page to edit it. Inside our WYSIWYG editor, keep your cursor where you want to insert the image.
- Click on the Image button below the WYSIWYG editor.
- A window will open up with a thumbnail list of images available. Click on the asanas folder we created earlier.
- Click and select an image you want to insert. Add a description and title.
- Click on the Insert button at the top right.
- That will insert our image into the content area. Re-size it using the handles on the corners if you wish. Here's how it will look:
- Congratulations! You have successfully added an image to our page.
We uploaded an image from our computer and added it to a page. In the process, we learned about the Media Manager, creating folders, and uploading files to Joomla!. We also learned how to select images to use on a page and even saw image insertion options.
Adding an image involved multiple activities. We had to first add it to the Media Manager. Because this was the first time we were adding an image, we also created a new folder. It was as simple as typing in a name and clicking a button.
We added images within folders since it will help us manage the images better. Once we add an image to the Media Manager, we can use that image on as many pages as we want. The Image button on the content editing screen allows us to select images to use on that page. It also helps us to add captions and correctly align inserted images with the text.
We have learned enough about inserting images to content now. It is time we try out something else. Once you insert an image, click on it, and then click on the small photo icon in the WYSIWYG editor's toolbar. Go ahead and try out different image properties, different alignment options, spacing, caption, and alternative text. See how the result changes in the preview.

Note
Don't let your images sink your site!
Make sure your images are optimized and sized for web usage. Avoid changing the width and height via image properties. If you want to show a smaller image than the one you uploaded, resize it using photo editing software and use that new version. Large images take longer to load and can make your site slow.
Maintaining content
Apart from editing text content and images, there are many other content maintenance activities we may have to do. We may need to assign categories to content, add metadata, and manage contributions. Let's quickly review how we can accomplish each of these tasks, and assess the CMS in that process.
Our Yoga site will have a lot of information about asanas. Apart from that information, we also want to put up yoga-related products. Hence, it is important for us that our site ranks well in search engines. When someone searches for a particular asana, we want our site to show up on the first page of search results. There are numerous techniques to achieve this, and this subject is known as Search Engine Optimization (SEO).
One of the techniques for SEO is having good page titles, meta tags, and relevant text. Let's start by adding some metadata to our page.
Time for action-adding metadata
- Log in to Joomla! administration and edit the Surya Namaskara page we created earlier.
- On the right bar, locate the Metadata Information tab.
- Enter a description and some important keywords about this page.
- Let's also make the page title more descriptive. Instead of just calling it Surya Namaskara, change the title to Surya Namaskara - Sun Salutation - Ideal way to perform this ideal Yogasana.
- Click on the Save button at the top right to save the page.
- Joomla! sets some global metadata by default. Let's change that to our requirements. Go to the Site | Global Configuration | Metadata Settings.
- Change the Global Site Meta Description and Global Site Meta Keywords fields. Values entered here will show on all pages of our site. Save the settings.
- Now, go to site Preview and navigate to the Surya Namaskara page. Right-click on the page and click on View Source to view the source code of the page. Near the start of the HTML source code, you may see something like the following image.
- It's the description and keywords we entered. If you go to another page where we haven't entered metadata earlier, you will see the global metadata. The search engines—and humans—should be able to understand our pages much better now. Job well done!
We set up site-wide and page-specific description and keywords. We also changed the page title to be more informative—something that could attract visitors to our site if they see it on the Google search results page.
Metadata embedded in a page is not visible to the users, but software can see it. So, you can use metadata to help search engines or other software that is going to read that page.
This metadata can also help in identifying content. Description metadata can be used to show a summary of the page in archives. If we have a site search engine, keywords can be searched to find a match for the user. As a matter of fact, some search engines (not Google) rely on metadata from title, keyword, and description tags along with the content body—giving more weight to metadata.
Some CMSs allow adding custom metadata. This is a great way to embed additional information. You can put in the author name, revision date, source of the content, licensing attributes, or anything else that you prefer. In our case, we can possibly use metadata to find products related to a posture.
You may have heard about "tagging" your content. Tagging essentially means associating some keywords to content. These keywords are searchable, and can be shown on a page. Clicking on one tag or keyword can show you a list of all other content items that belong to that tag. This concept originated on blogs and is now available in many CMSs. Adding tags even allows you to build beautiful tag clouds using font sizes in proportion to usage of tags in content.
We saw how we can use metadata to help our search engine positions and to organize content. One more thing we will need often is to link one page to another. How do we do that?
Linking one page to another is very important. Linking increases hits, and makes it easier to find relevant content on your site. Every CMS will allow adding links to the content. You typically do this by selecting a piece of text and clicking an anchor-like tag in a WYSIWYG editor. Look around and find out how you can do this with your favorite CMS.
Does the CMS allow linking internal content without using full URLs? Is it easy to manage related content? How easy will this be for content authors?
On our Yoga site, we will have multiple authors. Each will write some content. An editor will review this content, edit it as needed, and publish it to the site. We also want to make sure we have old versions of content. In case something wrong gets published, we can quickly revert to an earlier version. And of course, authors won't have access to site administration features.
Answer the following questions for your site to determine your needs to support multiple users:
- Do you want to allow multiple authors to contribute content to your site?
- Do you want to allow anyone to edit the site content? Wiki-based software will be best in such a case.
- Do you want to assign different access rights to different users?
- Do you want to keep different versions of content and compare between revisions?
- Do you want to be able to revert/rollback to a previous version without actually editing the content?
- Would you like your site users to add comments? Can any user add comments? Do you want users to register before adding comments?
- If users can contribute content/comments, what will the approval process be?
Now check the CMSs you shortlisted to support these features. This can get critical because not all CMSs will support these features. A wiki supports ad hoc editing of the content, and is ideal for many-to-many communications. A blog is perfect for one-to-many communication, and to allow reader comments. Strike a balance between the CMS's features and your needs.
Note
Understand tech skills of authors
If you are going to manage content yourself, you have to worry less about the technical skills of others. You can choose a CMS that you find comfortable. But if you have other people writing and editing content, make sure they don't get daunted by the complexity of the software. An author's job is to create and manage content, and not fiddle with nuances of a CMS. So, understand the technical skills of your authors and select a system they can use.