Home > Joomla!™ 1.5 > Multiple Layout Template

Joomla!™ 1.5 Single Template with Multiple Layouts

Attention: open in a new window. PrintE-mail

Have you ever wondered how you can have a single template but different layouts for different sections of your Joomla!™ site? There may be different ways to achieve this depending upon what sort of changes you want in the layout. You can either change the template or you may be able to make a template override for a particular component or module.

This article is going to explain how to change the template file to make the required changes.

Let's assume that your template is called template_name. You will find your template's control file at: /templates/template_name/index.php. This is the file that you will need to edit to change the layout.

After the line:

defined( '_JEXEC' ) or die( 'Restricted access' );

Add these lines of php code:

$pageoption = JRequest::getVar('option', '');
$pageview = JRequest::getVar('view', '');
$pageitemid = JRequest::getVar('Itemid', '');
$pageid = JRequest::getVar('id', '');

What this code does is get the different parts of the URL of the current page the user is on. We will then use this information to determine if we need to do something special on this page.

Let's assume that on the home/front page we do not want to have the breadcrumbs displayed. In the code in index.php where the breadcrumbs module is loaded, we would change the code from something like this:

<div id="breadcrumb">
<jdoc:include type="modules" name="breadcrumb" style="xhtml" />
</div>

to:

<?php if ($pageview != 'frontpage') : ?>
<div id="breadcrumb">
<jdoc:include type="modules" name="breadcrumb" style="xhtml" />
</div>
<?php endif; ?>

Now the breadcrumb module will only be loaded if we are not on the home page.

Lets say that you have a 3 column layout for your template. Have you had the problem where there is one or two components that are just not displaying nicely when they are in a 3 column layout, so you would like them to be on a 2 column layout. You could go change all of your modules in the 3rd column position, so they display on all menu items except the one or two component pages. But every time you add a new menu item, you have to remember to go back and change the module to display on these new pages. What you would like is to be able to set the 3rd column modules to display on all page, but not load the 3rd column modules on the one or two component pages.

Here is how you solve this problem. Once again added the lines of code after the _JEXEC line shown above in your index.php. Find the code that loads the 3rd column, we will assume that the 3rd column is in module position right. Our current code will look something like this:

<div id="right">
<jdoc:include type="modules" name="right" style="xhtml" />
</div>

The components that are giving us the layout problem are for example our Calendar Component (com_calendar) and our Example Component (com_example). Here is how we would change the above code, so the right modules are only loaded on pages which are not com_calendar or com_example:

<?php if (($pageoption != 'com_calendar') && ($pageoption != 'com_example')) : ?>
<div id="right">
<jdoc:include type="modules" name="right" style="xhtml" />
</div>
<?php endif; ?>

We can now set out right modules to Display on all pages, but they will not be loaded on the Calendar and Example component pages.

Using the variables above we can get more sophisticated in our changes. Maybe we want to change how the Resources section gets displayed in our template. We find the ID of the Resource section and can then check if the $pageview is section and the $pageid is the ID we found for the Resource section. We may not need to change the layout of the index.php, but just need to change the CSS to change how the section is displayed. We can change the background color of the Resource section (ID = 12) to red, for example, using this code:

<style type="text/css">
/*<![CDATA[*/
<?php if ($pageview == 'section') && ($pageid == '12') {
echo '#content{background-color: red;}'
}
?>
/*]]>*/
</style>

Comments

avatar Lori
0
 
 
This article looked like exactly what I was looking for, but I think you have left something out. In every example you have endif statements but no if statements.
Comments
Name *
Email (For verification & Replies)
Code   
Submit Comment
Cancel
ChronoComments by Joomla Professional Solutions
avatar Laurelle
0
 
 
Thanks for noticing that Lori, the editor eat the if statements. I have added them back in again.
Comments
Name *
Email (For verification & Replies)
Code   
Submit Comment
Cancel
ChronoComments by Joomla Professional Solutions
avatar Susan
0
 
 
I like Joomla. It has so many templates. The choice is great. Besides, it is cool that there is a lot of information about it. I even found some books about it at the pdf search engine http://pdf.rapid4me.com . They helped me a lot.
Comments
Name *
Email (For verification & Replies)
Code   
Submit Comment
Cancel
ChronoComments by Joomla Professional Solutions

Please enter your comment below

Comments
Name *
Email (For verification & Replies)
Code   
Submit Comment
ChronoComments by
Joomla Professional Solutions

Reliable Joomla template providers:

joomlart.com - Professional templates Rocket Theme Joomla templates

Below are the web hosting providers that we recommend to our clients. All have an excellent reputation, fast servers and most importantly awesome service!

Rochen Joomla Shared or Managed VPS Web Hosting HostGator Shared and Fully Managed VPS and Dedicated Web Hosting
WiredTree Fully Managed VPS and Dedicated Web HostingLiquid Web Shared and Fully Managed VPS and Dedicated Web Hosting

Joomla! News

  • Thank You

    Today is Joomla!'s 5th birthday.

    On September 1st, 2005 the joomla.org sites were launched. Until that day, the Joomla! name was completely unknown to the world. This is a screenshot of...

  • Joomla and Linux Event in Vellore India

    Congraulations to the Tamil Joomla Community which sucessfully held a Joomla and Linux event for more than 350 students.

    The conference was at Ooris College in Vellore, Tamil Nadu, India on...

  • McDonald's Uses Joomla

    McDonald's is one of the world's largest fast food companies, serving nearly 47 million customers daily.

    Their website for the Arabian Peninsula uses Joomla: www.McDonaldsArabia.com. The homepage is just a...

CMS?

A content management system (CMS) is computer software used to create, edit, manage, and publish content in a consistently organized fashion. A Web content management system is designed to simplify the publication of Web content to Web sites, in particular allowing content creators to submit content without requiring technical knowledge of HTML or the uploading of files. 1

Read more

Recommended CMS?

We specialize in Joomla!™, Drupal, and Wordpress. All of these CMSs are popular open source software and have their own strengths for different situations and website needs.

Read more

Testimonials

Laurelle is the most efficient and precise web consultant we have ever worked with. Her rates are fair, her billing practices are fair and she is very reliable. Work completed for our firm has always been of a high caliber and she has also been instrumental in identifying deficiencies in our site that we didn’t know we had. I would not hesitate to recommend her to anyone.

Salim

Read more

Website Poll?

Would you like a poll on your website? With Joomla! polls are easy!




Results

WebDeveloper News

  • Episode 19: Beyond Usability with Aarron Walter
    Designer Aarron Walter guests on tomorrow’s episode of The Big Web Show, co-hosted by Dan Benjamin and taped before a live internet audience. Aarron is the author of one of...
  • ALA 313: CS, CMS, H&J, OK!
    In Issue No. 313 of A List Apart for people who make websites: Better content management systems start with content strategy; typographically beauteous web pages may benefit from hyphenation and...
  • My other iPad is a Kindle
    The new Kindle has a lot going for it. It’s inexpensive compared to a full-featured tablet computer like the iPad; you can slip it in your back pocket, where it’s...
Joomla! Drupal phpBB Wordpress Gallery2 Drupal  - Open Source CMS phpBB - Open Source Bulletin Board/Forum Joomla! - Open Source CMS WordPress - Open Source Blogging CMS
PHP - MySQL - Apache - W3 Valid PHP MySQL Apache CSS Valid XHTML Valid