Organizing your Content Effectively using Joomla 1.5

Exclusive offer: get 50% off this eBook here
Joomla! 1.5: Beginner's Guide

Joomla! 1.5: Beginner's Guide — Save 50%

Build and maintain impressive user-friendly web sites the fast and easy way with Joomla! 1.5

$26.99    $13.50
by Eric Tiggeler | March 2010 | Joomla!

In this article series by Eric Tiggeler, author of Joomla! 1.5: Beginner's Guide, you'll:

  • Understand how to translate a basic site map to a workable blueprint for a Joomla!-based site
  • Design a clear, scalable framework for your content, grouping your content with sections and categories
  • Use uncategorized pages to build sites that don't require a multi-level content

Building on the example site

It's time to make room for growth. Your client has a big pile of information on ugly art that they want to present to the public. You are asked to design a site framework that makes it easy to add more content, while at the same time keeps it easy for visitors to quickly find their way through the site.

Can you do that? You most certainly can! Joomla! allows you to build sites of all sorts and sizes, whether they consist of just a few pages or thousands of them. If you plan ahead and start with a sound basic structure, you'll be rewarded with a site that's easy to maintain and extend. In this article, we'll review the site you've just built and look at the different ways the content can be structured—and rearranged, if need be.

Grouping content: A crash course in site organization

To lay the groundwork for your site, you won't use Joomla!. The back of a napkin will do fine. Draw up a site map to lay out the primary content chunks and their relationships. View your site from a user's perspective. What do you think your visitors will primarily look for, and how can you help them find things fast and easily?

Designing a site map

To create a site map, first collect all information you plan on having on your website and organize it into a simple and logical format.

As site maps come, this is a very basic one. For the most part, it's just one level deep. Introducing Ugly Paintings and Mission are basic web pages (articles). Activities is a section that allows the visitor to browse two other categories. Contact Us is a contact form page. This structure was good enough for a basic website, but it won't do if SRUP wants to expand their site.

Time for action – create a future proof site map

Let's make some room for growth. Imagine your client's planning to add an indefinite amount of new content, so there's a need for additional content containers. They have come up with the following list of subjects they want to add to their site:

  • News items
  • A few pages to introduce the founding members of SRUP
  • Reviews on ugly art
  • Facts on ugly paintings (history, little known facts, and so on)

What's the best way to organize things? Let's figure out which content fits which type of container.

Step 1: You'll probably want to create a separate News section. News should be a top level item, a part of the site's main menu.

 

 

Step 2: The information on the SRUP founders fits in a new section 'About SRUP'.

 

Step 3: Both Reviews and Facts can be categories in a new general section on 'Ugly Paintings'. The existing article 'Introducing Ugly Paintings' could be moved here (or dropped).

 

 

What just happened?

You've laid a solid foundation for your site—on paper. Before you actually start using Joomla! to create sections and categories, create a structure for the content that you have in mind. Basically, no matter how big or small your website is, you'll organize it just like the example you've just seen. You'll work from top to bottom, from the primary level to the lower levels, defining content groups and their relations. Bear in mind, though, that there will certainly be more than one way to organize your information. Choose an organization that makes sense to you and your visitors, and try to keep things lean and clean. A complex structure will make it harder to maintain the content, and eventually—when building menus—it will make it harder to design clear and simple navigation paths for your visitors.

Tips on choosing sections

  • It can be useful to choose sections based on the main intentions people have when they come to the site. What are they here for? Is it to Browse Products or to Join a Workshop?
  • Common choices for sections are: Products, Catalog, Company, Portfolio, About Us, Jobs, News, and Downloads.
  • Try not to have more than five to seven sections. Once you have more than that, readers won't be able to hold them all in their heads at once when they have to choose which one to browse.

Transferring your site map to Joomla!

Let's have a closer look at our new site map and identify the Joomla! elements. This—and any—Joomla! site is likely to consist of five types of content.

The following are the content types in our SRUP site map:

 

Obviously, the top level item will be the home page.

The main content groups we can identify as sections and categories. This small site has four sections, three of which contain two categories.

Each of the categories hold actual content: this is what will end up in Joomla! as articles.

In this site map, there is one article that doesn't really belong in any category: the Mission Statement page. Every site will have one or two of those independent articles. In Joomla!, you can add these as uncategorized articles.

Finally, there's one item that represents a very different type of content. In the site map above, a grey background indicates an item containing special functionality. In this case this is a contact form. Other examples are guest books, order forms, photo galleries.

Basically, that's all there is to a Joomla! site. When you've got your site outlined like this, you won't meet any surprises while building it. You can transform any amount of content and functionality into a website, step by step.

 

