Joomla Template Experience

Joomla Template Experience

Friday, September 4th, 2009 Blog, Programming, Website Design by admin

Recently I have taken on a large template project on the joomla framework.

I have had some contact with joomla in the past version 1.0x and before, but never with the new 1.5 version. The 1.5 system is amazingly advanced and is a very powerful system. I wouldn’t use it for a small blog site (I would use wordpress) but it is excellent for large scale projects where you need flexibility.

It was hard getting the test server running, the client tried giving me a joomla pack file to expand but it failed, I have read many good things about joomla pack so it could have very possibly been my fault. Nonetheless I ended up working of a test server “live” which i normally try to refrain from.

After the server was up and running and work was well on its way I had the following obstacles

• Joomla Page Specific Graphics
• Joomla Module Styling
• Joomla List Styling

Joomla Page Specific Graphics

For this i needed to add a graphic to the header to denote certain changes in the page. To do this I needed to detect pages with joomla. Luckly joomla made this an easy task.

Joomla Detect Page Type (”frontpage“, “section“, “category“, or “article“)

<?php
echo JRequest::getVar('view');
?>

Put this somewhere on your index.php page within your template directory and when you save and refresh you will see (”frontpage“, “section“, “category“, or “article“) where you pased the code on the page.

For my specific needs I wanted to show the graphic on all “Section” Pages. So I put the graphic in a div used the following code.

<?php
if ( JRequest::getVar('view') == 'section') {
?>
<div id="my-section-specific-graphic"></div>
<?php

} else {

//do nothing because we are not in a section area
?>

<?php } ?>

This was great except there was a problem. There were a hand full of section pages that I did NOT want the graphic to show up on. So I accomplished this in 2 steps.

1 – I need to detect the ID of the section I was on (it was not in URL since there was a mod_rewrite)

Joomla Code to detect page / section ID

<?php

$anid = JRequest::getVar('id');
echo $anid; ?>

Now that I have the page / section id (in my case it was 84) I will exclude it by using the following:

<?php
if ( JRequest::getVar('view') == 'section' & JRequest::getVar('id') !== '84') {
?>

<div id="my-section-specific-graphic"></div>
<?php
} else {
?>

<?php } ?>

Joomla Module Styling

Since the project was a redesign and I had to work with all the current configuration it was a bit tricky, or so i thought. Joomla has an excellent feature in the modules called “Module Class Suffix” this will allow append characters to the end of a module style.

Example:

Let’s say the module style was:

.moduleHeading{

width:200px;

border: 1px solid grey;

color:#000;

}

And we wanted to make a new style to remove the border and change the width to 175. All we would have to do is add the css below to the themes css:

.moduleHeadingNOB{

width:175px;

border: 0;

}

And then go into the joomla module editor, find the module we want, and click on “Module Class Suffix” and add “NOB” and that’s it. Now when you save and  refresh the page the new styling will be active.

This is a great tool to add an unlimited amount of customization to Joomla.

Joomla Menu Styling

This can be accomplish with the above examples except in the Joomla Module Manager it will be under “Menu Class Suffix” instead of “Module Class Suffix”

That’s It! My experience With Joomla 1.5!