Generate <ul> style breadcrumb rich snippet - php

I found various solutions for generating breadcrumbs, but all of them use elements, but my current breadcrumb is in unordered list style.
Here is what I done so far:
<div class="breadcrumb">
<ul>
<?php $seocrumbs = array_pop($breadcrumbs); ?>
<?php foreach($breadcrumbs as $idx=>$seocrumb) { ?>
<li>
<div <?php echo $idx == 0 ? '' : 'itemprop="child"'; ?> itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="<?php echo $seocrumb['url'];?>" itemprop="url">
<span itemprop="title"><?php echo $seocrumb['text'];?></span>
</a>
</div>
</li>
<?php }?>
<?php
//remove link from last item
echo $seocrumb['separator'];?> <li id="lastitem"><?php echo $seocrumbs['text']; ?></li>
</ul>
</div>
The problem with this code is that it is generating separate breadcrumbs, instead of mother key and childs.
<div class="breadcrumb">
<ul>
<li>
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="" itemprop="url">
<span itemprop="title">Index</span>
</a>
</div>
</li>
<li>
<div itemprop="child" itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="" itemprop="url">
<span itemprop="title">Category2</span>
</a>
</div>
</li>
<li id="lastitem">Plášte 27.5"</li>
</ul>
</div>

Assuming that you have some sort of test breadcrumb arrays, similar to this:
$array1 = array ( "url"=>"http://example.com", "text"=>"Parent","separator"=>" ");
$array2 = array ( "url"=>"http://example.com", "text"=>"Child","separator"=>" ");
$breadcrumbs = array ($array1,$array2);
I modified your code as follows:
$output = "<div class='breadcrumb'><ul><li>";
$itemType = "itemtype='http://data-vocabulary.org/Breadcrumb'";
foreach ($breadcrumbs as $key=>$value) {
if ($key != 0) {
$itemProp = "itemprop='child'";
$output .= "<li>";
} else {
$itemProp = '';
}
$output .= "<div $itemProp itemscope $itemType>";
$output .= " <a href='{$value['url']}' itemprop='url'>";
$output .= " <span itemprop='title'>";
$output .= " {$value['text']}";
$output .= " </span>";
$output .= " </a>";
$output .= "</div>";
if ($key != 0) {
$output .= "</li>";
} else {
$output .= "<ul>";
}
}
$output .= '</ul></li></ul></div>';
echo $output;
Which gives
<div class='breadcrumb'>
<ul>
<li>
<div itemscope itemtype='http://data-vocabulary.org/Breadcrumb'>
<a href='http://example.com' itemprop='url'>
<span itemprop='title'>Parent</span>
</a>
</div>
<ul>
<li>
<div itemprop='child' itemscope itemtype='http://data-vocabulary.org/Breadcrumb'>
<a href='http://example.com' itemprop='url'>
<span itemprop='title'>Child</span>
</a>
</div>
</li>
</ul>
</li>
</ul>
</div>
I'm making some assumptions about your starting array formatting, but this should be a workable format for you to tweak it and meet your needs.

A foreach loop will generate a 1 dimensional breadcrumb trail. If you want
<ul>
<li>Category 1
<ul>
<li>item 1</li>
<li>item 2</li>
</ul>
</li>
<li>Category 2</li>
</ul>
You will need 2 foreach loops, 1 for each category, and 1 for each key.
<ul>
<?php
foreach ($categories as $c_idx=>$c_value){
echo "<li>$c_value<ul>";
foreach ($items as $i_idx=>$i_value){
echo "<li>$i_value</li>"
}
echo "</ul>";
echo "</li>"
}
?>
</ul>

Related

How to add class on each item using while loop

I just want to add a class on each items using the while loop in php. But the problem is it will add only to the item that is greater than 2, not to all items. My goal is to add class "nav-multiple" on all items if the items is exceed to 2.
<ul>
<?php
$index = -1;
// loop through the rows of data
while ( have_rows('property_section_menu_repeater_field') ) : the_row();
$index++;
$title = get_sub_field('property_section_menu_repeater_subfield1');
$unique_id = get_sub_field('property_section_menu_repeater_subfield2');
?>
<li class="nav-item <?php echo $index >= 2 ? 'nav-multiple' : ''; ?>">
<a class="nav-link p-0" href="#<?php echo $unique_id; ?>"><?php echo $title; ?></a>
</li>
<?php endwhile; ?>
</ul>
Current output:
<li class="nav-item">
<a></a>
</li>
<li class="nav-item nav-multiple">
<a></a>
</li>
The output that i want to achieve:
<li class="nav-item nav-multiple">
<a></a>
</li>
<li class="nav-item nav-multiple">
<a></a>
</li>
Okay I solved it now by using php count() function and foreach loop
<ul>
<?php
$rows = get_field('property_section_menu_repeater_field');
// loop through the rows of data
foreach($rows as $key => $row):
$title = $row['property_section_menu_repeater_subfield1'];
$unique_id = $row['property_section_menu_repeater_subfield2'];
?>
<li class="nav-item <?php echo count($rows) >= 2 ? 'nav-item-multiple' : ''; ?>">
<a class="nav-link p-0" href="#<?php echo $unique_id; ?>"><?php echo $title; ?></a>
</li>
<?php endforeach; ?>
</ul>