How do you turn a site map into a website?

If you've got your site blueprint laid out, you probably want to start building! Now, what should be the first step? What's the best, and fastest, way to get from that site map on the back of your napkin to a real-life Joomla! site? In this book, we'll work in this order:

  1. Organize: Create content containers.
    You've seen that much of the site map we just created consists of content containers: sections and categories. In this article, we'll focus on these containers. We'll create all necessary containers for our example site.
  2. Add content: Fill the containers with articles.
    Next, we'll add articles to the sections and categories. Articles are the "classic content" that most web pages are made of. We should also check for articles that do not belong in any category. Instead of assigning them to a section and a category, we'll add them as Uncategorized content..
  3. Put your contents on display: Create the home page and content overview pages.
    Next, you'll want to guide and invite visitors. You can achieve this using two special types of pages in the site map, the home page and Joomla!'s section/category overview pages ("secondary home pages").
  4. Make everything findable: Create menus.
    The top level items in your site map will probably end up as menu items on the site. To open up your site to the world you'll create and customize menus helping visitors to easily navigate your content.

And what about the special content stuff?

You'll notice that in the above list we've summed up all sorts of "classic content", such as articles, home pages, overview pages, and menus linking it all. We haven't yet mentioned one essential part of the site map, the special goodies. On a dynamic website you can have more than just plain old articles. You can add picture galleries, forms, product catalogues, site maps, and much, much more. It's important to identify those special pages from the beginning, but you'll add them later using Joomla!'s components and extensions. That's why we'll first concentrate on building a rock-solid foundation; later we'll add all of the desired extras.

Let's start with step one now, and get our site organized!

Creating content containers: Sections and categories

To create a section, navigate to Content | Section Manager | New.

To make a new category, you'll use the Category Manager instead. Just add a title for your new section or category and click on Save. You've created a perfectly workable section or category with the default settings (or parameters as Joomla! likes to call them).

Time for action – create a new section and a category

Your client was happy with the initial site structure you designed, but now their website is evolving, there's a need for more content containers. Let's add a news section first:

  1. Navigate to Content | Section Manager and click on New.
  2. In the Section: [New] screen, fill out the Title field. In this example, type News:

  3. Leave the other values unchanged; click on Save. You're taken to the Section Manager. The News section is now shown in the section list.

    Now, add a category to the new section. We'll call this category General News:

  4. Navigate to Content | Category Manager and click on New.
  5. In the Title field, type General News.
  6. In the Section field, select News.
  7. Click on Save. You're done!
Joomla! 1.5: Beginner's Guide Build and maintain impressive user-friendly web sites the fast and easy way with Joomla! 1.5
Published: March 2010
eBook Price: $26.99
Book Price: $44.99
See more
Select your format and quantity:

What just happened?

You have added a News section with one category: General News. Remember, a section needs at least one category. For now, this General News category will do. Should the client wish to have more specific news categories later, these can easily be added.

It's quite OK to have sections with single categories. In the backend they serve as a functional (and mandatory) container for content, in the frontend the user won't have to click his way through redundant links. On clicking the News link, he'll be shown all of the news content in one go. Basically this means it's possible to add content to a Joomla! section without having to create several categories when they're not really needed.

Have a go hero – add some articles

