Bold Parents, indent Children in Category Menu

10 posts by 4 authors in: Forums > CMS Builder
Last Post: March 5, 2015   (RSS)

I can't believe I haven't come across this issue before in CMSB and I am sure there is an easy fix. Anybody know how to bold parents in a category menu and have all children indented?

By claire - February 16, 2015

Hi there - the easiest way to do this is through CSS style rules, more or less. Bolding is done with font-weight, and indentation is done with margins.

--------------------

Claire Ryan
interactivetools.com

Save time by getting our experts to help with your project.
http://www.interactivetools.com/consulting/

Yes, this much I know. How is it applied to your category code?

<ul class="menu">
                                     <?php foreach ($training_coursesRecords as $listRecord): ?>
      <?php $isSelected = ($listRecord['num'] == $detailRecord['num']); ?>
      <?php if ($isSelected) { print "<b>"; } ?>
      <li><a href="<?php echo htmlencode($listRecord['_link']) ?>"><?php echo htmlencode($listRecord['name']) ?></a></li>
      <?php if ($isSelected) { print "</b>"; } ?>
    <?php endforeach ?>

    <?php if (!$training_coursesRecords): ?>
      No records were found!<br/><br/>
    <?php endif ?>
                                    </ul>

By claire - February 16, 2015

Rather than see the back end code, I'd like to look at how the front end HTML is being rendered. Can you send me a link to the page where the menu appears? I can give you a few simple style rules based on that.

--------------------

Claire Ryan
interactivetools.com

Save time by getting our experts to help with your project.
http://www.interactivetools.com/consulting/

Thanks for the quick response - you can see it here - http://www.hrlegal.com.au/training-courses.php

By claire - February 16, 2015

Okay, I can see that the sidebar list appears to be the one you want to format. This includes a title and a list of links that are already indented. Can I confirm which records are the parent records?

--------------------

Claire Ryan
interactivetools.com

Save time by getting our experts to help with your project.
http://www.interactivetools.com/consulting/

All of them are parents except for bullets 2-5 - Module A,B, C, & D.

By benedict - March 3, 2015

Hello? Do we have any update on this - I'd love to get this sorted out if you have the time.

By Daryl - March 5, 2015

Hi benedict,

As Ron pointed out, you can use 'depth' value to determine a category menu record's level.
A parent category record has a depth of "0", it's children's depth is "1", grandchildren will have "2", and so on.

So on your provided code above, you can implement the CSS styling base on the depth by something like this:

<ul class="menu">
  <?php foreach ($training_coursesRecords as $listRecord): ?>
    <?php
    $style = '';
    $style = $listRecord['depth'] == 0 ? 'style = "font-weight: bold;"' : 'style = "padding-left: 20px;"';
    ?>
    <li <?php echo $style; ?>><a href="<?php echo htmlencode($listRecord['_link']) ?>"><?php echo htmlencode($listRecord['name']) ?></a></li>

  <?php endforeach ?>

  <?php if (!$training_coursesRecords): ?>
    No records were found!<br/><br/>
  <?php endif ?>
</ul>

Or instead of in-line CSS, add a CSS class.

I hope this helps!

Cheers,

Daryl Maximo
PHP Programmer - interactivetools.com