include div in foreach just in some condition

I have some navbar with menu and submenu, I want to appear some <div> in that menu to appear the submenu just if this menu has submenu items
The div that I want to appear are div1, div2, div3, see comments and in this condition : <?php if ($men["titre"] == $sub["parentmenu"]) : ?>
I can't put them in this foreach : <?php foreach($submenu as $sub) :?> because I need that three div just ones for all the submenu <li>
Exemple of one menu who have submenus:
<li class="Menu1">
<a class="header-menu " href="#">Menu1 title</a> //Menu1
<div class="mobile-header-nav-submenu-container"> //div 1
<ul class="mobile-header-nav-submenu"> //div 2
<div class="mobile-header-nav-submenu-li-container"> //div3
<li class="submenu1">
<a class="" href="#">Submenu1</a>
</li>
<li class="submenu2">
<a class="" href="#">Submenu2</a>
</li>
<li class="submenu3">
<a class="" href="#">Submenu3</a>
</li>
</div>
</ul>
</div>
</li>
My code:
<div class="menu>
<?php foreach ($menu as $men): ?>
<li class="<?php echo $men["titre"]?>">
<a class="header-menu <?php echo $men["lien"]?>" href="<?php if($men["lien"]){echo $baseUrl.$men["lien"];}else{echo '#';}?>"><?php echo $men["titre"]?></a>
<div class="mobile-header-nav-submenu-container"> //div1
<ul class="mobile-header-nav-submenu"> //div2
<div class="mobile-header-nav-submenu-li-container"> //div3
<?php foreach($submenu as $sub) :?>
<?php if ($men["titre"] == $sub["parentmenu"]) : ?>
<li id="<?php echo $sub["titre"]?>" class="mobile-header-nav-submenu-li">
<a class="" href="<?php if($sub["lien"]){echo $baseUrl.$sub["lien"];}else{echo '#';}?>">
<?php echo $sub["titre"]?>
</a>
</li>
<?php endif; ?>
<?php endforeach; ?>
</div>
</ul>
</div>
</li>
<?php endforeach; ?>
</div>

how to view submenu on click using php,html

I'm trying to view submenu after click on parent.
Classes->Primary School->(Grade1,Grade2,Grade3,Grade4,Grade5,Grade6)
Classes->Middle School->(Grade7,Grade8,Grade9)
Classes->Secondary School->(Grade10,Grade11,Grade12)
<div class="collapse navbar-collapse" id="main-navigation">
<ul class="nav navbar-nav navbar-right">
<?php foreach ($data as $menu) { ?>
<?php if(!$menu->children) { ?>
<li><?php echo $menu->name; ?></li>
<?php }
else {
?>
<li class="dropdown open">
<a href="#" class="dropdown-toggle " data-toggle="dropdown">
<?php echo $menu->name; ?>
<span class="fa fa-angle-down"></span>
</a>
<ul class="dropdown-menu open" role="menu">
<?php
foreach ($menu->children as $child) {
?>
<li><?php echo $child->name; ?></li>
<?php
foreach ($child->children as $sub_child) {
?>
<li class="dropdown-submenu">
<?php echo $sub_child->name; ?><span class="fa fa-angle-down"></span>
<ul class="dropdown-submenu" role="menu">
<?php } ?>
<?php } ?>
</ul>
</li>
<?php } ?>
<?php } ?>
</ul>
</li>
</ul>
</div>
The result:
Problem with result
I want to view Grade 1 to Grade 6 after click on Primary school and from Grade 7 to Grade 9 after click on Middle school ...
Please help!
You have an open <ul class="dropdown-submenu" role="menu"> tag without any <li> or <a>'s being generated inside of it. Then you close two each statements before closing the <ul> tag.
<?php foreach ($child->children as $sub_child) { ?>
<li class="dropdown-submenu">
<a href="#" style="color:black;" class="dropdown-toggle " data-toggle="dropdown">
<?php echo $sub_child->name; ?><span class="fa fa-angle-down"></span>
</a>
<ul class="dropdown-submenu" role="menu">
<?php } ?>
<?php } ?>
</ul>
</li>
This will be causing all sorts of unintended markup output. Fix that and it should fix your problem. If not, you'll atleast be a lot closer.