The News category you just added is still empty. Add some dummy content to it. In short, navigate to Content | Article Manager and click on New. Add a Title, and in the Section drop-down box select News. In the Category drop-down box, General News will be selected (it's the only option). Add some dummy content. Add a Read More link after the first paragraph to enable Joomla! to separately show the introductory text and the body text. Click on Save and you're done.

In this example, we've added three news articles to our new section:

 

 

Displaying sections and categories on your website

Sections and categories are content containers; they tell Joomla! how to group things in the backend. Now, how do you get the content in those containers to show up on your website? You add a menu link to do this. Let's add a new menu link now to present the contents of the section we just created to our visitors.

Time for action – create a link to point to a section

Creating a menu link to point to a section or category takes these four steps:

  1. Navigate to Menus | Main Menu and click on New.
  2. In the Select Menu Item Type section, select Articles | Section Blog Layout.
  3. In the Menu Item : [New] screen, add a Title (i.e., News). In the Parameters (Basic), select the News section in the Section drop-down list.
  4. Click on Save.As you can see in the following screenshot, News now shows up as the last item in the Menu Item Manager. The order in which Menu Items are presented here is the same order they'll have in the Main Menu on your website. If you would like to move the News link up in the Main Menu, just click on the arrows in the Order column as desired. In this example, we'll leave the order unchanged.

  5. Click on Preview to check out what's changed on the frontend

    On the home page, there's a new link added to the Main Menu: News

     

    On clicking this, the visitor will see an overview of the News section.

     

     

     

     

How are sections and categories displayed?

The format of the section overview page you just created on the frontend of your site is called a Section Blog Layout. There is, however, much more to section and categories content presentation than just the Section Blog Layout. You can choose to display section contents in different formats. Moreover, you can have your menu link point directly to a specific category (instead of its parent section). For now, presenting the contents of your section and the underlying categories through the Section Blog Layout format will do just fine.

Have a go hero – create some new sections and categories

Let's have a look at the SRUP site map again. To completely transfer the structure we designed on our napkin to the Joomla! backend we should add two more sections: Ugly Paintings and About SRUP. In the following design you can see which categories these sections should hold:

Add sections and categories

You can now add these sections/categories by repeating the steps you took previously:

  • To create sections, navigate to Content | Section Manager | New
  • To create categories, navigate to Content | Category Manager | New

Add links

Although the sections and categories are still empty (they hold no articles yet), it's a good idea to already add menu links to point to the new sections.

  • To add menu links, navigate to Menus | Main Menu and click on New. Add two section links: a link to the Ugly Paintings section (call this link Ugly Paintings) and a link to the About SRUP section (let's call it, well, yes, About SRUP).

Remove an unneeded article

There's just one little bit of unfinished business remaining. Once you've created a new section on Ugly Paintings you should remove all traces of its predecessor, the Uncategorized article called Introducing Ugly Paintings. There's no need for it anymore; we'll replace it with the new section content. Let's trash both the article and the old menu link pointing to it:

  • Navigate to the Article Manager, select the article and click on the Trash button in the toolbar.
  • To remove the redundant menu link Introducing Ugly Paintings from the Main Menu, just navigate to Menus | Main Menu, select the link and click on the Trash button in the tool bar.

And what about the articles?By adding some new sections and categories, you've made room for growth. We'll leave these containers empty for now.

Refining your site structure

It's a fact of life: you probably won't get your site structure right in one go unless you've got a really simple, really static site. It that a bad thing? No, it isn'tbecause websites evolve and Joomla! makes it easy to go ahead with a provisional structure and change things when needed. Maybe because new content has become available that has to go into a new section. Or maybe because when you're actually adding content, you learn that your well-organized site isn't altogether logical after all. That's fine; keeping a close eye on the structure of your website is a continuous process. And luckily, sections and categories, once defined, are not set in stone. You've seen how easy it is to add new ones, and it's equally simple to move content from one category to another.

>> Continue Reading: Organizing your Content Effectively using Joomla 1.5- A Sequel

About the Author :


Eric Tiggeler

Eric Tiggeler is the author of the Joomla! 3 Beginner's Guide and has written several Dutch guides on Joomla! and other content management systems, all of which got excellent reviews. Eric writes tutorials for several computer magazines and Joomla! community websites. Over the last ten years, Eric has developed numerous websites, big and small, many of them using Joomla!

Eric is fascinated by the Web as a powerful and creative means of communication, and by revolutionary software such as Joomla!, which enables anyone to create beautiful and user-friendly websites. His passion is making complex things easy to understand.

Books From Packt

Joomla! 1.5 Multimedia
Joomla! 1.5 Multimedia

WordPress 2.8 Themes Cookbook
WordPress 2.8 Themes Cookbook

Joomla! with Flash
Joomla! with Flash

Joomla! 1.5 Content Administration
Joomla! 1.5 Content Administration

Joomla! 1.5 SEO
Joomla! 1.5 SEO

Joomla! 1.5 Development Cookbook
Joomla! 1.5 Development Cookbook

Joomla! 1.5 Template Design
Joomla! 1.5 Template Design

MediaWiki 1.1 Beginner's Guide
MediaWiki 1.1 Beginner's Guide

No votes yet

Post new comment

CAPTCHA
This question is for testing whether you are a human visitor and to prevent automated spam submissions.
p
e
z
3
x
Q
Enter the code without spaces and pay attention to upper/lower case.
Code Download and Errata
Packt Anytime, Anywhere
Register Books
Print Upgrades
eBook Downloads
Video Support
Contact Us
Awards Voting Nominations Previous Winners
Judges Open Source CMS Hall Of Fame CMS Most Promising Open Source Project Open Source E-Commerce Applications Open Source JavaScript Library Open Source Graphics Software
Resources
Open Source CMS Hall Of Fame CMS Most Promising Open Source Project Open Source E-Commerce Applications Open Source JavaScript Library Open Source Graphics Software