asked on

How to display a Joomla Article

Hi Experts,

I have a custom joomla tempate with my module positions working well (i.e. menu). I have created an article but can't figure out how to display the article in my template.

The template has a "mainContent" module position and that is where I want to display the article on the page But I can't figure out how to associate the article with a position on the custom template page. Is there a component or module I need to have in that position to display the article or what? Can someone explain this to me?

Thanks!

HNM

Julian Hansen

this should help

http://www.siteground.com/tutorials/joomla15/joomla_create_website.htm#articles

HelpNearMe

ASKER

Thanks julianH but that doesn't help at all. Creating an article is easy, but I can't figure how to display the article in a page that is built on a custom template.

SOLUTION

Julian Hansen

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Joomstrup

Hi, can you post the content of your index.php file?

How are you trying to show your article.

If your index.php is right then it comes down to your menu assignments. Your article will not show unless you have a menu item that points to it.

What is your menu item type for your "home" menu?

HelpNearMe

ASKER

Here are the index.php file contents. Thanks!

<?php
// no direct access
defined( '_JEXEC' ) or die( 'Restricted access' );
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="<?php echo $this->language; ?>" xml:lang="<?php echo $this->language; ?>" xmlns="http://www.w3.org/1999/xhtml">

<head>
<jdoc:include type="head" />
<link href="<?php echo $this->baseurl ?>/templates/system/css/system.css" rel="stylesheet" type="text/css" />
<link href="<?php echo $this->baseurl ?>/templates/system/css/general.css" rel="stylesheet" type="text/css" />
<link href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ;?>/css/default.css" rel="stylesheet" type="text/css"/>
</head>

<body>
	<div id="main" style="width: 700px">
		<div id="headerLeft"></div>
		<div id="logoTop"><jdoc:include type="modules" name="Logo" style="xhtml" /></div>
		<div id="headerCenter"><jdoc:include type="modules" name="HeaderText" style="xhtml" /></div>
		<div id="headerRight"></div>
		<div id="topNav">
			<div id="menu">
				<jdoc:include type="modules" name="TopMenu" style="xhtml" /> 
			</div>
		</div>
		
		<div id="middleContainer">
			<div id="leftNav">
				<a href="http://www.google.com" title="About Us" id="leftNavButtonOne" target="_parent">About Us</a>
				<a href="http://www.google.com" title="Standings" id="leftNavButtonTwo" target="_parent">Standings</a>
				<a href="http://www.google.com" title="Roster" id="leftNavButtonThree" target="_parent">Roster</a>
				<a href="http://www.google.com" title="Schedule" id="leftNavButtonFour" target="_parent">Schedule</a>
				<a href="http://www.google.com" title="Stats" id="leftNavButtonFive" target="_parent">Stats</a>
				<a href="http://www.google.com" title="Contact" id="leftNavButtonSix" target="_parent">Contact</a>
				<a href="http://www.google.com" title="Gallery" id="leftNavButtonSeven" target="_parent">Gallery</a>
				<a href="http://www.google.com" title="Links" id="leftNavButtonEight" target="_parent">Links</a>
				<a href="http://www.google.com" title="Home" id="leftNavButtonNine" target="_parent">Home</a>	
			</div>
			<div id="contentMain"><jdoc:include type="modules" name="MainContent" style="xhtml" /></div>
		</div>
		
		<div id="footer">
			<div id="footerleft"></div>
			<div id="footerCenter"><jdoc:include type="modules" name="FooterText" style="xhtml" /></div>
			<div id="footerRight"></div>
		</div>
	</div>
</body>

</html>

Open in new window

HelpNearMe

ASKER

The goal is to have the articles shown in the contentMain div and/or the MainContent module position.

ASKER CERTIFIED SOLUTION

Joomstrup

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Joomstrup

for a reference of jdoc statments see here:
http://docs.joomla.org/Jdoc_statements

Joomstrup

also you might want to add
<jdoc:include type="message" />

this is what will show systems messages like confirmation when users register and such

usual this is put right above the maincontent

so you code could look like this
<div id="contentMain">
<jdoc:include type="message" />
<jdoc:include type="component" />
</div>

Joomstrup

Also I noticed you have "hardcoded" navigation in your template

<div id="leftNav">
                        <a href="http://www.google.com" title="About Us" id="leftNavButtonOne" target="_parent">About Us</a>
                        <a href="http://www.google.com" title="Standings" id="leftNavButtonTwo" target="_parent">Standings</a>
                        <a href="http://www.google.com" title="Roster" id="leftNavButtonThree" target="_parent">Roster</a>
                        <a href="http://www.google.com" title="Schedule" id="leftNavButtonFour" target="_parent">Schedule</a>
                        <a href="http://www.google.com" title="Stats" id="leftNavButtonFive" target="_parent">Stats</a>
                        <a href="http://www.google.com" title="Contact" id="leftNavButtonSix" target="_parent">Contact</a>
                        <a href="http://www.google.com" title="Gallery" id="leftNavButtonSeven" target="_parent">Gallery</a>
                        <a href="http://www.google.com" title="Links" id="leftNavButtonEight" target="_parent">Links</a>
                        <a href="http://www.google.com" title="Home" id="leftNavButtonNine" target="_parent">Home</a>
                  </div>

This is not good practice, also this kinda defeats the benefit of using Joomla as you should use the Joomla menu manager and have that navigation build dynamically for you.

You should change the code to
<div id="leftNav">
<jdoc:include type="modules" name="LeftNav" style="xhtml" />
</div>

make a new menu in the menu manager and set up the menu items.
then make a new menu module, assing the new menu to this module and the publish the module in the LeftNav position.

HelpNearMe

ASKER

Joomstrup,

Thanks for all this effort, your comment about the component tag work perfectly. I'll try the message placeholder too.

Regarding my leftNav menu images, I did it that way to use a css sliding window effect for the hoover event instead Java. It works very well and I understand completely your point about using joomla to manage the images. I appreciate it but I'll stick with this method since I like the fact that it doesn't need java. Here is a peice of the css just as an fyi ->

#leftNavButtonOne {
      width:109px;
      height:45px;
      float:none;
      margin:0 auto 0 auto;
      border:none;
      background:no-repeat;
      background-image: url(../images/aboutUs.png);
      background-position:0px 0px;
      text-indent:-9999px;
      display:block;
}

#leftNavButtonOne:hover {
      width:109px;
      height:45px;
      float:none;
      margin:0 auto 0 auto;
      border:none;
      background:no-repeat;
      background-image: url(../images/aboutUs.png);
      background-position:-111px 0px;
      text-indent:-9999px;
      display:block;
}
This gives me a great hover effect simply by moving the image to the left and showing a modified image.

HNM

HelpNearMe

ASKER

Thanks for the help!