I am trying to create a hoverable mega menu, all works fine except the active one.
I checked in source codes and active class is added, but it doesn't show up the content until mouseenter on it.
see image please :
And this is when I go on it with mouse, it show up with no problem.
I gues I need to set main (FINANCE is main menu in pic) menu active, but dont know how to pass it to submenu.
Here is my full code :
$stmt_menu = $pdo->prepare("SELECT * FROM categories WHERE parentId = ? LIMIT 5");
$stmt_menu->execute([0]);
if ($stmt_menu->rowCount() > 0) {
$query = $stmt_menu->fetchAll();
foreach ($query as $row) {
if ($row['cat_type'] == 'mega') {
?>
<li class="dropdown megamenu-fw mega-li-<?php echo $row['catId']; ?>">
<?php echo $row['catName']; ?><span class="caret"></span>
<ul class="dropdown-menu megamenu-content dropdown-top" role="menu" aria-expanded="true" data-mega-ul="<?php echo $row['catId']; ?>">
<li>
<?php
$stmt_menu = $pdo->prepare("SELECT * FROM categories WHERE parentId = ? LIMIT 5");
$stmt_menu->execute([$row['catId']]);
if ($stmt_menu->rowCount() > 0) {
$subquery = $stmt_menu->fetchAll();
?>
<div class="sub-menu-left">
<ul class="nav-sub-categories">
<?php
$i = 0;
foreach ($subquery as $subq) {
$actives = '';
if($i == 0){
$actives = ' active';
}
?>
<li data-category-filter="<?php echo $subq['cat_seo_url']; ?>-<?php echo $subq['catId']; ?>" class="li-sub-category<?php echo $actives; ?>"><?php echo $subq['catName']; ?></li>
<?php
$i++;
}
?>
</ul>
</div>
<div class="sub-menu-right">
<?php
$i = 0;
foreach ($subquery as $subcats) {
$actives = '';
if($i == 0){
$actives = ' active';
}
?>
<div class="sub-menu-inner filter-<?php echo $subcats['cat_seo_url']; ?>-<?php echo $subcats['catId']; ?><?php echo $actives; ?>">
<div class="row row-menu-right">
<div class="col-sm-3 menu-post-item">
<div class="post-item-image">
<a href="is-allowance-instantly-strangers-applauded">
<img src="assets/img/img_bg_md.png" data-src="uploads/images/202203/image_380x226_624239afd7295.jpg" alt="Is allowance instantly strangers applauded" class="lazyload img-responsive img-post" width="1" height="1"/>
</a>
</div>
<h3 class="title"><?php echo $subcats['cat_seo_url']; ?> Is allowance instantly strangers applauded</h3>
<p class="post-meta">
admin
<span>Mar 28, 2022</span>
<span><i class="icon-comment"></i>2</span>
<span class="m-r-0"><i class="icon-eye"></i>894</span>
</p>
</div>
</div>
</div>
<?php
$i++;
}
?>
</div>
<?php
}
?>
</li>
</ul>
</li>
<?php
} elseif ($row['cat_type'] == 'dropdown') {
echo ' <li class="nav-item"><a class="nav-link" href="' . $row["cat_seo_url"] . '">test</a></li>';
} else {
echo ' <li class="nav-item"><a class="nav-link" href="' . $row["cat_seo_url"] . '">' . $row["catName"] . '</a></li>';
}
}
}
I'm trying to help a friend with a website. I usually don't work with PHP, jquery.
The dropdown has 4 levels. The first level has 4 points. The 4 points have their own sub-levels, different for each other.
I'm trying to find them and then make them display in a dropdown, directly from the database.
And I'm stuck at the second level, with this error
Notice: Trying to get property 'subcategorie' of non-object in .....
What I've managed to do, until now:
<?php $categorii = $wpdb->get_results("SELECT DISTINCT categorie FROM catalog_rural");
?>
<?php
$subcategorie = $wpdb->get_results("SELECT DISTINCT subcategorie FROM catalog_rural WHERE categorie = 'Afaceri'");
?>
<div class="container">
<?php
foreach($categorii as $categorie) {
?>
<ul>
<li>
<a <?php if(isset($_GET['categorie']) && $categorie->categorie==$_GET['categorie']){ echo "btn-success";}else{ echo "btn-info";};?> href="<?php site_url(); ?>catalog-rural/?categorie=<?php echo urlencode($categorie->categorie); ?>"> <i class="fa fa-caret-down"></i>
<?php echo $categorie->categorie ; ?> </a>
<ul class="">
<li> <?php echo $subcategorie->subcategorie; ?>
</li>
</ul>
</li>
</ul>
</a>
Hi You need to do a foreach loop for $subcategorieas you did for $categorii. Because you are getting an array and not a object as you got for $categorii. Here I set it around the li because it seems to be the best.
<?php
$categorii = $wpdb->get_results("SELECT DISTINCT categorie FROM catalog_rural");
?>
<?php
$subcategories = $wpdb->get_results("SELECT DISTINCT subcategorie FROM catalog_rural WHERE categorie = 'Afaceri'");
?>
<div class="container">
<?php
foreach( $categorii as $categorie ) {
?>
<ul>
<li>
<a
<?php
#### What are these? Are they classnames? ####
if( isset( $_GET['categorie'] ) && $categorie->categorie==$_GET['categorie'] ){
echo "btn-success";
}else{
echo "btn-info";
};
?> href="<?php site_url(); ?>catalog-rural/?categorie=<?php echo urlencode( $categorie->categorie ); ?>">
<i class="fa fa-caret-down"></i>
<?php echo $categorie->categorie; ?>
</a>
<ul class="">
<?php foreach( $subcategories as $subcategorie ) { ?>
<li>
<a href="<?php echo site_url(); ?>/catalog-rural/?categorie=<?php echo urlencode( $_GET['categorie'] ); ?>&subcategorie=<?php echo $subcategorie->subcategorie; ?>" class="list-group-item <?php if($subcategorie->subcategorie==$_GET['subcategorie']){ echo "active";};?> ">
<?php echo $subcategorie->subcategorie; ?>
</a>
</li>
<?php } ?>
</ul>
</li>
</ul>
Not intended as a solution to your error " Trying to get property 'subcategorie' of non-object" ~ just to illustrate the invalid markup. If you use proper code indentation you would probably have been able to spot this!
<?php
$categorii = $wpdb->get_results("SELECT DISTINCT categorie FROM catalog_rural");
?>
<?php
$subcategorie = $wpdb->get_results("SELECT DISTINCT subcategorie FROM catalog_rural WHERE categorie = 'Afaceri'");
?>
<div class="container">
<?php
foreach( $categorii as $categorie ) {
?>
<ul>
<li>
<a
<?php
#### What are these? Are they classnames? ####
if( isset( $_GET['categorie'] ) && $categorie->categorie==$_GET['categorie'] ){
echo "btn-success";
}else{
echo "btn-info";
};
?> href="<?php site_url(); ?>catalog-rural/?categorie=<?php echo urlencode( $categorie->categorie ); ?>">
<i class="fa fa-caret-down"></i>
<?php echo $categorie->categorie; ?>
</a>
<ul class="">
<!-- ### Where is the opening LI? ### -->
<a href="<?php echo site_url(); ?>/catalog-rural/?categorie=<?php echo urlencode( $_GET['categorie'] ); ?>&subcategorie=<?php echo $subcategorie->subcategorie; ?>" class="list-group-item <?php if($subcategorie->subcategorie==$_GET['subcategorie']){ echo "active";};?> ">
<?php echo $subcategorie->subcategorie; ?>
</a>
</li>
</ul>
</li>
</ul>
</a><!-- ### what is this closing? ### -->
I have do a pagination with php&html,the problem is my $page is always equal 1 even I click another page and the url is already become ?page=2.The value $p cannot pass as $page.How can I solve this?
<ul class="nospace clear" style="width:1310px;">
<?php
if(isset($_GET['page'])&& $_GET['page']!=""){$page = $_GET["page"];}else{$page=1;}
$current=$page;
$end=12;
if($page=1){$start=0;$previous=$page;$next=$page+1;}
else if($page<=12){$start=$page*12-12;$previous=$page-1;$next=$page+1;}
else{$start=0;$previous=$page-1;$next=12;}
$sql = "Select * from item where Gender='women' AND Category='cloth' LIMIT $start,$end";
$result = mysqli_query($connect,$sql);
while($row=mysqli_fetch_assoc($result)){?>
<img src="../images/demo/<?php echo $row["Pic"]; ?>" style="width:300px;height:280px"><br><p></p><h3><strong><?php echo $row["Name"]; ?></strong></h3><p><?php echo $row["Description"]; ?></p></li>
<?php } ?></ul><figcaption>Page <?php echo"$page ";?> end...</figcaption>
</figure>
</div>
<nav class="pagination">
<ul>
<li>« Previous</li>
<?php
for ($p=1;$p<13;$p++){
if ($page == $p) {?>
<li class="current btn1"><strong><?php echo $p ?></strong></li><?php }
else{?><li><a href="?page=<?php echo $p ?>" class='btn1'><?php echo $p ?></a></li><?php }}?>
<li> Next » </li>
</ul>
Dynamic Header, CSS Class Change To Active USING PHP (dirrectory)
I want the class of the <li> tag to change under the active dirrectory...
now, every guide shows me how to do it when your page equals it, but i want to change
the <li> depending on what dirrectory im on
for example:
if say im on http://example.com/RESOURCES/code/opensource, or http://example.com/RESOURCES/images/clipart i want the "RESOURCES" ^^ <li> to be 'class="active"' while the rest display 'class="noactive"'
or if im on http://example.com/tutorials/css/flawless-dropdown-menu I want the "tutorials" <li> to be 'class="active"' while the rest are 'class="noactive"'
URL Setup:
This is my example of how my url's are displayed...
http://example.com/tutorials/css/flawless-dropdown-menu
^^That URL is the page of a tutorial....under the "tutorials" directory, than under the "CSS" category directory, than the page title (all of these directories are not real and are rewrites from .htaccess) [irrelevant]
Navigation Setup:
<ul id="mainnav">
<li class="noactive">Home</li>
<li class="active">Tutorials</li>
<li class="noactive">Resources</li>
<li class="noactive">Library</li>
<li class="noactive">Our Projects</li>
<li class="noactive">Community</li>
</ul>
Figured out the ANSWER...I was over thinking it.
HTML
<ul id="mainnav">
<li class="<?php if ($first_part=="") {echo "active"; } else {echo "noactive";}?>">Home</li>
<li class="<?php if ($first_part=="tutorials") {echo "active"; } else {echo "noactive";}?>">Tutorials</li>
<li class="<?php if ($first_part=="resources") {echo "active"; } else {echo "noactive";}?>">Resources</li>
<li class="<?php if ($first_part=="library") {echo "active"; } else {echo "noactive";}?>">Library</li>
<li class="<?php if ($first_part=="our-projects") {echo "active"; } else {echo "noactive";}?>">Our Projects</li>
<li class="<?php if ($first_part=="community") {echo "active"; } else {echo "noactive";}?>">Community</li>
</ul>
PHP
<?php
$directoryURI = $_SERVER['REQUEST_URI'];
$path = parse_url($directoryURI, PHP_URL_PATH);
$components = explode('/', $path);
$first_part = $components[1];
?>
header.php
$activePage = basename($_SERVER['PHP_SELF'], ".php");
nav.php
<ul>
<li class="<?= ($activePage == 'index') ? 'active':''; ?>">Home</li>
<li class="<?= ($activePage == 'tutorials') ? 'active':''; ?>">Tutorials</li>
...
Through PHP you can try -
<?php
// gets the current URI, remove the left / and then everything after the / on the right
$directory = explode('/',ltrim($_SERVER['REQUEST_URI'],'/'));
// loop through each directory, check against the known directories, and add class
$directories = array("index", "tutorials","resources","library","our-projects","community"); // set home as 'index', but can be changed based of the home uri
foreach ($directories as $folder){
$active[$folder] = ($directory[0] == $folder)? "active":"noactive";
}
?>
<ul>
<li class="<?php echo $active['index']?>">Home</li>
<li class="<?php echo $active['tutorials']?>">Tutorials</li>
<li class="<?php echo $active['resources']?>">Resources</li>
<li class="<?php echo $active['library']?>">Library</li>
<li class="<?php echo $active['our-projects']?>">Our Projects</li>
<li class="<?php echo $active['community']?>">Community</li>
</ul>
Maybe this helps you:
$(document).ready(function()
{
var parts = document.URL.split("/");
// [http:, empty, your domain, firstfolder]
var firstFolder = parts[3];
$("#mainnav li").attr("class", "noactive");
$("#mainnav a[href='/" + firstFolder + "/']").parent().attr("class", "active");
});
It's probably easier to do with jQuery but this works:
$url='http://example.com/tutorials/css/flawless-dropdown-menu';//pass the current url here instead of a static string.
$segments = explode ("/",$url);
$menuItems=array('Tutorials','Resources', 'Library', 'Our-Projects','Community');
$menu=array();
foreach ($menuItems as $menuItem) {
if($segments[3]==strtolower($menuItem)){
$menu[]=('<li class="active">'.str_replace("-"," ",$menuItem).'</li>');
} else {
$menu[]=('<li class="no-active">'.str_replace("-"," ",$menuItem).'</li>');
}
}
foreach ($menu as $item) {
echo $item.'<br />';
}
if you use mysql_fetch defined your row for menu title.
if we take your menu title is MENU in mysql database and you have to put in
(Home,tutorials,library,resources,our-projects,community)
<?php
//connect your data bass
include(connection.php');
//get your from ID like www.google?id=1
$id = $_GET['id'];
$query = "select * from pages where id='$id'";
$query1 = mysql_query($query);
while($row= mysql_fetch_array($query1))
{
?>
<html>
<?php $active= $row['MENU'];?>
<ul>
<li class="<?php if($active=='Home'){echo 'active';}else{echo'noactive';}?>">Home</li>
<li class="<?php if($active=='tutorials'){echo 'active';}else{echo'noactive';}?>">Tutorials</li>
<li class="<?php if($active=='resources'){echo 'active';}else{echo'noactive';}?>">Resources</li>
<li class="<?php if($active=='library'){echo 'active';}else{echo'noactive';}?>">Library</li>
<li class="<?php if($active=='our-projects'){echo 'active';}else{echo'noactive';}?>">Our Projects</li>
<li class="<?php if($active=='community'){echo 'active';}else{echo'noactive';}?>">Community</li>
</ul>
</html>
<?php };?>
This answer will apply if all your pages have a php extension and you want a long messy way. I put the code below on top of every php page giving each page an ID which means all pages will have an ID which is tiresome and boring and hard to track.
<?php $page = 1; ?>
Now in my header or navigation I used the code below to put the active class. You can also put an else if you want something else.
<nav id="navbar" class="navbar">
<ul>
<li class="<?php if($page == 1){ echo "active"; } ?>"><a class="url" href="index.php">Index</a></li>
<li class="<?php if($page == 2){ echo "active"; } ?>"><a class="url" href="single-post.php">Information</a></li>
<li class="<?php if($page == 3){ echo "active"; } ?>"><a class="url" href="single-post.php">Wanted</a></li>
<li class="<?php if($page == 4){ echo "active"; } ?>"><a class="url" href="single-post.php">Workshop</a></li>
<li class="<?php if($page == 5){ echo "active"; } ?>"><a class="url" href="gallery.php">Gallery</a></li>
<li class="<?php if($page == 6){ echo "active"; } ?>"><a class="url" href="featured.php">Featured</a></li>
<li class="<?php if($page == 7){ echo "active"; } ?>"><a class="url" href="contact.php">Contact Us</a></li>
</ul>
</nav>
"includes/header.php" - This goes in Top of the File
<?php
$activePage = basename($_SERVER['PHP_SELF']);
$index="";
$nosotros="";
$cursos="";
$contacto="";
switch ($activePage) {
case 'index.php':
$index=' class="current"';
break;
case 'nosotros.php':
$nosotros=' class="current"';
break;
case 'cursos.php':
$cursos=' class="current"';
break;
case 'contacto.php':
$contacto=' class="current"';
break;
default:
break;
}
?>
and this goes on the nav section
<ul>
<?php
echo '<li'.$index.'><div>Inicio</div></li>';
echo '<li'.$nosotros.'><div>Nosotros</div></li>';
echo '<li'.$cursos.'><div>Cursos</div></li>';
echo '<li><div>Academia</div></li>';
echo '<li><div>Tienda</div></li>';
echo '<li'.$contacto.'><div>Contacto</div></li>';
?>
</ul>
Try the following:
<ul class="sub-menu">
<div class="h-10"></div>
<li class="<?php if ($your_variable=="test") {echo "active"; }
else{echo"noactive";}?>">
Test
</li>
<li class="<?php if ($your_variable=="test2") {echo "active";
} else {echo"noactive";}?>">
<a href="test2.php" >Test2</a>
</li>
<li class="<?php if ($your_variable=="test3") {echo
"active"; } else {echo "noactive";}?>">
Test3
</li>
</ul>
**strong PHP text**
<?php
$directoryURI = $_SERVER['REQUEST_URI'];
$path = parse_url($directoryURI, PHP_URL_PATH);
$components = explode('/', $path);
$your_variable = basename($_SERVER['PHP_SELF'], ".php");
?>
Here we can do a simple thing also :
<li class="page-scroll <?php if(basename($_SERVER['PHP_SELF'])=="aboutus.php"){echo "active";} ?>">About us</li>
Here is another take using PHP:
<ul class="navbar-nav">
<?php
// Defines all pages in navigation
$pages = array(
'Home' => 'index.php',
'Products' => 'products.php',
'Services' => 'services.php',
'Contact' => 'contact.php',
'About' => 'about.php'
);
// Gets active page URL
$active = basename($_SERVER['PHP_SELF']);
// Loops through all pages
foreach ($pages as $title => $url) {
// Checks if active url is matched and adds active CSS class
if ($active === $url) {
echo '<li>'.$title.'</li>';
}
// Prints out default style for remaining links
else {
echo '<li>'.$title.'</li>';
}
}
?>
</ul>
$getUrl = $_SERVER['REQUEST_URL']; -> www.example.com/home.php
$getFileName = explode('/',$getUrl);
The result of $getFileName Will Be In Array ->[" ","home.php"]
$result = $getFileName[2]; //home.php
<li class="<?php if ($result=='' || $result == 'index.php') {echo 'active'; }?>"><a href='#'>Home</a></li>
<li class="<?php if ($result=='about.php') {echo 'active'; }?>"><a href='#'>About Us</a></li>
<li class="<?php if ($result=='contact.php') {echo 'active'; }?>"><a href='#'>Contact Us</a></li>
You can use str_replace for this.
$path = $_SERVER['REQUEST_URI'];
$active = str_replace('/','', $path);
<ul>
<li class="nav-item <?php if($active == '' || $active == 'index.php'){echo 'active';}?>">
<a class="nav-link" href="index.php">HOME</a>
</li>
<li class="nav-item <?php if($active == 'about.php'){echo 'active';}?>">
<a class="nav-link" href="about.php">ABOUT US</a>
</li>
</ul>
<?php $request_uri= $_SERVER['REQUEST_URI'];?>
<ul>
<li class="<?php if((strpos($request_uri,"index.html")!==false) || $request_uri=="" || $request_uri=="/"){echo "selected";}?>">Home</li>
<li class="<?php if((strpos($request_uri,"service")!==false)){echo "selected";}?>">Services </li>
<li class="<?php if((strpos($request_uri,"product")!==false)){echo "selected";}?>">Products</li>
<li class="<?php if((strpos($request_uri,"blog")!==false)){echo "selected";}?>">Blog</li>
<li class="<?php if((strpos($request_uri,"question")!==false)){echo "selected";}?>">Ques & Ans</li>
<li class="<?php if((strpos($request_uri,"career")!==false)){echo "selected";}?>">Career</li>
<li class="<?php if((strpos($request_uri,"about-us")!==false)){echo "selected";}?>">About</li>
</ul>
<div class="menu clearfix">
<ul>
<li>start</li>
<li>rating</li>
<li>upload</li>
</ul>
Was a while since i used php. Is there any smart way to do a foreach in php and render this menu + an "active" class to the clicked link. So if the active page is "rating", the html would render:
<div class="menu clearfix">
<ul>
<li>start</li>
<li>rating</li>
<li>upload</li>
</ul>
Thanks
Assuming the $_GET value of p would be rating (or any other link in the menu for that matter), one could do something like this:
<?php
echo "<div class=\"menu clearfix\">";
echo "<ul>";
$links = array('rating', 'upload', 'about');
foreach ($links as $link) {
$active = "";
if (!empty($_GET['p']) && $link == $_GET['p']){
$active = 'class="active"';
}
echo "<li><a href=\"./?p=$link\" $active>$link</a></li>";
}
echo "</ul></div>"
?>
As far as I understand you want to know which li is active after request.
If it is - you have to get $_GET parameter smth like $_GET['p'].
And do rendering, smth like:
foreach($ul as $li)
{
if ($_GET['p'] == $li->code)
echo 'class="active"';
}
For example:
<div class="menu clearfix">
<ul>
<?php foreach($ul as $li): ?>
<li><a href="<?php echo $li->url;?>" <?php echo $_GET['p']==$li->get ? class="active" : ''?>><?php echo $li->name;?></a></li>
<?php endforeach; ?>
</ul>
<ul class="sub-nav" >
<?php
$full_name = $_SERVER['PHP_SELF'];
$name_array = explode('/',$full_name);
$count = count($name_array);
$page_name = $name_array[$count-1];
?>
<li><a class="<?php echo ($page_name=='where-to-buy.php')?'active':'';?>" href="where-to-buy.php">WHERE TO BUY</a></li>
<li><a class="<?php echo ($page_name=='about.php')?'active':'';?>" href="about.php">ABOUT US</a></li>
<li><a class="<?php echo ($page_name=='contact.php')?'active':'';?>" href="contact.php">CONTACT US</a></li>
Please follow below URL to live demo...
https://webdesignerhut.com/active-class-navigation-menu/