The Joomla! Forum ™



Forum rules


Forum Rules
Absolute Beginner's Guide to Joomla! <-- please read before posting, this means YOU.



Post new topic Reply to topic  [ 33 posts ]  Go to page 1, 2  Next
Author Message
 Post subject: Different "body" id tag
PostPosted: Mon Apr 07, 2008 6:29 am 
User avatar
Joomla! Apprentice
Joomla! Apprentice

Joined: Tue Jul 10, 2007 9:32 pm
Posts: 12
Hello everyone,

I have searched all over the net but i could not find anything regarding my problem. So... I have to develop a site which has different body id property for different pages. For example, if I navigate to "Contact" page it must be: "<body id='contact'>", but if I go to content it will be "<body id='content'>".
Is there any solution beside checking $_GET["option"] and use switch..case statement?

Thank you very much for your answers.

_________________
http://www.aiss-softwork.com


Top
 Profile  
 
PostPosted: Wed Apr 09, 2008 12:53 pm 
User avatar
Joomla! Exemplar
Joomla! Exemplar

Joined: Fri Sep 09, 2005 2:13 pm
Posts: 7956
Location: The Netherlands
Then you have to change the complete templating system of Joomla.
I don't think you want to do that. When Joomla is going to update you will get problems again.

_________________
Robert Dam - Joomla Forum Moderator
Dutch Boards | Joomla Coding Boards | English Support Boards


Top
 Profile  
 
PostPosted: Wed Apr 09, 2008 1:14 pm 
User avatar
Joomla! Apprentice
Joomla! Apprentice

Joined: Tue Jul 10, 2007 9:32 pm
Posts: 12
well ... i was going to check this on /templates/my_template/index.php ....
also i was thinking to add a new field (bodyid) in the menu creation form and then to check that value for every page.

_________________
http://www.aiss-softwork.com


Top
 Profile  
 
PostPosted: Fri Apr 25, 2008 11:14 am 
User avatar
Joomla! Enthusiast
Joomla! Enthusiast

Joined: Wed Feb 08, 2006 5:33 pm
Posts: 177
Location: amsterdam, holland
Hi Silviuks,

I am looking for exactly the same.

This used to work in earlier versions of Joomla! 1.5 but not anymore:

Code:
<?php
$menu = &JMenu::getInstance();
$active = $menu->getActive();
?>
<body id="<?php echo($active->alias); ?>">


I would like to get it to work again. Maybe someone can help?

~kor

_________________
http://www.dwarshuis.com


Top
 Profile  
 
PostPosted: Fri Apr 25, 2008 12:00 pm 
User avatar
Joomla! Apprentice
Joomla! Apprentice

Joined: Fri Nov 18, 2005 3:32 pm
Posts: 29
Location: Amsterdam, The Netherlands
Hi Kor,

if you want to use the (menu defined) url alias as body ID, this should do it:

Code:
<?php
$menu = &JSite::getMenu();
$active = $menu->getActive();
?>
<body id="<?php print $active->alias; ?>">


I tested it in Joomla 1.5.3.


Top
 Profile  
 
PostPosted: Fri Apr 25, 2008 12:14 pm 
User avatar
Joomla! Enthusiast
Joomla! Enthusiast

Joined: Wed Feb 08, 2006 5:33 pm
Posts: 177
Location: amsterdam, holland
Bas, you are the greatest!
I works!
Thank you very much.
~kor

_________________
http://www.dwarshuis.com


Top
 Profile  
 
PostPosted: Sat May 03, 2008 11:01 pm 
Joomla! Fledgling
Joomla! Fledgling

Joined: Sat May 03, 2008 10:58 pm
Posts: 2
Thanks, this is exactly what I was looking for. Is there a way to have the body ID be the parent page? Right now the body ID gets pulled in as the name of my subpage rather than the parent.

Thanks,
Manoj


Top
 Profile  
 
PostPosted: Sat May 03, 2008 11:42 pm 
User avatar
Joomla! Apprentice
Joomla! Apprentice

Joined: Fri Nov 18, 2005 3:32 pm
Posts: 29
Location: Amsterdam, The Netherlands
This method is pretty flexible cause it allows you to assign the ID in the menu manager. Just give the menu item the alias you need and style accordingly. If you wish to have a parent relation you can use consistent aliases for parent and child. Another method would be to only parse a substring of the alias given.

For instance:
parent page alias = section1-index
child page alias = section1-page1

You could split the string into logical sections using the "-" sign as delimiter. And style parent and child pages consistently while retaining logical page id's and aliases.
This code would look something like this:
Code:
<?php
$menu = &JSite::getMenu();
$active = $menu->getActive();
$alias = explode('-',$active->alias);
?>
<body id="<?php print $alias[0]; ?>" class="<?php print $alias[1]; ?>">