Add a class to <li> if sub menu exist using mysqli query

I want to know, how do i add a class to a <li> if it has a sub_menu?
I have a proper HTML menu populated from mysql database.
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav navbar-right">
<li>About us
<ul class="dropdown-menu">
<li>Link 1</li>
<li>Link 2</li>
<li>Link 3</li>
<li>Link 4</li>
<li>Link 5</li>
</ul>
</li>
<li class="dropdown">Contact</li>
</ul>
</div>
I am using bootstrap framework, so for the drop down menu i have to replace my <li> to this:
<li class='dropdown'>
<a aria-expanded='false' aria-haspopup='true' class='dropdown-toggle' data-toggle='dropdown' href='/about-us/' role='button'>
About us <span class='caret'></span>
</a>
</li>
I want to know how do i check if the <li> has any sub_menu before running a sub menu query in the loop? so that i can add markup for dropdown menu.
Here's the PHP Code that generates MENU:
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav navbar-right">
<?php
$res1 = $connection->query("SELECT * FROM primary_nav ORDER BY m_menu_id ASC");
while($menu=$res1->fetch_array())
{
?>
<li>
<a href="<?php echo $domain; ?><?php echo $menu['m_menu_link']; ?>">
<?php echo $menu['m_menu_name']; ?>
</a>
<?php
$res1_pro=$connection->query("SELECT * FROM primary_subnav WHERE m_menu_id=".$menu['m_menu_id']." ORDER BY seq ASC");
//echo "\xA";
?>
<?php
if(mysqli_num_rows($res1_pro) > 0) {
echo '<ul class="dropdown-menu">' ."\xA";
while ($pro1_row = $res1_pro->fetch_array()) {
?>
<li>
<a href="<?php echo $domain; ?><?php echo $pro1_row['s_menu_link']; ?>">
<?php echo $pro1_row['s_menu_name']; ?>
</a>
</li>
<?php
}
echo '</ul>' ."\xA";
}
?>
</li>
<?php
echo "\xA";
}
?>
</ul>
</div>
I could do thi with the jQuery, but i want to do it the HTML way.
You have to add the <li> with the class in the if check for the number of rows. Then you have to add an else clause to echo out the <li> without the class:
<?php
$res1 = $connection->query("SELECT * FROM primary_nav ORDER BY m_menu_id ASC");
while($menu=$res1->fetch_array())
{
$res1_pro=$connection->query("SELECT * FROM primary_subnav WHERE m_menu_id=".$menu['m_menu_id']." ORDER BY seq ASC");
//echo "\xA";
if(mysqli_num_rows($res1_pro) > 0) { // echo the list element with the class here
?>
<li class="foo">
<?php echo $menu['m_menu_name']; ?>
<?php
echo '<ul class="dropdown-menu">' ."\xA";
while ($pro1_row = $res1_pro->fetch_array()) {
?>
<li>
<?php echo $pro1_row['s_menu_name']; ?>
</li>
<?php
}
echo '</ul>' ."\xA";
} else { // echo the normal list element if number of rows is 0
?>
<li>
<?php echo $menu['m_menu_name']; ?>
<?php
}
?>
</li>
<?php
echo "\xA";
}
?>
Note: This particular coding style makes it very hard to write and maintain code should the need arise. You may want to look into ways to combine PHP and HTML to make it easier to update and maintain your code.

trying to get foreach loop to display items with subitems correctly in list items

