Saturday, 14 April 2007

Understanding Joomla Template Positions

Article Audience: Webmasters / Joomla Newbies

This article is for Joomla 1.0. The Joomla 1.5 version of the article can be found here: http://www.dart-creations.com/joomla/joomla-tutorials/joomla-1.5-template-positions.html

New users of Joomla tend to find template module positions confusing and possibly frustrating. This is because by default you get a large number of module positions however, when modules are assigned to these positions the modules are not shown. This article will attempt to clear the air about template module positions.

Module Positions

In the Joomla (1.0.x) administration site if you go to Site > Template Manager > Module Positions you will find a large list of module positions. These positions are then automatically read and then will be available when assiging a position to a module in Modules > Site Modules.

However, just by having a large number of entries on your Module Positions page, does not automatically mean that you have these positions available in you pages. This is because it is your template which determines the positions available. To be able to use a position you must have something similar to the following in your template's source code

<?php mosLoadModules ( 'center', -1 ); ?> (where center is the position)

This means that any modules which are assigned to the center position will be rendered instead of that code in the template. Thus to know which modules are available for your use, you either need to read the documentation of your template, or else open the files of the template and check which positions are available with the template.

The best thing to do is remove any positions not available from the Module Positions entries not to mix yourself up when assigning positions to your modules. If you require additional template positions, you would need to change your template to cater for the additional positions you need. Obviously, this requires knowledge of PHP and HTML in order not to break your template.

Also note that you can usually add more than one module to the same position i.e. you can add more than one modules to your left and right positions, with the order in which they are displayed being determined by the Order parameter in the Module setup.

Also note that in some poorly written templates the module positions do not agree exactly with the name given to the position (e.g. user position shows up at the bottom). It is up to the author of the template and the Joomla webmaster to understand where the module will be rendered by testing different module positions, and if necessary changing the name in the template code. Please be sure that you always take backups and know exactly what you are doing before changing any template files.

Adding Module Positions

In this section I will show briefly how to create an new module position in the standard template.

Determine where you are going to place the position in your template. You need to understand exactly how the tempalate works. For example we will be adding an adlinks position to my template (to insert Google AdSense adlinks code). We find the position where we want to add the adlinks and insert php / html code similar to the following:

<!-- BEGIN: adlinks -->
  <div id="adlinks">

   <div class="adlinks-class">
    <?php mosLoadModules ( 'adlinks', -1 ); ?>
   </div>
   

  </div>
  <!-- END: adlinks --> 

We then need to create the Module Position in Site > Template Manager > Module Positions by creating a new adlinks entry

Create a new position in the Module Positions

Once this is done, we can now assign a module to this position in the Modules > Site Modules page.

Assign the new position to a module

The end result is a new available module position in your template.

The Easy Way Out

To create professional layouts quickly and easily, we highly recommend iJoomla Magazine. Whether you need to create an online magazine or just want to make Joomla a lot more powerful and useful, iJoomla Magazine is the ultimate solution. Go and take a look at it, we're sure you won't be sorry!

 

Comments
Search RSS
jansie  - thanks for this   |41.206.160.xxx |2007-07-09 08:37:44
this seems to be the best description of joomla module positioning yet.
Deepak Bhakoo  - Wonderfulllllllll :)   |203.145.128.xxx |2007-07-14 08:25:57
Yes i agree with Jansie. This is simply cool. And i understood so easily. I have
learnt how to work with readymade things with Joomla but this has taught me
really well that how i can extend my knowledge with it. Currently working on my
site todaysfunda.com and this tutotial really has helped me figure out things
with it. Thanks again
bilal  - bad example   |198.54.202.xxx |2007-07-26 12:21:55
pay attention to your site!, i cant read the article because the modules on the
right are overlapping onto the content..... please advise/ sort out