----
output for given examples:
<body id="section1" class="index">
<body id="section1" class="page1">


There is a weakness to this method however. Pages that are not navigated to from the menu structure have no menu-alias, and consequently no ID.
Nothing a little creativity can't solve though.


Top
 Profile  
 
PostPosted: Sun May 04, 2008 12:46 am 
Joomla! Fledgling
Joomla! Fledgling

Joined: Sat May 03, 2008 10:58 pm
Posts: 2
Great, thanks again.

Also, is there a way to get the category ID? Similar to ItemId but I'd like to fetch the ID of the category that the article is in and store that in a variable for later reference.


Top
 Profile  
 
PostPosted: Sun May 04, 2008 2:32 pm 
User avatar
Joomla! Enthusiast
Joomla! Enthusiast

Joined: Wed Feb 08, 2006 5:33 pm
Posts: 177
Location: amsterdam, holland
And to avoid an empty (non-validating) id-tag like so:

Code:
<body id="">


(An example: the search results page does not have a menu item assigned to it and would end up with an empty id attribute.)

use this:

Code:
<body<?php
if (!empty($active->alias)) {
echo " id=\"$active->alias\"";} ?>>

_________________
http://www.dwarshuis.com


Top
 Profile  
 
PostPosted: Sun May 04, 2008 3:02 pm 
User avatar
Joomla! Apprentice
Joomla! Apprentice

Joined: Fri Nov 18, 2005 3:32 pm
Posts: 29
Location: Amsterdam, The Netherlands
manoj382 wrote:
Also, is there a way to get the category ID? Similar to ItemId but I'd like to fetch the ID of the category that the article is in and store that in a variable for later reference.


Your question poses a problem: the category ID of which article? On a single article page you could fetch the catid of the article. But if you have a page with multiple articles or a page with articles from different categories you cannot determine a single catid.

There are always solutions but if you want to create a clean and valid body id for each and every page in your joomla installation you quickly run into problems:
  • there are many different kinds of pages (so you wont be able to get a section id on a contacts pages for instance)
  • you need a unique identifier but there are multiple ways to navigate to the same pages and one page can be in different parts of your site (so do you assign an id based on page-content or on navigation-path?)
  • you need to get something interpretable, not a superunique id that just doesn't make sense to style
  • ... etc
Think about this issue and you quickly run into too many variables. That's why I think solving this problem via the url alias is a nice way to go about it.
Sorry, this answer is way too long. The bottom line is:
manually put the category in the url alias and save yourself a lot of headaches.


Top
 Profile  
 
PostPosted: Tue Sep 09, 2008 11:54 pm 
Joomla! Apprentice
Joomla! Apprentice

Joined: Tue Apr 22, 2008 9:25 pm
Posts: 7
I'm not sure if this is a similar issue, but if you check out the video link below, maybe someone has an idea on how to help me? What I've done is associated a component to the home page. An ID has been automatically assigned to the page. However, when I click to view a detail property from that page, the ID is shared by the detail page and the text on the home page still appears. I'm working In Joomla 1.0.15. The component is from Hot Property. (I've posted the same question on the Hot Property forum without luck.)
http://www.screencast.com/t/c1CawlmQt


Top
 Profile  
 
PostPosted: Mon Oct 13, 2008 11:13 pm 
User avatar
Joomla! Guru
Joomla! Guru

Joined: Wed Jul 04, 2007 4:54 am
Posts: 925
Location: Kuala Lumpur, Malaysia
use two templates ( a copy of the first will do ) and assign the
details to the second template. make the first default, the second using
the copied template. the copied template can have a totally new look,
and a set of body ids of its own, so you have great flexibilty in customising it.
( since it is now [drive] by a separate css file )

_________________
http://www.joomlah.net [] http://www.joomlah.org


Top
 Profile  
 
PostPosted: Mon Oct 27, 2008 7:58 pm 
Joomla! Ace
Joomla! Ace

Joined: Sat Oct 21, 2006 8:53 am
Posts: 1334
Has anyone bottomed this out? This is such an obvious way of personalising each page I would have though Joomla! would have built it in (or is it a templating issue).

_________________
Thanks for your time.


Top
 Profile  
 
PostPosted: Wed Jan 21, 2009 11:51 pm 
User avatar
Joomla! Ace
Joomla! Ace

Joined: Thu Aug 18, 2005 8:57 am
Posts: 1381
Location: Shrewsbury, Shropshire, United Kingdom
Alternatively, you could try using the menu page class suffix field instead of the menu alias. Add something like this instead of your body tag:
Code:
<?php
$menu =& JSite::getMenu();
$active = $menu->getActive();
$params = $menu->getParams( $active->id );
$class = $params->get( 'pageclass_sfx' );
?>
  <body<?php if ($class) echo ' class="' . $class . '"'; ?>>