I am really trying to get this to work and am close:
It loops through the array and does create the submenus (with an error albeit) but:
the first menu with submenu items appears correctly but on the second menu that has a submenu items it repeats the first submenu items and then the second submenu items..... what am I missing?
Any help would be greatly appreciated.
<ul class="nav navbar-nav">
<?php
$html = new cacheHTML('topmenu');
if(!$html->isCached){
$menuitems = getMenuLevelsArray(25, 1 , 1);
$submenuI = "0";
foreach($menuitems as $item){
if($item['submenu']){
$subs[$submenuI] = $item['submenu'];
}
?>
<li <?php if($subs[$submenuI]){ ?> class="dropdown" <?php }?>>
</span> <?php }?>
<!-- submenu begins here -->
<?php foreach($subs as $submenuI => $menu){ ?>
<ul class="dropdown-menu" role="menu">
<li>
<?php
for($a=0; $a < count($menu); $a++){
?>
<a href="<?php echo $menu[$a]['url']; ?>" <?php if(!$menu[$a+1]){ echo "class='last'"; } ?>><?php echo $menu[$a]['text']; ?></a>
<?php } ?>
</li>
</ul>
<?php $submenuI++; } ?>
</li>
<?php
}
?>
<?php } $html->show(); ?>
</ul>
`<ul class="nav navbar-nav">
<li> Home <br>
<b>Warning</b>: Invalid argument supplied for foreach() in <b>/layout.php</b> on line 95<br>
</li>
<li class="dropdown open">
About<span class="caret"></span>
<ul class="dropdown-menu" role="menu">
<li>
About
Board of Directors
Structure
</li>
</ul>
</li>
<li>
Standards & Codes
<ul class="dropdown-menu" role="menu">
<li>
About
Board of Directors
Structure
</li>
</ul>
</li>
<li class="dropdown">
Resources <span class="caret"></span>
<ul class="dropdown-menu" role="menu">
<li>
About
Board of Directors
Structure
</li>
</ul>
<ul class="dropdown-menu" role="menu">
<li>
Frequently Asked Questions
News Archives
Resource Links
Safety Alerts
</li>
</ul>
</li>
<li>Contact Us
<ul class="dropdown-menu" role="menu">
<li>
About
Board of Directors Structure
</li>
</ul>
<ul class="dropdown-menu" role="menu">
<li>
Frequently Asked Questions
News Archives
Resource Links
Safety Alerts
</li>
</ul>
</li>
</ul>`
Under the first "foreach" loop you should reset your $subs array to make sure it's empty. Otherwise it gets down to the second loop, sees the old "$subs" from the previous loop, and loops through it again:
foreach ( $menuitems as $item ) {
$subs = array();
if ($item ['submenu']) {
$subs [$submenuI] = $item ['submenu'];
}
...
I found the mixture of PHP and HTML hard to read, so I rewrote the code to make it easier for my eyes:
$html = new cacheHTML ( 'topmenu' );
if (! $html->isCached) {
$menuitems = getMenuLevelsArray ( 25, 1, 1 );
$submenuI = "0";
foreach ( $menuitems as $item ) {
if ($item ['submenu']) {
$subs [$submenuI] = $item ['submenu'];
}
echo '<li';
if($subs[$submenuI]){
echo 'class="dropdown"';
}
echo ">
<a href='{$item['url']}'";
if($subs[$submenuI]){
echo 'class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"';
}
echo ">{$item['text']}";
if($subs[$submenuI]){
echo '<span class="caret"></span>';
}
echo '</a> <!-- submenu begins here -->
';
foreach($subs as $submenuI => $menu){
echo '<ul class="dropdown-menu" role="menu">
<li>
';
for($a = 0; $a < count ( $menu ); $a ++) {
echo "<a href='{$menu[$a]['url']}'";
if(!$menu[$a+1]){
echo "class='last'";
}
echo ">{$menu[$a]['text']}</a>
";
}
echo '</li>
</ul>
';
$submenuI++;
}
echo '</li>';
}
}
$html->show(); ?>
</ul>
I hope this helps!
Finally got it...
I need to learn me some more PHP if statements and foreach's
here is what I did:
<ul class="nav navbar-nav">
<?php
$html = new cacheHTML('topmenu');
if(!$html->isCached){
$menuitems = getMenuLevelsArray(25, 1 , 1);
$submenuI = "0";
foreach($menuitems as $item){
if($item['submenu']){
$subs[$submenuI] = $item['submenu'];
}
?>
<li <?php if($subs[$submenuI]){ ?> class="dropdown" <?php }?>>
</span> <?php }?>
<!-- submenu begins here -->
<?php foreach($subs as $submenuI => $menu){ ?>
<ul class="dropdown-menu" role="menu">
<li>
<?php
for($a=0; $a < count($menu); $a++){
?>
<a href="<?php echo $menu[$a]['url']; ?>" <?php if(!$menu[$a+1]){ echo "class='last'"; } ?>><?php echo $menu[$a]['text']; ?></a>
<?php } ?>
</li>
</ul>
<?php $submenuI++; } ?>
</li>
<?php
}
?>
<?php } $html->show(); ?>
</ul>

Categories