Thanx
DART Creations  - Problem Fixed   |217.145.5.xxx |2007-07-26 13:34:10
We have a wide layout resolution, so we tend to forget that other people have
lower resolutions. Please excuse the oversight.
luo  - GOOD   |91.127.117.xxx |2007-08-17 08:50:03
I think,that this is really good instructions to add some new module to the
joomla CMS.
Thank you..
Kristie  - Thanks   |75.71.158.xxx |2007-08-25 15:45:25
This is a great explanation. I've been wondering about this, and I'm off to go
try it!
Dan  - I'm still missing some fundam   |72.230.84.xxx |2007-09-14 09:11:19
I guess I just don't understand what part of that code "positions" the
module. For example. What if you want to create a bottom module, or move a
module? That's what I'm looking for and I can't seem to understand it.
DART Creations  - Mdoule positions - response to   |217.145.5.xxx |2007-09-14 10:52:09
Dan,

when creating / modifying a template position, you need to change the
index.php of the template (template//inde.php. This php file is
the file which is used to create the "look" of the page, i.e. where a
position will be loaded. This is determined by normal HTML / CSS positioning
rules. E.g. if you want to create a bottom module, you need to change the HTML
of the index.php such that you create a new placeholder (using divs or
otherwise) in the page. This would then be replaced by the 'positionxx', -1 ); ?> such that the modules assigned to positionxx are loaded
in place of the modLoadModules statement.
nirav  - Gr8   |61.17.14.xxx |2007-09-20 12:21:24
The best article i found in this context !!!!!!!
sing1ejack  - dimensions   |71.168.86.xxx |2007-09-28 13:48:41
So what defines the dimensions of the space that a module occupies? The module
itself? Or is it specified a template file?
DART Creations  - dimensions   |85.232.195.xxx |2007-09-28 17:13:11
sing1ejack,

the space occupied by the modules should be defined the CSS styles
which the modules is using. This means that, the template will not be
"hard-coding" the size and ensure that either the module, or the CSS
styles of the template determine the size that is occupied.
mike  - for 1.5?   |72.48.234.xxx |2007-10-02 18:50:19
Hello,
I'm curious, has this format changed in any way for 1.5?

I notice the
presence of alot of these types of entries now:



where jdoc seems
to have replaced the mosloadmodules and the position seems to be defined by
'name="right"'

Is this accurate?

Thank you for this overview... I,
too, was confused as to the usage of positions.
mike  - for 1.5 - continued   |72.48.234.xxx |2007-10-02 19:48:02
Oops.. looks like the code was parsed out in my last comment... here's the code
without the brackets...

jdoc:include type="modules"
name="right" style="xhtml"

Hopefully this will work.
DART Creations  - For 1.5   |217.169.51.xxx |2007-10-03 06:39:56
Mike, The article above is for 1.0.x, hopefully I will update for 1.5 in the
near future.
Bryce  - Removing position?   |72.16.213.xxx |2007-11-08 15:54:01
What if you would like to remove a position altogether, without shifting the
other positions. For example on the site I'm working on (www.sounddrywall.com)
there is a "Top" position to the right of my logo that is just an empty
box. How would I remove/resize that so that the logo spans the whole top instead
of just the left side? When I try to delete or resize, it ends up pulling my
Main Menu section up to the "Top" position.
Bryce  - Removing position   |72.16.213.xxx |2007-11-08 16:03:35
Edit: looks like my post was deleted, maybe because of URL? I've removed, if
so...

What if you would like to remove a position altogether, without shifting
the other positions. For example on the site I'm working on there is a
"Top" position to the right of my logo that is just an empty box. How
would I remove/resize that so that the logo spans the whole top instead of just
the left side? When I try to delete or resize, it ends up pulling my Main Menu
section up to the "Top" position.
DART Creations  - Removing position from rhuk so   |85.232.195.xxx |2008-01-08 22:14:43
Hi Bryce,

I just researched your problem and wrote a quick article about it:
http://www.dart-creations.com/joomla/tutorials/
r
emoving-the-top-position-from-the-rhuk-solarflare- ii-template.html

Please
note that your post wasn't deleted. However posts are cached, so sometimes the
comments don't show up immediately.