I think it makes more sense to use the class suffix field, which is intended for styling purposes, rather than the alias field, which is intended for SEO.

Regards,
Chris.

_________________
Chris Davenport - Joomla Production Leadership Team

Lion Coppice http://www.lioncoppice.org/
Davenport Technology Services http://www.davenporttechnology.com/


Top
 Profile  
 
PostPosted: Thu Jan 22, 2009 6:35 pm 
Joomla! Ace
Joomla! Ace

Joined: Sat Oct 21, 2006 8:53 am
Posts: 1334
Apologies for being so thick, but exactly where would this code go?

_________________
Thanks for your time.


Top
 Profile  
 
PostPosted: Thu Jan 22, 2009 11:45 pm 
User avatar
Joomla! Ace
Joomla! Ace

Joined: Thu Aug 18, 2005 8:57 am
Posts: 1381
Location: Shrewsbury, Shropshire, United Kingdom
Look for <body> near the top of your template index.php file and replace it with the code given.

Regards,
Chris.

_________________
Chris Davenport - Joomla Production Leadership Team

Lion Coppice http://www.lioncoppice.org/
Davenport Technology Services http://www.davenporttechnology.com/


Top
 Profile  
 
PostPosted: Fri Jan 23, 2009 2:16 pm 
Joomla! Ace
Joomla! Ace

Joined: Sat Oct 21, 2006 8:53 am
Posts: 1334
That doesn't work! My template index.php has "<body>". If I replace that I get "<body style="font-size: 100%";">". Is something overwriting the index.php generated code?

_________________
Thanks for your time.


Top
 Profile  
 
PostPosted: Fri Jan 23, 2009 2:24 pm 
Joomla! Ace
Joomla! Ace

Joined: Sat Oct 21, 2006 8:53 am
Posts: 1334
Got it, sorry. I must put a page class suffix into the Parameters (System) of the menu item. I wish I new what produced the inline style though as I'd like to move that now to the CSS. Any clue welcome about that (e.g. Beez template).

_________________
Thanks for your time.


Top
 Profile  
 
PostPosted: Fri Mar 20, 2009 3:31 pm 
User avatar
Joomla! Intern
Joomla! Intern

Joined: Mon Jul 10, 2006 8:57 pm
Posts: 86
Location: Wiscosin, USA
vredeling wrote:
Hi Kor,

if you want to use the (menu defined) url alias as body ID, this should do it:

Code:
<?php
$menu = &JSite::getMenu();
$active = $menu->getActive();
?>
<body id="<?php print $active->alias; ?>">


I tested it in Joomla 1.5.3.


Thank for the code vredeling. I used your code with a slight tweak.
Code:
$menu = &JSite::getMenu();
$active = $menu->getActive();
$body_id = " id='".$active->alias."'";

<body<?=$body_id;?>>

_________________
Pat
"and it's the ocean flowing in our veins"
http://www.patrickkuhl.com


Top
 Profile  
 
PostPosted: Wed Apr 08, 2009 10:55 am 
Joomla! Apprentice
Joomla! Apprentice

Joined: Wed Nov 12, 2008 3:17 am
Posts: 6
I too have wandered over the net, seeking a solution.
I am by no means a programmer, but this works for my situation.
This will get the alias for the top menu item for your content path:
Code:
<?php
$menu =& JSite::getMenu();
$active = $menu->getActive();
$class = extractpath($active->route);
function extractpath($string){
preg_match('/^[a-zA-Z0-9\-_]+/',$string,$m);   
return $m[0];
}

?>
  <body<?php if ($class) echo ' class="' . $class . '"'; ?>>


Top
 Profile  
 
PostPosted: Fri Apr 10, 2009 4:32 pm 
I've been banned!

Joined: Sat Nov 15, 2008 1:27 pm
Posts: 2
hi!
the above solution seems to be for 1.5
how yould i solve that issue in joomla 1.0?


Top
 Profile  
 
PostPosted: Mon Jun 15, 2009 2:15 am 
Joomla! Apprentice
Joomla! Apprentice

Joined: Fri Jun 12, 2009 3:41 am
Posts: 7
It has taken me days to find this solution.
THANK YOU SO MUCH!!


This should be a core funcationality of joomla to help in creating more usable websites.

As a webdesigner I am finding joomla quite a bit harder to learn purely for the way in the in which better usability sites are structured.

thankyou again guys.


Top
 Profile  
 
PostPosted: Mon Jul 20, 2009 2:21 pm 
User avatar
Joomla! Apprentice
Joomla! Apprentice

Joined: Fri Nov 18, 2005 3:32 pm
Posts: 29
Location: Amsterdam, The Netherlands
Quote:
I think it makes more sense to use the class suffix field, which is intended for styling purposes, rather than the alias field, which is intended for SEO.


