help with category

11 posts by 2 authors in: Forums > CMS Builder
Last Post: August 9, 2010   (RSS)

how i can setup the categroy like accordion menu using jQuery?

http://roshanbh.com.np/2008/06/accordion-menu-using-jquery.html

Re: [efi-revivo] help with category

By Chris - August 5, 2010

Hi efi-revivo,

The first thing to do is to mock up what the HTML should look like yourself, then get a viewer working which displays your categories. Post both of those and I can help you change the code in the viewer so that it creates HTML exactly like your mock-up!
All the best,
Chris

Re: [chris] help with category

this the code of the menu:
<div style="float:left" > <!--This is the first division of left-->
<p><strong>&nbsp;Works on clicking </strong></p>
<div id="firstpane" class="menu_list"> <!--Code for menu starts here-->
<p class="menu_head">Header-1</p>
<div class="menu_body">
<a href="#">Link-1</a>
<a href="#">Link-2</a>
<a href="#">Link-3</a>
</div>
<p class="menu_head">Header-2</p>
<div class="menu_body">
<a href="#">Link-1</a>
<a href="#">Link-2</a>
<a href="#">Link-3</a>
</div>
<p class="menu_head">Header-3</p>
<div class="menu_body">
<a href="#">Link-1</a>
<a href="#">Link-2</a>
<a href="#">Link-3</a>
</div>
</div> <!--Code for menu ends here-->
</div>

this is the code for the category:
<ul>
<li><a href="?">(All Articles)</a></li>
<?php foreach ($categoriesRecords as $categoryRecord): ?>
<?php echo $categoryRecord['_listItemStart'] ?>
<?php if ($categoryRecord['_isSelected']): ?><b><?php endif ?>
<a href="?category=<?php echo $categoryRecord['num'] ?>" onMouseOver="soundManager.play('<?php echo $categoryRecord['num'] ?>',1)" onMouseOut="soundManager.stop('<?php echo $categoryRecord['num'] ?>')">
<?php echo $categoryRecord['name'] ?></a>
<?php if ($categoryRecord['_isSelected']): ?></b><?php endif ?>
<?php echo $categoryRecord['_listItemEnd'] ?>
<?php endforeach ?>
</ul>

Re: [efi-revivo] help with category

By Chris - August 6, 2010

Hi efi-revivo,

Does this work for you?

<div style="float:left" > <!--This is the first division of left-->
<p><strong>&nbsp;Works on clicking </strong></p>
<div id="firstpane" class="menu_list"> <!--Code for menu starts here-->

<?php $thisIsTheFirstCategory = true; ?>
<?php foreach ($categoriesRecords as $categoryRecord): ?>

<?php if ($categoryRecord['_isSelected']): ?><b><?php endif ?>

<?php if ($categoryRecord['depth'] == 0): ?>
<?php if (!$thisIsTheFirstCategory): ?>
</div>
<?php endif ?>
<?php $thisIsTheFirstCategory = false; ?>
<p class="menu_head"><?php echo $categoryRecord['name'] ?></p>
<div class="menu_body">
<?php else: ?>
<a href="?category=<?php echo $categoryRecord['num'] ?>"><?php echo $categoryRecord['name'] ?></a>
<?php endif ?>

<?php if ($categoryRecord['_isSelected']): ?></b><?php endif ?>

<?php endforeach ?>
<?php if (!empty($categoriesRecords)): ?>
</div>
<?php endif ?>

</div> <!--Code for menu ends here-->
</div>


Please let me know if you have any questions!
All the best,
Chris

Re: [chris] help with category

thank you for your help.
i just have one question if i have a category without sub category how do i make a link to the list page?
where in this code i need to add the link?

Re: [efi-revivo] help with category

By Chris - August 9, 2010

Hi efi-revivo,

I don't think the accordion menu allows this, does it? If you can show me with example HTML, I can show you how to write PHP code to generate that HTML.
All the best,
Chris

Re: [efi-revivo] help with category

By Chris - August 9, 2010

Hi efi-revivo,

What should the HTML look like when there's supposed to be a category link? If you can give me an example of what you want the HTML to look like, I can help.
All the best,
Chris

Re: [chris] help with category

<div style="float:left" > <!--This is the first division of left-->
<p><strong>&nbsp;Works on clicking </strong></p>
<div id="firstpane" class="menu_list"> <!--Code for menu starts here-->
<p class="menu_headnew" onclick="location.href='http://www.example.com';" >Header</p>
<p class="menu_head">Header-1</p>
<div class="menu_body">
<a href="#">Link-1</a>
<a href="#">Link-2</a>
<a href="#">Link-3</a>
</div>
<p class="menu_head">Header-2</p>
<div class="menu_body">
<a href="#">Link-1</a>
<a href="#">Link-2</a>
<a href="#">Link-3</a>
</div>
<p class="menu_head">Header-3</p>
<div class="menu_body">
<a href="#">Link-1</a>
<a href="#">Link-2</a>
<a href="#">Link-3</a>
</div>
</div> <!--Code for menu ends here-->
</div>

Re: [efi-revivo] help with category

By Chris - August 9, 2010

Hi efi-revivo,

How about this?

<div style="float:left" > <!--This is the first division of left-->
<p><strong>&nbsp;Works on clicking </strong></p>
<div id="firstpane" class="menu_list"> <!--Code for menu starts here-->

<?php $divToClose = false; ?>
<?php foreach ($categoriesRecords as $categoryRecord): ?>

<?php if ($categoryRecord['_isSelected']): ?><b><?php endif ?>

<?php if ($categoryRecord['depth'] == 0): ?>
<?php if ($divToClose): ?>
<?php $divToClose = false; ?>
</div>
<?php endif ?>
<?php if ($categoryRecord['_hasChild']): ?>
<?php $divToClose = true; ?>
<p class="menu_head"><?php echo $categoryRecord['name'] ?></p>
<div class="menu_body">
<?php else: ?>
<p class="menu_headnew" onclick="location.href='?category=<?php echo $categoryRecord['num'] ?>';" ><?php echo $categoryRecord['name'] ?></p>
<?php endif ?>
<?php else: ?>
<a href="?category=<?php echo $categoryRecord['num'] ?>"><?php echo $categoryRecord['name'] ?></a>
<?php endif ?>

<?php if ($categoryRecord['_isSelected']): ?></b><?php endif ?>

<?php endforeach ?>
<?php if ($divToClose): ?>
</div>
<?php endif ?>

</div> <!--Code for menu ends here-->
</div>


The trick here is in examining the _hasChild field. I also had to change the logic of when to generate </div>s.

Does this help?
All the best,
Chris