Hope that helps.
Adem  - Thanks   |80.42.200.xxx |2007-12-09 20:48:11
This worked brilliantly with my template. Cheers
dosdawg  - Create the Module Position   |75.176.191.xxx |2008-01-01 05:33:51
ok, good explaination, no doubt, however, when you get to the part of:
"We
then need to create the Module Position in Site > Template Manager > Module
Positions by creating a new adlinks entry"

and you place your modules name
in what would appear to me to be a position of where a module once resided,
since there is an assignment between position 26 and 30, thus giving your module
the position of 28. so you dont necessarily need to find a position that is not
assigned? this is where i lost it at.

i am looking in Site --> Template
Manager --> Module Positions on the current theme i am running. I see what
appears to be 34 module positions listed. none have a description but there are
34 module names listed. so does this logistically infer that i can have 34
different modules, plus xx number of additional modules if set by the module
order in the parameters? cuz i have searched around, and have seen what is a
freshly...
DART Creations  - Module Positions - clarificati   |85.232.195.xxx |2008-01-01 09:40:17
dosdawg,

The module positions is a place to create "logical" positions.
This means that they are module placeholders which CAN exists. What actually
determines whether they are used or not, is the template you are currently
using.

This means, that I can create my adlinks position logically, however, if
my template's HTML does not cater for it, nothing will appear in this position
(because there is nothing which converts the logical position to the physical
positon in the template). This is why the article follows by creating the
position in the template's html.

Typically, Joomla comes with about 30 logical
positions created, however rhuk_solar_flare_ii, has much less positions than
this. So if you assign a module to a position which does not exist, you won't
see it rendered.

Therefore, what determines the number of positions you may
have, is your template. The Module Positions create a logical placeholder, the
t...
atslash  - Still no way to do it in 1.5   |69.146.203.xxx |2008-01-07 22:52:15
Still doesnt seem to be a way to create a new module position in joomla 1.5 rc4
or am i missing something?
Bolkin  - Module Position size and align   |24.192.185.xxx |2008-01-30 17:18:08
I followed your guide and I made a bottom module position for my site's template
but the module is not aligned with the template, it is going out of the
template's design.

How do I change the position size and alignment so it
doesn't mess up the template design? Do I have add another code to the
template's CSS file to do this? If so, could you please guide me through it.
Thanks.
DART Creations  - Bolkin   |85.232.198.xxx |2008-01-30 21:29:57
Bolkin,

in this article I guide you through the concept of what is needed to
create a new position. The tutorial however assumes knowledge of CSS and HTML
concepts, because ultimately your module will create HTML and if this is not
planned, it will break your template. Unfortunately, teaching CSS and HTML is
out of the scope of the tutorials provided here, however there are thousands of
pages out there which can help you with this.
bob  - thank you   |79.185.147.xxx |2008-02-08 23:18:39
Until recently I've been using wordpress and I considered myself pretty good at
it.

But joomla is completely different and the documentation is so horrible. It
leaves out the basics while elaborating on unimportant things...

This short
article helped me a lot.
David K  - -1 ?   |66.188.196.xxx |2008-04-04 01:06:09
This was an excellent tutorial. Completely explained what I haven't understood
for months.
BUT what does the "-1" mean? In my template that I am using
- there are -2's and -3's...
Thanks.
- DK
Tiger  - the -1s and 2-s   |80.176.134.xxx |2008-04-14 11:53:48
The -2 and -1 in the template tells joomla what format to display a given
module

i.e 0 i believe means the table will be displayed in tables

-2 means it
will be displayed using divs
Ariel  - Thank you - it helps me a lot   |122.3.172.xxx |2008-04-30 05:21:10
I just successfully added a user defined module using the code above and play
around a little bit and there ya goes!

Thanks a lot
Ariel  - By the way..   |122.3.172.xxx |2008-04-30 05:22:24
By the way, I use a few rocket theme templates and it works
Juice  - collapsible module positions2   |24.215.166.xxx |2008-05-13 20:37:45
Seems my code was deleted in my last post. So... if you know of the PHP code to
insert to make a module position [div] collapse/dissappear on a page where it is
not in use... and where to put this code in the index.php that would be most
helpful.
DART Creations  - Collapsible module positions   |217.145.5.xxx |2008-05-14 05:36:06
The best is to check whether there are modules assigned to the position, and
using PHP only render that position if there are positions assigned to it:

