Elementordan bir tema aldım kendimi geliştirmek için, header kısmında menüler var.
HTML Kodu bu:
<!-- Start header -->
<header id="header">
<div class="wpo-site-header wpo-header-style-4">
<nav class="navigation navbar navbar-expand-lg navbar-light">
<div class="container-fluid">
<div class="row align-items-center">
<div class="col-lg-3 col-md-3 col-3 d-lg-none dl-block">
<div class="mobail-menu">
<button type="button" class="navbar-toggler open-btn">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar first-angle"></span>
<span class="icon-bar middle-angle"></span>
<span class="icon-bar last-angle"></span>
</button>
</div>
</div>
<div class="col-lg-2 col-md-6 col-6">
<div class="navbar-header">
<a class="navbar-brand logo" href="index.html"><img src="assets/images/logo2.svg"
alt=""></a>
</div>
</div>
<div class="col-lg-9 col-md-2 col-1">
<div id="navbar" class="collapse navbar-collapse navigation-holder">
<button class="menu-close"><i class="ti-close"></i></button>
<ul class="nav navbar-nav mb-2 mb-lg-0">
<li class="menu-item-has-children">
<a href="#">Home</a>
<ul class="sub-menu">
<li><a href="index.html">Home Style 1</a></li>
<li><a href="index-2.html">Home Style 2</a></li>
<li><a href="index-3.html">Home Style 3</a></li>
<li><a href="index-4.html">Home Style 4</a></li>
<li><a href="index-5.html">Home Style 5</a></li>
</ul>
</li>
<li><a class="active" href="about.html">About</a></li>
<li class="menu-item-has-children">
<a href="service.html">Service</a>
<ul class="sub-menu">
<li><a href="service.html">Service</a></li>
<li><a href="service-single.html">Service Single</a></li>
</ul>
</li>
<li class="menu-item-has-children">
<a href="project.html">Project</a>
<ul class="sub-menu">
<li><a href="project.html">Project</a></li>
<li><a href="project-single.html">Project Single</a></li>
</ul>
</li>
<li class="menu-item-has-children">
<a href="blog.html">Blog</a>
<ul class="sub-menu">
<li><a href="blog.html">Blog right sidebar</a></li>
<li><a href="blog-left-sidebar.html">Blog left sidebar</a></li>
<li><a href="blog-fullwidth.html">Blog fullwidth</a></li>
<li class="menu-item-has-children">
<a href="#">Blog details</a>
<ul class="sub-menu">
<li><a href="blog-single.html">Blog details right
sidebar</a>
</li>
<li><a href="blog-single-left-sidebar.html">Blog details
left
sidebar</a></li>
<li><a href="blog-single-fullwidth.html">Blog details
fullwidth</a></li>
</ul>
</li>
</ul>
</li>
<li class="menu-item-has-children">
<a href="#">Pages</a>
<ul class="sub-menu">
<li><a href="shop.html">Shop</a></li>
<li><a href="shop-single.html">Shop Single</a></li>
<li><a href="cart.html">Cart</a></li>
<li><a href="wishlist.html">Wishlist</a></li>
<li><a href="checkout.html">Checkout</a></li>
<li><a href="pricing.html">Pricing</a></li>
<li><a href="team-single.html">Team Single</a></li>
<li><a href="404.html">404 Error</a></li>
</ul>
</li>
<li><a href="contact.html">Contact</a></li>
</ul>
</div><!-- end of nav-collapse -->
</div>
<div class="col-lg-1 col-md-1 col-2">
<div class="header-right">
<div class="header-right-menu-wrapper">
<div class="header-right-menu">
<div class="right-menu-toggle-btn">
<span></span>
<span></span>
<span></span>
</div>
<div class="header-right-menu-wrap">
<button class="right-menu-close"><i class="ti-close"></i></button>
<div class="logo"><img src="assets/images/logo2.svg" alt=""></div>
<div class="header-right-sec">
<div class="project-widget widget">
<h3>Our Latest Projects</h3>
<ul>
<li><a href="project-single.html"><img
src="assets/images/projects/1.jpg" alt=""></a></li>
<li><a href="project-single.html"><img
src="assets/images/projects/2.jpg" alt=""></a></li>
<li><a href="project-single.html"><img
src="assets/images/projects/3.jpg" alt=""></a></li>
<li><a href="project-single.html"><img
src="assets/images/projects/4.jpg" alt=""></a></li>
<li><a href="project-single.html"><img
src="assets/images/projects/6.jpg" alt=""></a></li>
<li><a href="project-single.html"><img
src="assets/images/projects/7.jpg" alt=""></a></li>
</ul>
</div>
<div class="widget wpo-contact-widget">
<div class="widget-title">
<h3>Contact Us</h3>
</div>
<div class="contact-ft">
<ul>
<li><i class="fi flaticon-location"></i>68D, Belsion Town
2365 <br> Fna city, LH 3656, USA</li>
<li><i class="fi flaticon-telephone"></i>+ 8 (123) 123 456
789 <br>
+ 8 (123) 123 456 789</li>
<li><i class="fi flaticon-email"></i>arkio@gmail.com</li>
</ul>
</div>
</div>
<div class="widget newsletter-widget">
<div class="widget-title">
<h3>Newsletter</h3>
</div>
<form>
<div class="input-1">
<input type="email" class="form-control"
placeholder="Email Address *" required="">
<div class="submit clearfix">
<button type="submit"><i class="ti-email"></i></button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div><!-- end of container -->
</nav>
</div>
</header>Kod temelde arka plan menüde siyah bir çerçeve içinde yayınlanıyor, yönetim panelinden veri alan header bu ; <!-- Header Start -->
<header id="header">
<div class="wpo-site-header header-style-1">
<nav class="navigation navbar navbar-expand-lg navbar-light">
<div class="container-fluid">
<div class="row align-items-center">
<div class="col-lg-3 col-md-3 col-3 d-lg-none dl-block">
<div class="mobail-menu">
<button type="button" class="navbar-toggler open-btn">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar first-angle"></span>
<span class="icon-bar middle-angle"></span>
<span class="icon-bar last-angle"></span>
</button>
</div>
</div>
<div class="col-lg-2 col-md-6 col-6">
<div class="navbar-header">
<a class="navbar-brand logo" href="index.html">
<img src="assets/images/logo.svg" alt="">
</a>
</div>
</div>
<div class="col-lg-8 col-md-1 col-1">
<div id="navbar" class="collapse navbar-collapse navigation-holder">
<button class="menu-close"><i class="ti-close"></i></button>
<?php echo renderMenu($menuItems); ?>
</div>
</div>
<div class="col-lg-2 col-md-2 col-2">
<div class="header-right">
<div class="header-search-form-wrapper">
<div class="cart-search-contact">
<button class="search-toggle-btn">
<i class="fi flaticon-search"></i>
</button>
<div class="header-search-form">
<form>
<div>
<input type="text" class="form-control" placeholder="Arama...">
<button type="submit"><i class="fi flaticon-search"></i></button>
</div>
</form>
</div>
</div>
</div>
<?php if(isset($_SESSION['cart']) && count($_SESSION['cart']) > 0): ?>
<div class="mini-cart">
<button class="cart-toggle-btn">
<i class="fi flaticon-shopping-cart"></i>
<span class="cart-count"><?php echo count($_SESSION['cart']); ?></span>
</button>
<div class="mini-cart-content">
<button class="mini-cart-close"><i class="ti-close"></i></button>
<div class="mini-cart-items">
<?php foreach($_SESSION['cart'] as $cartItem): ?>
<div class="mini-cart-item clearfix">
<div class="mini-cart-item-image">
<a href="<?php echo $cartItem['url']; ?>">
<img src="<?php echo $cartItem['image']; ?>" alt="<?php echo $cartItem['name']; ?>">
</a>
</div>
<div class="mini-cart-item-des">
<a href="<?php echo $cartItem['url']; ?>"><?php echo $cartItem['name']; ?></a>
<span class="mini-cart-item-price"><?php echo $cartItem['price']; ?> x <?php echo $cartItem['quantity']; ?></span>
<span class="mini-cart-item-quantity">
<a href="#" class="remove-item" data-id="<?php echo $cartItem['id']; ?>">
<i class="ti-close"></i>
</a>
</span>
</div>
</div>
<?php endforeach; ?>
</div>
<div class="mini-cart-action clearfix">
<span class="mini-checkout-price">Toplam:
<span><?php echo number_format($cartTotal, 2); ?> TL</span>
</span>
<div class="mini-btn">
<a href="checkout.php" class="view-cart-btn s1">Ödeme</a>
<a href="cart.php" class="view-cart-btn">Sepet</a>
</div>
</div>
</div>
</div>
<?php endif; ?>
</div>
</div>
</div>
</div>
</nav>
</div>
</header>Header'e arka planı siyah olacak şekilde oturtamadım, nerede hata yapıyorum acaba?Teşekkürler.
