Joomla Jumpstart

  • Increase font size
  • Default font size
  • Decrease font size
Home 3. Joomla! Presentation
Joomla! Presentation

Joomla! Overview, Part III - Presentation

E-mail Print PDF
User Rating: / 33
PoorBest 

Joomla logoJoomla menus define how the user will access the content of a site. Presentation, however, is defined by the interaction of three elements used by the system: templates, modules, and components. Joomla is incredibly flexible because each of these elements can be modified or replaced.


The three presentation elements can be summarized as:

  • Template -- Used to determine the actual look of the site including color scheme, font choices, graphics, and display organization.
  • Modules -- Act as display widgets that essentially "plug into" the display template. There are often many modules on each page. Examples of common widgets include the search box, Who's Online display, polling panel, and the syndication newsfeed. In fact, the display of a Joomla menu is actually performed by a menu module.
  • Component -- Supplies the main content of the page. Only a single component is displayed on each page. On the home page of a site, the articles are displayed by the Content component. Other components can perform completely different functions. A component may offer forum / message board capabilities or display all of the articles available on a RSS newsfeed.


The interaction of these three elements can be more easily understood by looking at a Joomla site. In the figure below, I've placed green boxes around the three modules and a blue box around the component. The top module is a menu module that holds navigational links to Main, New, Help, Forum, and other parts of the web site. The module just below it provides a summary of Joomla and links to the demo, download, and details articles. The menu module on the left displays the entries of the Main Menu (the structure of which you were introduced to in Part II).



Screenshot showing 3 modules and a component

 

In the main column of the page, you can see the Content component displays the current story (and other stories below it that are currently off screen). Generally, as a user navigates around the site, most of the modules will remain the same. The component, in contrast, will vary depending on the content to be displayed -- everything from article content (displayed by the Content component) to an online product catalog (i.e. VirtueMart component) to forums (i.e. Fireboard component). Sitting behind the modules and component, the template formats all of the output layout of the page (including the locations of the modules and component that appear on the page) as well as the graphics, fonts, styles, and colors that give the site a consistent look-and-feel.

 

Another Page, Same Template


If you were to click on the Help menu item on the example site, the page would change to the one shown below. Note that the banner at the top remains (the banner is stored in the template) and the top navigation menu is the same. The left side of the screen shows two menu modules that match the one on the initial screen, although they now display different menu items. Two additional modules have been made visible on this page: the search module and the breadcrumbs module below it. These modules could have easily been configured to appear on the main screen if they had been wanted there.


Screenshot of different component

 

You might have noticed that the blue rectangle highlights a different component than the one used on the initial page. Instead of the article blog layout (supplied by the Content component), this component displays links to various articles. A component is like a miniature application that integrates into the Joomla system and can provide nearly any feature that might be implemented in a standalone web application.

 

Complete Flexibility

 

By adding components, changing the template, or including different modules on your page display, a Joomla site can adopt nearly any appearance and provide any functionality that is available from a module or component.

I hope this three-part tour was useful to introduce you to the Joomla system. Joomla! is designed to allow great flexibility and give a web master -- with or withouth programming skills -- incredible power to implement a sophisticated web site.

 

 



If you're new to Joomla! and would like a thorough introduction to everything from content planning to template construction, please take a look at my new book Beginning Joomla! from APress. Click on the cover below for a complete description of the book. It is available now through Amazon.com and most book stores.

 

 

Beginning Joomla! Beginning Joomla! by Dan Rahmel

 

 
CharlieToSmooth I constantly remind myself, "Nobody is built like you, you design yourself"
by CharlieToSmooth. Link: Twitter for iPhone
WebStartupGroup It Is Not Flat Design. It's Just Proper Design http://t.co/CzStlUoKAB #news
by WebStartupGroup. Link: IFTTT
nzdanceco Tickets still available for Language of Living 7.30pm @ Aotea Centre - don't miss this amazing experience of dance, music, film & design.
by nzdanceco. Link: Sprout Social
doorhangerstx Let us design and print your next, postcards, brochures, business cards, door hangers and more: http://t.co/ynEgnvIdsa
by doorhangerstx. Link: SocialOomph


Coffee and Cream Publishing