if
(mosCountModules('right') (Not sure about the 1.5 equivalent)

Make sure you
are using the correct php syntax.
ellyz   |82.224.125.xxx |2008-06-10 17:07:49
thanks!
Anonymous   |117.3.49.xxx |2008-08-11 10:57:35
this is very useful. thanks a lot
Sathya   |196.15.16.xxx |2008-08-18 07:50:32
This is wonderful explanation.. it was really useful.. all i had to do it just
follow it and it works beautifully well :-D

Thanks
PorteBEE  - THANKS   |203.87.187.xxx |2008-09-11 13:58:02
yah your right
newfor joomla  - how to delete module position   |82.114.160.xxx |2008-09-28 07:30:29
Hi , really very good explanations , but i think in joomla 1.0 adding positions
easer than ver 1.5 .

but where exactly should i add the code in which files



and how to delete positions if we have not useful ones??


Thanks
klack21   |98.64.54.xxx |2009-01-07 08:37:38
Excellent tutorial, thank you so much. but I still am having a problem that now
i've added a adlinks module position but it has broken my template and i'm lost
to fix it. I'm using joomla 1.5, and if anyone has any ideas please share.
DART  - Joomla 1.5   |Administrator |2009-01-07 09:31:30
Did you check out the tutorial for Joomla 1.5? It is linked at the top of this
article.
Dawn     |71.207.22.xxx |2009-01-27 02:46:37
Thanks for this site. I am new at Joomla, having done only about 10 sites. I
am having trouble with a site I created. I did not install the sample data but I
wanted a top menu so I tried to create my own top menu module. I got it to work
but the position of the menu is not the same in IE as it is in Firefox. I am
not sure if this is a template problem or a browser problem. Using User4, the
menu is in the upper right hand corner of Firefox and does not show in IE.
Using "Top", the menu is in the upper left hand corner in IE and the
middle of the header in Firefox. I am not sure what information I need to
provide the forum and I don't want to start posting a bunch of code. Also, my
site is currently down b/c that is what the client wants so I can't really show
you. I am not sure if maybe I should just reinstall Joomla using the sample data
but then I would lose all the changes I've made and data I have entered and ...
DART  - Dawn   |Administrator |2009-01-27 07:13:25
The problem you are describing probably has nothing to do with the sample data.
Its typically an HTML / CSS problem. You'll have to analyse for problems in the
template your are using. I suggest you get a good template from the Joomla
Templates linked on the side in this page.
Dawn   |71.207.22.xxx |2009-01-27 11:03:32
Dart - thanks for the quick reply. I think you are right. I don't actually
have any code in the css for "top" or "user4" so I am not sure
what that means - I don't know if you need to have css for each module or if the
Joomla program will put the modules in a specific place unless your css tells it
otherwise? I am so glad that Lynda.com just came out with some advanced Joomla
tutorials b/c clearly I need to watch them!
Dawn   |71.207.22.xxx |2009-01-28 05:39:37
I just wanted to update you and let you know I switched out my template to a
template made by siteground and my top menu works exactly as it should.

Thanks
again for the info on this site - it always amazes me how many people are wiling
to share their knowledge about the web.
Schnell Abnehmen     |212.190.217.xxx |2009-03-30 13:21:07
In my opinion, Joomla 1.x templates were a bit of a mess. Joomla 1.5 came to
solve that. Good article. Thank you
alex   |134.214.215.xxx |2009-06-02 00:42:54
I have tried to add a new position on a joomla site. I have done all the steps
needed for that but the problem when i choose the module position to my new
position it doesn't appear after that.
Notice i have the search position on the
same level height does it interfer together ? thanks for help ?
Only registered users can write comments!

3.26 Copyright (C) 2008 Compojoom.com / Copyright (C) 2007 Alain Georgette / Copyright (C) 2006 Frantisek Hliva. All rights reserved."

Last Updated ( Wednesday, 23 September 2009 )