css and category menus

12 posts by 3 authors in: Forums > CMS Builder
Last Post: December 1, 2009   (RSS)

Re: [atomicrabbit] css and category menus

By Chris - September 15, 2009

Hi atomicrabbit,

If I understand correctly, IE6 needs this extra code to be inserted immediately before a nested <ul> and immediately after a nested </ul>?

You can use a regular expression to replace </ul>'s in $categoryRecord['_listItemEnd'] with some extra code. For example:

$newListEnd = $categoryRecord['_listItemEnd'];
$match = '|</ul>|';
$replace = "</ul>\n<!--[if lte IE 6]>\n</td></tr></table>\n</a>\n<![endif]-->\n";
$newListEnd = preg_replace($match, $replace, $newListEnd);
echo($newListEnd);


Does that solve the problem? Please let me know if you have any more questions.
All the best,
Chris

Re: [chris] css and category menus

I haven't tested it yet, but what do the pipes | around the </ul> in the $match variable do?

Also, won't that match ALL <ul> tags, not just nested <ul> tags? ... so won't it also match the surrounding <ul> tags around the entire menu?

Re: [atomicrabbit] css and category menus

By Chris - September 15, 2009

The pipes surround the regular expression. Typically, people use forward slashes, but since our match contains a forward slash, we'd have to escape it. '/<\/ul>/' would be an identical regexp.


Also, won't that match ALL <ul> tags, not just nested <ul> tags? ... so won't it also match the surrounding <ul> tags around the entire menu?


Hmm. Would a simple solution be to add the IE6 LI start code to the <ul> tags around the entire menu?
All the best,
Chris

Re: [chris] css and category menus

By atomicrabbit - September 15, 2009 - edited: September 15, 2009

Hmm. Would a simple solution be to add the IE6 LI start code to the <ul> tags around the entire menu?

I'm not sure I understand what you mean.

my point is that I DON'T want the IE6 conditional if statements to be added to the <ul> tags around the entire menu, ONLY around the nested <ul> tags...

but it seems like the regexp code you posted will add the IE6 code to ALL </ul> tags, not just the nested ones

atomicrabbit.

Re: [atomicrabbit] css and category menus

By Chris - September 15, 2009

Hi atomicrabbit,

Also, won't that match ALL <ul> tags, not just nested <ul> tags? ... so won't it also match the surrounding <ul> tags around the entire menu?


Now that I've done my research properly, I can answer this question instead of just guessing at a solution. :)

No, it won't. $categoryRecord['_listItemStart'] and $categoryRecord['_listItemEnd'] are meant to be used inside an outer <ul></ul>, so you have full control over the <ul> tags around the entire menu. For example:

<ul>
<?php foreach ($categoryRecords as $record): ?>
<?php echo $record['_listItemStart'] ?>
<a href="<?php echo $record['_link'] ?>"><?php echo $record['name'] ?></a>
<?php echo $record['_listItemEnd'] ?>
<?php endforeach; ?>
</ul>


I hope this helps! Please let us know how these menus work out for you. I'm suprised something this cool can work with IE6! :D
All the best,
Chris

Re: [chris] css and category menus

hey chris,
seems to work ok so far. Is there a way to determine if an item has sub items. I don't want it to print the IE conditional statement if an item does not have children.

Re: [atomicrabbit] css and category menus

By Chris - September 15, 2009

How about a similar approach with _listItemStart?

$link = $categoryRecord['_link']; // for example: "/products"
$name = $categoryRecord['name']; // for example: "PRODUCTS"

$newListStart = $categoryRecord['_listItemStart'];
$match = '|<ul>|';
$replace = "<!--[if lte IE 6]>\n<a href="$link">$name\n<table><tr><td>\n<![endif]-->\n<ul>";
$newListStart = preg_replace($match, $replace, $newListStart);
echo($newListStart);

All the best,
Chris

Re: [chris] css and category menus

yeah that's what I ended up doing.

It all seems to work! Thank you Chris! Your help is much appreciated!

Re: [chris] css and category menus

Hi Chris,

I have a class that I apply to an unordered list at the list item level so the code looks something like this for selected items
<ul>
<li class="selected"><a href="#">Example Selected Link</a></li>
<li><a href="#">Example Non-Selected Link</a></li>
</ul>


How can I apply my "selected" class to $categoryRecord['_listItemStart'] ?

Thanks
Graphic Lingoes
www.graphiclingoes.com