InMotion Hosting Support Center

highlighting-future-module-positionsAs we continue to create a Joomla 3.0 template, we will begin adding module positions to the index.php file in our simple template. If you noticed in our starting template, we adding place holder text, such as Main Content Area and Right SideBar, as this is where we want the respective content to go.

Joomla Templates also have place holders, and they are referred to as module positions. For example, the right sidebar in most Joomla templates is referred to as position-7. You can actually see where module positions are located within a Joomla template, click here to read our tutorial on how to do this.


Using jdoc to add module positions

So in this tutorial, we are going to replace our place holder text with the code Joomla requires to create a module position.

The following is the code we are going to add to our template:

// This code will create the module positions for our main content area
<jdoc:include type="modules" name="position-3" style="xhtml" />
<jdoc:include type="message" />
<jdoc:include type="component" />
<jdoc:include type="modules" name="position-2" style="none" />

// This code will create the module position for our right sidebar
<jdoc:include type="modules" name="position-7" style="well" />

Our updated index.php file

When we add this code to our index.php file (highlighted in red), it looks like this:

<!DOCTYPE html>


    <link rel="stylesheet" href="/support/css/style.css" type="text/css" />
    <script src="/support/js/main.js" type="text/javascript"></script>



    <!-- main container -->
    <div class='main_container'>

        <!-- header -->
        <div class='header'>Header</div>
        <!-- mid container - includes main content area and right sidebar -->
        <div class='mid_container'>
            <!-- main content area -->
            <div class='main_content_area'>
                <jdoc:include type="modules" name="position-3" style="xhtml" />
                <jdoc:include type="message" />
                <jdoc:include type="component" />
                <jdoc:include type="modules" name="position-2" style="none" />
            <!-- right sidebar -->
            <div class='right_sidebar'>
                <jdoc:include type="modules" name="position-7" style="well" />
            <div style='clear:both;'></div>
        <!-- footer -->
        <div class='footer'>


Was this article helpful?
You are viewing Section 2: How to add module positions to a Joomla 3.1 template
Section 1: A very basic template soon to be a Joomla 3.1 template
Section 3: Adding a templateDetails.xml file to a Joomla 3.1 Template

Joomla Community Google+ Hangout #3

June 3rd, 2014

Thank you @RustyJoomla for letting me speak on the Joomla Community Google+ Hangout!

Click here to watch!

Related Questions

Here are a few questions related to this article that our customers have asked:
Ooops! It looks like there are no questions about this page.
Would you like to ask a question about this page? If so, click the button below!
Ask a Question

Forum Login

You are NOT logged in. You can still browse our Support Center.

To participate within our Community Support Forum:

n/a Points
2015-12-08 3:05 pm

thanks Brad for the tutorial, its realy clear, just a litle cuestion, what is the difference between   style="xhtml" and style="rounded" and style="none" ? Thanks again

10,077 Points
2015-12-08 3:29 pm
Hello Flavio,

Here is a Joomla document regarding the different types of styles you can choose from with images of how they are different.

Best Regards,
TJ Edens
n/a Points
2015-01-13 11:16 pm

Hey guys. I would like to add a module position in the right side of my logo for language flags. In the same time there is a position for the menu over there. What i can do?


It will be like this: Logo  flags menu    ... in the same height

10,077 Points
2015-01-15 11:41 am
Hello Kieron,

Unfortunately at the same height that would not be possible without editing the theme files yourself, of which we do not recommend. However if you wanted on top of each other then the position is most likely "position-7".

Best Regards,
TJ Edens
43,761 Points
2014-03-31 1:12 pm
Hello moeen,

You may want to check out the Joomla Documentation on Declaring Module Positions in order to assist you with your current theme issue.

Kindest Regards,
Scott M
n/a Points
2014-03-31 1:06 pm

hello.i add a position to beez 5 template.the position generaly go to the left.but i want to put it in the right side of template.what can i do?

n/a Points
2014-05-14 12:51 am

Hello moeen,

I think you can give the float:right in the css. The position of those module is right side.

Thanks & Regards

Abhishek Tiwari


Post a Comment

Email Address:
Phone Number:

Please note: Your name and comment will be displayed, but we will not show your email address.

7 Questions & Comments

Post a comment

Back to first comment | top

Need more Help?


Ask the Community!

Get help with your questions from our community of like-minded hosting users and InMotion Hosting Staff.

Current Customers

Chat: Click to Chat Now E-mail:
Call: 888-321-HOST (4678) Ticket: Submit a Support Ticket

Not a Customer?

Get web hosting from a company that is here to help. Sign up today!