Actually, one could argue that effective use of both seo urls and html classes share a common requirement: they should be semantically correct. In everyday terms: the alias field should be used to describe the contents of the page. A class attached to any html tag should do the same thing: describe what its contents are.
Since you never use urls like: http://www.example.com/articles/color1 you shouldn't use classes like that either (ie: <p class="color1">this is a red paragraph</p>).
As a front-end developer you have to make a choice here: do you require the use of semantically correct urls and classes or not? If you do, you can boost both you search engine rank and your body styling in one go. If you don't you have a lot more versatility in naming your classes.


Top
 Profile  
 
PostPosted: Wed Aug 19, 2009 5:59 am 
User avatar
Joomla! Apprentice
Joomla! Apprentice

Joined: Wed Aug 22, 2007 1:51 pm
Posts: 28
Location: Boston, MA, USA
This is great stuff, exactly what I was looking for, I need to customize a site using this type of method. Thanks!

_________________
High Rock Media Web Development
http://www.highrockmedia.com


Top
 Profile  
 
PostPosted: Sat Sep 19, 2009 11:07 pm 
User avatar
Joomla! Intern
Joomla! Intern

Joined: Tue Dec 13, 2005 9:56 pm
Posts: 74
Location: Oregon
Some collected wisdom on this topic (using the page class suffix approach):
http://docs.joomla.org/Using_the_Page_C ... plate_Code

_________________
- Bible Yellow Pages: http://www.bibleyp.com


Top
 Profile  
 
PostPosted: Sun Sep 20, 2009 4:06 pm 
User avatar
Joomla! Apprentice
Joomla! Apprentice

Joined: Wed Aug 22, 2007 1:51 pm
Posts: 28
Location: Boston, MA, USA
What's interesting is I started to work with Magento recently and a similar functionality is built in to the Magento core. So it was trivial in Magento for example to change header background images with CSS based on what section of the website the user is currently on.

Nice to have something like this in Joomla even if its just an add on to your template. This allows for some nice granular customization without having to actually switch to a slightly altered version of your template say if all you want to do is change the header image or some CSS for a specific page of your site but at the same time don't want to go out and manage a module or plugin that is used for that purpose.

_________________
High Rock Media Web Development
http://www.highrockmedia.com


Top
 Profile  
 
PostPosted: Tue Oct 27, 2009 6:26 am 
Joomla! Fledgling
Joomla! Fledgling

Joined: Fri Oct 12, 2007 4:30 am
Posts: 1
Chris Davenport wrote:
Alternatively, you could try using the menu page class suffix field instead of the menu alias. Add something like this instead of your body tag:
Code:
<?php
$menu =& JSite::getMenu();
$active = $menu->getActive();
$params = $menu->getParams( $active->id );
$class = $params->get( 'pageclass_sfx' );
?>
  <body<?php if ($class) echo ' class="' . $class . '"'; ?>>

I think it makes more sense to use the class suffix field, which is intended for styling purposes, rather than the alias field, which is intended for SEO.

Regards,
Chris.


Thanks... that worked nicely for me. Just what I needed.


Top
 Profile  
 
PostPosted: Wed Jan 05, 2011 11:57 am 
Joomla! Explorer
Joomla! Explorer

Joined: Wed Dec 12, 2007 2:40 am
Posts: 268
Location: Frisco, CA
Does anyone know how to call the article alias (not the menu alias)? The original method has always worked for me, but now I have a site where the individual articles of a blog need different styling then the parent blog page (the menu alias returns the same for both). I'm wondering if there's a way to accomplish it in a cleaner way than grabbing the full url and parsing.


Top
 Profile  
 
PostPosted: Fri Oct 07, 2011 11:31 pm 
Joomla! Intern
Joomla! Intern

Joined: Sun May 02, 2010 9:50 pm
Posts: 55
Article id and alias can be usable classes too.

This code above <!DOCTYPE> and <html> tag
Code:
<?php $id = (isset($_GET['id'])) ? $_GET['id'] : null ; ?>

and this echo in <body> tag
Code:
<body class="id-<?php echo $id; ?>"


gives you id-(Article id):(article title alias) ex: id-1:joomla-title which you cant use as css selector because of ":" - this colon, so i`ve replaced the damn colon, and all works great!

The right code is:
Code:

<?php
$id = (isset($_GET['id'])) ? $_GET['id'] : null ;
$id = str_replace(':', ' ', $id);
?>

<!DOCTYPE html etc >
<html>
<head>
<body class="id-<?php echo $id; ?>">



...and now, you can youse article id, and article title alias as your class selector.


Top
 Profile  
 
Display posts from previous:  Sort by  
Post new topic Reply to topic  [ 33 posts ]  Go to page 1, 2  Next



Who is online

Users browsing this forum: No registered users and 24 guests


You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot post attachments in this forum

Jump to:  
Powered by phpBB® Forum Software © phpBB Group