php form to email, no working knowledge of PHP - php

I have no knowledge of PHP at all and am in desperate need of help. I have trawled the web for working examples but none of them are working for me. I need to send the data in the form to an email. I have 3 php files: index.php, contact.php and thank-you.php. Both the index and the contact page have forms on them and after sending the user is directed to the thank-you.php page. I am using localhost (MAMP) but i have also uploaded the website to this domain. Please tell me what I am doing wrong. The following code is located in the contact.php file:
<!DOCTYPE html>
<html lang="en">
<head>
<title> Legal Active - Contact Us </title>
<!-- Required meta tags always come first -->
<meta charset="utf-8">
<meta name="description" content="Index">
<meta name="keywords" content="personal inury specialist, accident,
accident claims, claim, personal injury, claim today,">
<meta name="author" content="Sukhvir Singh">
<meta name="viewport" content="width=device-width, initial-scale=1,
shrink-to-fit=no">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<!-- Bootstrap CSS -->
<link rel="stylesheet" type="text/css" href="../../css/main.css">
<!-- Animate.css -->
<link rel="stylesheet" type="text/css"
href="../../css/animate.css-master/animate.min.css">
<!-- Favicon -->
<link rel='shortcut icon' href='favicon.png' type='image/x-icon'/>
<script src="http://localhost:35729/livereload.js"></script>
</head>
<body>
<!-- Header Navbar -->
<nav class="navbar navbar-header-custom navbar-header-bg-custom">
<ul class="navbar-header-icon nav navbar-nav pull-md-left">
<li class="nav-item">
<a class="nav-link navbar-header-link hidden-dm-down"
href="#">
<i class="navbar-header-link__icon--lg fa fa-facebook" aria-hidden="true"></i>
</a>
</li>
<li class="nav-item">
<a class="nav-link navbar-header-link hidden-sm-down" href="https://twitter.com/search?src=typd&q=legal%20active%20ltd">
<i class="navbar-header-link__icon--lg fa fa-twitter" aria-hidden="true"></i>
</a>
</li>
<li class="nav-item">
<a class="nav-link navbar-header-link hidden-sm-down" href="#">
<i class="navbar-header-link__icon--lg fa fa-instagram" aria-hidden="true"></i>
</a>
</li>
</ul>
<ul class="nav navbar-nav pull-xs-right">
<li class="nav-item hidden-md-up">
<h5 class="navbar-header-link nav-link navbar-header-link--span"> Have a Question? </h5>
<a class="nav-link navbar-header-link" href="tel:01618852353"> Call us NOW
<i class="navbar-header-link__icon fa fa-phone" aria-hidden="true"> </i> 0161 885 2353
</a>
</li>
<li class="nav-item hidden-sm-down">
<h5 class="navbar-header-link nav-link navbar-header-link--lg--span"> Have a Question? </h5>
<a class="nav-link navbar-header-link navbar-header-link--lg" href="tel:01618852353"> Call us NOW
<i class="navbar-header-link__icon--lg fa fa-phone" aria-hidden="true"> </i> 0161 885 2353
</a>
</li>
</ul>
</nav>
<!-- Navbar -->
<nav class="navbar navbar-custom bg-custom">
<button class="navbar-toggler hidden-md-up" type="button" data-toggle="collapse" data-target="#exCollapsingNavbar4" aria-controls="exCollapsingNavbar2" aria-expanded="false" aria-label="Toggle navigation">
<i class="navbar__icon fa fa-bars" aria-hidden="true"></i>
</button>
<div class="collapse navbar-toggleable-sm" id="exCollapsingNavbar4">
<ul class="nav navbar-nav pull-xs-left col-xs-12">
<li class="nav-item active col-xs-12 col-md-2 offset-md-1">
<a class="nav-link" href="index.php"> HOME </a>
</li>
<li class="nav-item btn-group col-xs-12 col-md-3">
<div class="dropdown">
<button class="btn dropdown-toggle nav-link" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
TYPES OF CLAIMS
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<a class="dropdown-item" href="road-traffic-accident.html"> ROAD TRAFFIC ACCIDENTS </a>
<a class="dropdown-item" href="Slips-Trips-and-Falls.html"> SLIPS TRIPS & FALLS </a>
<a class="dropdown-item" href="accident-at-work.html"> ACCIDENT AT WORK <span class="sr-only">(current)</span> </a>
</div>
</div>
</li>
<li class="nav-item col-xs-12 col-md-3">
<a class="nav-link" href="work-with-us.html"> WORK WITH US </a>
</li>
<li class="nav-item col-xs-12 col-md-1">
<a class="nav-link" href="#"> CONTACT </a>
</li>
<li class="nav-item col-xs-12">
<a class="nav-link hidden-md-up" href="#">
<i class="nav-link__icon fa fa-facebook" aria-hidden="true"></i>
</a>
</li>
<li class="nav-item col-xs-12">
<a class="nav-link hidden-md-up" href="https://twitter.com/search?src=typd&q=legal%20active%20ltd">
<i class="nav-link__icon fa fa-twitter" aria-hidden="true"></i>
</a>
</li>
<li class="nav-item col-xs-12">
<a class="nav-link hidden-md-up" href="#">
<i class="nav-link__icon fa fa-instagram" aria-hidden="true"></i>
</a>
</li>
</ul>
</div>
</nav>
<div class="container">
<div class="row">
<div class="contact">
<h3 class="contact__h3"> CONTACT US </h3>
<div class="contact__divider"> </div>
<div class="contact__text col-xs-12 col-md-5">
Please use the form to tell us what you are enquiring about and somebody from our team will call you shortly.
</div>
<div class="contact__form form col-xs-12 col-md-5 offset-md-1">
<form class="form-group" id="contact__form" action="thank-you.php" method="POST">
<input type="text" class="input form-control fullName" placeholder="Full Name" name="fullName">
<input type="tel" class="input form-control number tel" placeholder="Contact Number" name="contactNumber">
<input type="text" class="input form-control email" placeholder="Email Address" name="email">
<textarea class="input col-xs-12 message" placeholder="Your Message" name="message"></textarea>
<button type="submit" class="form__btn btn btn-secondary"> SEND </button>
</form>
</div>
</div>
</div>
</div>
<!-- Footer -->
<div class="container-fluid">
<div class="container-fluid">
<div class="row">
<nav class="navbar bg-footer">
<ul class="nav navbar-nav footer__nav">
<img class="footer__nav__logo col-xs-4 col-md-4 col-lg-3 pull-xs-right pull-md-left" src="../../assets/legal-active-logo-large.png" alt="Logo"/>
<li class="footer__nav-item nav-item col-xs-12 col-md-5 pull-xs-right"> Legal Active</li>
<li class="footer__nav-item nav-item col-xs-12 col-md-5 pull-xs-right"> Magnus House, 8 Ashfield Road, Cheadle, Cheshire, SK8 1BB </li>
<li class="footer__nav-item nav-item col-xs-12 col-md-5 pull-xs-right"> Registered in England & Wales - Company No. 123 4567</li>
<li class="footer__nav-item nav-item col-xs-12 col-md-12 col-lg-5 pull-xs-right"> All Rights Reserved © Legal Active </li>
</ul>
</nav>
</div>
</div>
<!-- jQuery first, then Tether, then Bootstrap JS. -->
<script src="../../scss/bootstrap-4/js/tests/vendor/jquery.min.js"></script>
<script src="../../scss/bootstrap-4/js/tests/vendor/tether.min.js"></script>
<script src="../../scss/bootstrap-4/dist/js/bootstrap.min.js"></script>
<script src="../../js/custom-js.js"></script>
</body>
</html>
I have now removed the php code from contact.php to thank-you.php.
Here is the code located in than-you.php:
<?php
$to_mail = "sukhy87#me.com";
$mail_sent = 0;
if(isset($_POST['submit'])){
echo "the form was submitted";
$name = trim(strip_tags($_POST['fullName']));
if($name == "")
$error = true;
$email = trim(strip_tags($_POST['email']));
if($email == "")
$error = true;
$phone = trim(strip_tags($_POST['tel']));
$message = trim(strip_tags($_POST['message']));
if($error != true){
$header = 'From: "Legal Active Website" <no-replylegalactive.co.uk>'."\r\n";
$subject = "New Enquiry";
$message = "New Contact message, received from: <br /> \n ";
$message .= "<b>Name</b> ".$name."<br /> \n";
$message .= "<b>Email</b> ".$email."<br /> \n";
$message .= "<b>Phone</b> ".$phone."<br /> \n";
$message .= "<b>message</b> ".$message."<br /> \n";
if(#mail($to_mail,$subject,$message,$header))
{
echo "mail sent";
$mail_sent = 1;
}
else echo "mail not sent";
} else {
echo 'validation error';
}
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<title> Legal Active - Contact Us </title>
<!-- Required meta tags always come first -->
<meta charset="utf-8">
<meta name="description" content="Index">
<meta name="keywords" content="personal inury specialist, accident, accident claims, claim, personal injury, claim today,">
<meta name="author" content="Sukhvir Singh">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<!-- Bootstrap CSS -->
<link rel="stylesheet" type="text/css" href="../../css/main.css">
<!-- Animate.css -->
<link rel="stylesheet" type="text/css" href="../../css/animate.css-master/animate.min.css">
<!-- Favicon -->
<link rel='shortcut icon' href='favicon.png' type='image/x-icon'/>
<script src="http://localhost:35729/livereload.js"></script>
</head>
<body>
<!-- Header Navbar -->
<nav class="navbar navbar-header-custom navbar-header-bg-custom">
<ul class="navbar-header-icon nav navbar-nav pull-md-left">
<li class="nav-item">
<a class="nav-link navbar-header-link hidden-sm-down" href="#">
<i class="navbar-header-link__icon--lg fa fa-facebook" aria-hidden="true"></i>
</a>
</li>
<li class="nav-item">
<a class="nav-link navbar-header-link hidden-sm-down" href="https://twitter.com/search?src=typd&q=legal%20active%20ltd">
<i class="navbar-header-link__icon--lg fa fa-twitter" aria-hidden="true"></i>
</a>
</li>
<li class="nav-item">
<a class="nav-link navbar-header-link hidden-sm-down" href="#">
<i class="navbar-header-link__icon--lg fa fa-instagram" aria-hidden="true"></i>
</a>
</li>
</ul>
<ul class="nav navbar-nav pull-xs-right">
<li class="nav-item hidden-md-up">
<h5 class="navbar-header-link nav-link navbar-header-link--span"> Have a Question? </h5>
<a class="nav-link navbar-header-link" href="tel:01618852353"> Call us NOW
<i class="navbar-header-link__icon fa fa-phone" aria-hidden="true"> </i> 0161 885 2353
</a>
</li>
<li class="nav-item hidden-sm-down">
<h5 class="navbar-header-link nav-link navbar-header-link--lg--span"> Have a Question? </h5>
<a class="nav-link navbar-header-link navbar-header-link--lg" href="tel:01618852353"> Call us NOW
<i class="navbar-header-link__icon--lg fa fa-phone" aria-hidden="true"> </i> 0161 885 2353
</a>
</li>
</ul>
</nav>
<!-- Navbar -->
<nav class="navbar navbar-custom bg-custom">
<button class="navbar-toggler hidden-md-up" type="button" data-toggle="collapse" data-target="#exCollapsingNavbar4" aria-controls="exCollapsingNavbar2" aria-expanded="false" aria-label="Toggle navigation">
<i class="navbar__icon fa fa-bars" aria-hidden="true"></i>
</button>
<div class="collapse navbar-toggleable-sm" id="exCollapsingNavbar4">
<ul class="nav navbar-nav pull-xs-left col-xs-12">
<li class="nav-item active col-xs-12 col-md-2 offset-md-1">
<a class="nav-link" href="index.php"> HOME </a>
</li>
<li class="nav-item btn-group col-xs-12 col-md-3">
<div class="dropdown">
<button class="btn dropdown-toggle nav-link" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
TYPES OF CLAIMS
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<a class="dropdown-item" href="road-traffic-accident.html"> ROAD TRAFFIC ACCIDENTS </a>
<a class="dropdown-item" href="Slips-Trips-and-Falls.html"> SLIPS TRIPS & FALLS </a>
<a class="dropdown-item" href="accident-at-work.html"> ACCIDENT AT WORK <span class="sr-only">(current)</span> </a>
</div>
</div>
</li>
<li class="nav-item col-xs-12 col-md-3">
<a class="nav-link" href="work-with-us.html"> WORK WITH US </a>
</li>
<li class="nav-item col-xs-12 col-md-1">
<a class="nav-link" href="contact.php"> CONTACT </a>
</li>
<li class="nav-item col-xs-12">
<a class="nav-link hidden-md-up" href="#">
<i class="nav-link__icon fa fa-facebook" aria-hidden="true"></i>
</a>
</li>
<li class="nav-item col-xs-12">
<a class="nav-link hidden-md-up" href="https://twitter.com/search?src=typd&q=legal%20active%20ltd">
<i class="nav-link__icon fa fa-twitter" aria-hidden="true"></i>
</a>
</li>
<li class="nav-item col-xs-12">
<a class="nav-link hidden-md-up" href="#">
<i class="nav-link__icon fa fa-instagram" aria-hidden="true"></i>
</a>
</li>
</ul>
</div>
</nav>
<div class="container">
<div class="row">
<div class="submitMessage col-xs-12">
<h5 class="submitMessage__h5 h5"> THANK YOU </h5>
<p class="submitMessage__p p"> A member of our team will be in touch with you shortly </p>
<a class="submitMessage__link link" href="index.php"> Back to homepage </a>
</div>
</div>
</div>
<!-- Footer -->
<div class="container-fluid">
<div class="container-fluid">
<div class="row">
<nav class="navbar bg-footer">
<ul class="nav navbar-nav footer__nav">
<img class="footer__nav__logo col-xs-4 col-md-4 col-lg-3 pull-xs-right pull-md-left" src="../../assets/legal-active-logo-large.png" alt="Logo"/>
<li class="footer__nav-item nav-item col-xs-12 col-md-5 pull-xs-right"> Legal Active</li>
<li class="footer__nav-item nav-item col-xs-12 col-md-5 pull-xs-right"> Magnus House, 8 Ashfield Road, Cheadle, Cheshire, SK8 1BB </li>
<li class="footer__nav-item nav-item col-xs-12 col-md-5 pull-xs-right"> Registered in England & Wales - Company No. 123 4567</li>
<li class="footer__nav-item nav-item col-xs-12 col-md-12 col-lg-5 pull-xs-right"> All Rights Reserved © Legal Active </li>
</ul>
</nav>
</div>
</div>
<!-- jQuery first, then Tether, then Bootstrap JS. -->
<script src="../../scss/bootstrap-4/js/tests/vendor/jquery.min.js"></script>
<script src="../../scss/bootstrap-4/js/tests/vendor/tether.min.js"></script>
<script src="../../scss/bootstrap-4/dist/js/bootstrap.min.js"></script>
<script src="../../js/custom-js.js"></script>
</body>
</html>

Related

My template is not working on my back/agence page

I am trying to make my template works on my index page but it's not showing although it shows on a page that I create called /back. Here is my index page (agence/index.html.twig):
{% extends 'base-back.html.twig' %}
{% block title %}Agence index{% endblock %}
{% block body %}
<h1>Agence index</h1>
<table class="table">
<thead>
<tr>
<th>Id</th>
<th>Name</th>
<th>Adress</th>
<th>Phone</th>
<th>Email</th>
<th>actions</th>
</tr>
</thead>
<tbody>
{% for agence in agences %}
<tr>
<td>{{ agence.id }}</td>
<td>{{ agence.name }}</td>
<td>{{ agence.adress }}</td>
<td>{{ agence.phone }}</td>
<td>{{ agence.email }}</td>
<td>
show
edit
</td>
</tr>
{% else %}
<tr>
<td colspan="6">no records found</td>
</tr>
{% endfor %}
</tbody>
</table>
Create new
{% endblock %}
This the page where the template works (back/index.html.twing):
{% extends 'base-back.html.twig' %}
And this is the base-back where to find my template's base (base-back.html.twing)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<title>A+BFB</title>
<meta content="" name="description">
<meta content="" name="keywords">
<!-- Favicons -->
<link href="img/favicon.png" rel="icon">
<link href="img/apple-touch-icon.png" rel="apple-touch-icon">
<!-- Google Fonts -->
<link href="https://fonts.gstatic.com" rel="preconnect">
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Nunito:300,300i,400,400i,600,600i,700,700i|Poppins:300,300i,400,400i,500,500i,600,600i,700,700i" rel="stylesheet">
<!-- Vendor CSS Files -->
<link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
<link href="vendor/boxicons/css/boxicons.min.css" rel="stylesheet">
<link href="vendor/quill/quill.snow.css" rel="stylesheet">
<link href="vendor/quill/quill.bubble.css" rel="stylesheet">
<link href="vendor/remixicon/remixicon.css" rel="stylesheet">
<link href="vendor/simple-datatables/style.css" rel="stylesheet">
<!-- Template Main CSS File -->
<link href="css/style.css" rel="stylesheet">
<link href="{{ asset ('assets/style.css')}}" rel="stylesheet">
<!-- =======================================================
* Template Name: NiceAdmin - v2.5.0
* Template URL: https://bootstrapmade.com/nice-admin-bootstrap-admin-html-template/
* Author: BootstrapMade.com
* License: https://bootstrapmade.com/license/
======================================================== -->
</head>
<body>
<!-- ======= Header ======= -->
<header id="header" class="header fixed-top d-flex align-items-center">
<div class="d-flex align-items-center justify-content-between">
<a href="index.html" class="logo d-flex align-items-center">
<img src="img/logo.png" alt="">
<span class="d-none d-lg-block">A+BFB</span>
</a>
<i class="bi bi-list toggle-sidebar-btn"></i>
</div><!-- End Logo -->
<div class="search-bar">
<form class="search-form d-flex align-items-center" method="POST" action="#">
<input type="text" name="query" placeholder="Search" title="Enter search keyword">
<button type="submit" title="Search"><i class="bi bi-search"></i></button>
</form>
</div><!-- End Search Bar -->
<nav class="header-nav ms-auto">
<ul class="d-flex align-items-center">
<li class="nav-item d-block d-lg-none">
<a class="nav-link nav-icon search-bar-toggle " href="#">
<i class="bi bi-search"></i>
</a>
</li><!-- End Search Icon-->
<li class="nav-item dropdown">
<a class="nav-link nav-icon" href="#" data-bs-toggle="dropdown">
<i class="bi bi-bell"></i>
<span class="badge bg-primary badge-number">4</span>
</a><!-- End Notification Icon -->
<ul class="dropdown-menu dropdown-menu-end dropdown-menu-arrow notifications">
<li class="dropdown-header">
You have 4 new notifications
<span class="badge rounded-pill bg-primary p-2 ms-2">View all</span>
</li>
<li>
<hr class="dropdown-divider">
</li>
<li class="notification-item">
<i class="bi bi-exclamation-circle text-warning"></i>
<div>
<h4>Lorem Ipsum</h4>
<p>Quae dolorem earum veritatis oditseno</p>
<p>30 min. ago</p>
</div>
</li>
<li>
<hr class="dropdown-divider">
</li>
<li class="notification-item">
<i class="bi bi-x-circle text-danger"></i>
<div>
<h4>Atque rerum nesciunt</h4>
<p>Quae dolorem earum veritatis oditseno</p>
<p>1 hr. ago</p>
</div>
</li>
<li>
<hr class="dropdown-divider">
</li>
<li class="notification-item">
<i class="bi bi-check-circle text-success"></i>
<div>
<h4>Sit rerum fuga</h4>
<p>Quae dolorem earum veritatis oditseno</p>
<p>2 hrs. ago</p>
</div>
</li>
<li>
<hr class="dropdown-divider">
</li>
<li class="notification-item">
<i class="bi bi-info-circle text-primary"></i>
<div>
<h4>Dicta reprehenderit</h4>
<p>Quae dolorem earum veritatis oditseno</p>
<p>4 hrs. ago</p>
</div>
</li>
<li>
<hr class="dropdown-divider">
</li>
<li class="dropdown-footer">
Show all notifications
</li>
</ul><!-- End Notification Dropdown Items -->
</li><!-- End Notification Nav -->
<li class="nav-item dropdown">
<a class="nav-link nav-icon" href="#" data-bs-toggle="dropdown">
<i class="bi bi-chat-left-text"></i>
<span class="badge bg-success badge-number">3</span>
</a><!-- End Messages Icon -->
<ul class="dropdown-menu dropdown-menu-end dropdown-menu-arrow messages">
<li class="dropdown-header">
You have 3 new messages
<span class="badge rounded-pill bg-primary p-2 ms-2">View all</span>
</li>
<li>
<hr class="dropdown-divider">
</li>
<li class="message-item">
<a href="#">
<img src="img/messages-1.jpg" alt="" class="rounded-circle">
<div>
<h4>Maria Hudson</h4>
<p>Velit asperiores et ducimus soluta repudiandae labore officia est ut...</p>
<p>4 hrs. ago</p>
</div>
</a>
</li>
<li>
<hr class="dropdown-divider">
</li>
<li class="message-item">
<a href="#">
<img src="img/messages-2.jpg" alt="" class="rounded-circle">
<div>
<h4>Anna Nelson</h4>
<p>Velit asperiores et ducimus soluta repudiandae labore officia est ut...</p>
<p>6 hrs. ago</p>
</div>
</a>
</li>
<li>
<hr class="dropdown-divider">
</li>
<li class="message-item">
<a href="#">
<img src="img/messages-3.jpg" alt="" class="rounded-circle">
<div>
<h4>David Muldon</h4>
<p>Velit asperiores et ducimus soluta repudiandae labore officia est ut...</p>
<p>8 hrs. ago</p>
</div>
</a>
</li>
<li>
<hr class="dropdown-divider">
</li>
<li class="dropdown-footer">
Show all messages
</li>
</ul><!-- End Messages Dropdown Items -->
</li><!-- End Messages Nav -->
<li class="nav-item dropdown pe-3">
<a class="nav-link nav-profile d-flex align-items-center pe-0" href="#" data-bs-toggle="dropdown">
<img src="img/profile-img.jpg" alt="Profile" class="rounded-circle">
<span class="d-none d-md-block dropdown-toggle ps-2">K. Anderson</span>
</a><!-- End Profile Iamge Icon -->
<ul class="dropdown-menu dropdown-menu-end dropdown-menu-arrow profile">
<li class="dropdown-header">
<h6>Kevin Anderson</h6>
<span>Web Designer</span>
</li>
<li>
<hr class="dropdown-divider">
</li>
<li>
<a class="dropdown-item d-flex align-items-center" href="users-profile.html">
<i class="bi bi-person"></i>
<span>My Profile</span>
</a>
</li>
<li>
<hr class="dropdown-divider">
</li>
<li>
<a class="dropdown-item d-flex align-items-center" href="users-profile.html">
<i class="bi bi-gear"></i>
<span>Account Settings</span>
</a>
</li>
<li>
<hr class="dropdown-divider">
</li>
<li>
<a class="dropdown-item d-flex align-items-center" href="pages-faq.html">
<i class="bi bi-question-circle"></i>
<span>Need Help?</span>
</a>
</li>
<li>
<hr class="dropdown-divider">
</li>
<li>
<a class="dropdown-item d-flex align-items-center" href="#">
<i class="bi bi-box-arrow-right"></i>
<span>Sign Out</span>
</a>
</li>
</ul><!-- End Profile Dropdown Items -->
</li><!-- End Profile Nav -->
</ul>
</nav><!-- End Icons Navigation -->
</header>
<aside id="sidebar" class="sidebar">
<ul class="sidebar-nav" id="sidebar-nav">
<li class="nav-item">
<a class="nav-link " href="index.html">
<i class="bi bi-grid"></i>
<span>Dashboard</span>
</a>
</li><!-- End Dashboard Nav -->
<li class="nav-item">
<a class="nav-link collapsed" data-bs-target="#components-nav" data-bs-toggle="collapse" href="#">
<i class="bi bi-menu-button-wide"></i><span>Rendez-vous</span><i class="bi bi-chevron-down ms-auto"></i>
</a>
<ul id="components-nav" class="nav-content collapse " data-bs-parent="#sidebar-nav">
<li>
<a href="components-alerts.html">
<i class="bi bi-circle"></i><span>Alerts</span>
</a>
</li>
<li>
<a href="components-accordion.html">
<i class="bi bi-circle"></i><span>Accordion</span>
</a>
</li>
<li>
<a href="components-badges.html">
<i class="bi bi-circle"></i><span>Badges</span>
</a>
</li>
</ul>
</li><!-- End Components Nav -->
<li class="nav-item">
<a class="nav-link collapsed" data-bs-target="#forms-nav" data-bs-toggle="collapse" href="#">
<i class="bi bi-journal-text"></i><span>Compte</span><i class="bi bi-chevron-down ms-auto"></i>
</a>
<ul id="forms-nav" class="nav-content collapse " data-bs-parent="#sidebar-nav">
<li>
<a href="forms-elements.html">
<i class="bi bi-circle"></i><span>Form Elements</span>
</a>
</li>
<li>
<a href="forms-layouts.html">
<i class="bi bi-circle"></i><span>Form Layouts</span>
</a>
</li>
</ul>
</li><!-- End Forms Nav -->
<li class="nav-item">
<a class="nav-link collapsed" data-bs-target="#tables-nav" data-bs-toggle="collapse" href="#">
<i class="bi bi-layout-text-window-reverse"></i><span>Offre</span><i class="bi bi-chevron-down ms-auto"></i>
</a>
<ul id="tables-nav" class="nav-content collapse " data-bs-parent="#sidebar-nav">
<li>
<a href="tables-general.html">
<i class="bi bi-circle"></i><span>General Tables</span>
</a>
</li>
<li>
<a href="tables-data.html">
<i class="bi bi-circle"></i><span>Data Tables</span>
</a>
</li>
</ul>
</li><!-- End Tables Nav -->
<li class="nav-item">
<a class="nav-link collapsed" data-bs-target="#charts-nav" data-bs-toggle="collapse" href="#">
<i class="bi bi-bar-chart"></i><span>Agence</span><i class="bi bi-chevron-down ms-auto"></i>
</a>
<ul id="charts-nav" class="nav-content collapse " data-bs-parent="#sidebar-nav">
<li>
<a href="charts-chartjs.html">
<i class="bi bi-circle"></i><span>Chart.js</span>
</a>
</li>
</ul>
</li><!-- End Charts Nav -->
<li class="nav-item">
<a class="nav-link collapsed" data-bs-target="#icons-nav" data-bs-toggle="collapse" href="#">
<i class="bi bi-gem"></i><span>Convention</span><i class="bi bi-chevron-down ms-auto"></i>
</a>
<ul id="icons-nav" class="nav-content collapse " data-bs-parent="#sidebar-nav">
<li>
<a href="icons-bootstrap.html">
<i class="bi bi-circle"></i><span>Bootstrap Icons</span>
</a>
</li>
<li>
<a href="icons-remix.html">
<i class="bi bi-circle"></i><span>Remix Icons</span>
</a>
</li>
</ul>
</li><!-- End Icons Nav -->
<li class="nav-heading">Pages</li>
<li class="nav-item">
<a class="nav-link collapsed" href="users-profile.html">
<i class="bi bi-person"></i>
<span>Profile</span>
</a>
</li><!-- End Profile Page Nav -->
<li class="nav-item">
<a class="nav-link collapsed" href="pages-faq.html">
<i class="bi bi-question-circle"></i>
<span>F.A.Q</span>
</a>
</li><!-- End F.A.Q Page Nav -->
<li class="nav-item">
<a class="nav-link collapsed" href="pages-contact.html">
<i class="bi bi-envelope"></i>
<span>Contact</span>
</a>
</li><!-- End Contact Page Nav -->
<li class="nav-item">
<a class="nav-link collapsed" href="pages-register.html">
<i class="bi bi-card-list"></i>
<span>Register</span>
</a>
</li><!-- End Register Page Nav -->
<li class="nav-item">
<a class="nav-link collapsed" href="pages-login.html">
<i class="bi bi-box-arrow-in-right"></i>
<span>Login</span>
</a>
</li><!-- End Login Page Nav -->
<li class="nav-item">
<a class="nav-link collapsed" href="pages-error-404.html">
<i class="bi bi-dash-circle"></i>
<span>Error 404</span>
</a>
</li><!-- End Error 404 Page Nav -->
<li class="nav-item">
<a class="nav-link collapsed" href="pages-blank.html">
<i class="bi bi-file-earmark"></i>
<span>Blank</span>
</a>
</li><!-- End Blank Page Nav -->
</ul>
</aside><!-- End Sidebar-->
{% block body %}
{% endblock %}
<!-- ======= Footer ======= -->
<footer id="footer" class="footer">
<div class="copyright">
© Copyright <strong><span>A+BFB</span></strong>. All Rights Reserved
</div>
<div class="credits">
<!-- All the links in the footer should remain intact. -->
<!-- You can delete the links only if you purchased the pro version. -->
<!-- Licensing information: https://bootstrapmade.com/license/ -->
<!-- Purchase the pro version with working PHP/AJAX contact form: https://bootstrapmade.com/nice-admin-bootstrap-admin-html-template/ -->
Designed by BootstrapMade
</div>
</footer><!-- End Footer -->
<i class="bi bi-arrow-up-short"></i>
<!-- Vendor JS Files -->
<script src="vendor/apexcharts/apexcharts.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="vendor/chart.js/chart.umd.js"></script>
<script src="vendor/echarts/echarts.min.js"></script>
<script src="vendor/quill/quill.min.js"></script>
<script src="vendor/simple-datatables/simple-datatables.js"></script>
<script src="vendor/tinymce/tinymce.min.js"></script>
<script src="vendor/php-email-form/validate.js"></script>
<!-- Template Main JS File -->
<script src="js/main.js"></script>
<script type="text/javascript" src="{{ asset ('assets/js/main.js')}}"></script>
</body>
</html>

How to add css and js in php 7 codeigniter 3.1.11?

** I know i need to add
<?php echo site_url ('path.css');?>">
**For css file and **
<?php echo site_url ('path.js');?">
**For js file, but actually dont know where in my code i need to add them and do i need to install jquery , If yes , how? can someone please help me how to complete this process? here is my html file **
<html>
<head runat="server">
<title>ASGB Ticketing Tool</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/png" href="assets/image/favicon.png"/>
<link rel="stylesheet" href="assets/css/bootstrap.min.css">
<link rel="stylesheet" href="assets/css/bootstrap.min.css.map">
<link rel="stylesheet" href="assets/css/mystyle.css">
<link rel="stylesheet" type="text/css" href="assets/fonts/font-awesome-4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="assets/css/datatables.min.css"/>
<link rel="stylesheet" type="text/css" href="assets/css/bootstrap-multiselect.css"/>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-cus navbar-light bg-faded">
<a class="navbar-brand waves-light" href="#">
<img src="assets/image/logo.png" />
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse navbar-mob-bar" id="navbarNav">
<ul class="nav navbar-nav ml-auto nav-head-font">
<li class="nav-item active"><a class="nav-link" href="#"><i class="fa fa-cog" aria-hidden="true"></i></a></li>
<li class="nav-item active"><a class="nav-link" href="#"><i class="fa fa-envelope-o" aria-hidden="true"></i></a></li>
<li class="nav-item dropdown dropdown-mob" id="dropdown-mob-hide">
<i class="fa fa-user" aria-hidden="true"></i>
<div class="dropdown-menu dropdown-menu-right">
<i class="fa fa-address-book-o" aria-hidden="true"></i>My Profile
<i class="fa fa-pencil-square-o" aria-hidden="true"></i>Edit Profile
<i class="fa fa-key" aria-hidden="true"></i>Change Password
<i class="fa fa-handshake-o" aria-hidden="true"></i>Account Ledger
<div class="dropdown-divider"></div>
<i class="fa fa-sign-out" aria-hidden="true"></i>Sign Out
</div>
</li>
</ul>
</div>
</nav>
<div class="container-fluid container-fluid-cus">
<div class="fixed-nav">
<div class="fixed-nav-inner open-nav">
<ul class="text-center">
<a href="home.html" id="menu-toggle" class="waves-light menu-toggle" data-toggle="offcanvas">
<li>
<i class="fa fa-dashboard"></i></li>
<li>Menu</li>
</a>
<a href="company.html" class="waves-light">
<li><i class="fa fa-briefcase"></i></li>
<li>Company</li>
</a>
<a href="staff.html" class="waves-light">
<li><i class="fa fa-user-circle"></i></li>
<li>Staff</li>
</a>
<a href="projects.html" class="waves-light">
<li><i class="fa fa-product-hunt"></i></li>
<li>Projects</li>
</a>
<a href="#" class="waves-light">
<li><i class="fa fa-ticket"></i></li>
<li>Incidents</li>
</a>
<a href="settings.html" class="waves-light">
<li><i class="fa fa-cogs"></i></li>
<li>Settings</li>
</a>
</ul>
</div>
</div>
</div>
<div class="main-sec">
<div class="">
<div class="row">
<div class="col-md-3">
<div class="card-block">
<div class="media">
<div class="mr-3 card-icon-1">
<i class="fa fa-newspaper-o font-l-1"></i>
</div>
<div class="media-body ml-3">
<h3 class="font-l-1 mb-1">06</h3>
<span>Projects</span>
</div>
</div>
</div>
</div>
<div class="col-md-3">
<div class="card-block">
<div class="media">
<div class="card-icon-2 mr-3 card-icon-1">
<i class="fa fa-users font-l-1"></i>
</div>
<div class="media-body ml-3">
<h3 class="font-l-1 mb-1">72</h3>
<span>Staff</span>
</div>
</div>
</div>
</div>
<div class="col-md-3">
<div class="card-block">
<div class="media">
<div class="card-icon-3 mr-3 card-icon-1">
<i class="fa fa-universal-access font-l-1"></i>
</div>
<div class="media-body ml-3">
<h3 class="font-l-1 mb-1">10</h3>
<span>Teams</span>
</div>
</div>
</div>
</div>
<div class="col-md-3">
<div class="card-block">
<div class="media">
<div class="card-icon-4 mr-3 card-icon-1">
<i class="fa fa-user-circle font-l-1"></i>
</div>
<div class="media-body ml-3">
<h3 class="font-l-1 mb-1">5</h3>
<span>Clients</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/popper.min.js"></script>
<script src="assets/js/bootstrap.min.js"></script>
<script type="text/javascript" src="assets/js/datatables.min.js"></script>
<script type="text/javascript" src="assets/js/bootstrap-multiselect.js"></script>
<script src="assets/js/jquery.steps.js"></script>
<script src="assets/js/jquery.validate.js"></script>
<script src="assets/js/myscript.js"></script>
</body>
</html>
**And here is my bootstrap path in my project, I am beginner in codeigniter and php , would appreciate if you can help me **

change to this href="<?= base_url('assets/css/yourCSS.css') ?>">
Don't forget to change the configuration in application/config/config.php straight to the $config['base_url'] = 'http://localhost/yourFolder/';

How to fix navbar collision without container-fluid?

I took the code from the Bootstrap Documentation with my existent code and it crashed it, meanwhile I put the same code in a Test.html and it works. I tried downloading the last version, put all bootstrap.min.css and all that stuff but it doesn't work, tried to put container-fluid at line 18 but the problem persists
I took the code from the Bootstrap Documentation (NavBars).
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Portal</title>
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/estilos.css">
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="#">Navbar</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Dropdown
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Something else here</a>
</div>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#">Disabled</a>
</li>
</ul>
<form class="form-inline my-2 my-lg-0">
<input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
</form>
</div>
</nav>
Also my login.php code (when it collide)
<?php require 'inc/cabecera.inc'; ?>
<div class="container-fluid">
<div class="row">
<div class="col-md-12 text-center">
<h1>Portal web</h1>
</div>
</div>
<div class="row">
<div class="col-sm-4 caja col-centrar">
<form action="login.php" method="POST" role="form">
<legend>Logueate!</legend>
<div class="form-group">
<input name="email" type="text" class="form-control" id="" placeholder="Su email...">
</div>
<div class="form-group">
<input name="contrasena" type="password" class="form-control" id="" placeholder="Su contraseña...">
</div>
<button type="submit" class="btn btn-primary">Ingresar</button>
<a class="pull-right" href="registrarse.php">Registrarse</a>
<label for="" class="checkbox-inline">
<input name="recordar" type="checkbox" value="activo"> Mantener sesión iniciada.
</label>
</form>
</div>
</div>
</div>
<?php require 'inc/footer.inc'; ?>
The problem:
It's all good:

laravel not getting bootstrap stylesheet

so i am new to LARAVEL and i am following a tutoriel. he created a navbar with bootstrap and gets this result :
and me i get this :
this is my code :
app.blade.php
<!DOCTYPE html>
<html>
<head>
<title>WebSite</title>
<link rel="stylesheet" type="text/css" href="css/app.css">
</head>
<body>
#include('inc.navbar')
#yield('content')
</body>
</html>
navbar.blade.php
<nav class="navbar navbar-expand-md navbar-dark bg-dark ">
<a class="navbar-brand" href="#">Navbar</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExampleDefault" aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarsExampleDefault">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#">Disabled</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="https://example.com" id="dropdown01" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown</a>
<div class="dropdown-menu" aria-labelledby="dropdown01">
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<a class="dropdown-item" href="#">Something else here</a>
</div>
</li>
</ul>
<form class="form-inline my-2 my-lg-0">
<input class="form-control mr-sm-2" type="text" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
</form>
</div>
</nav>

Below are the cdn's
<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
use thses cdn's as like below.
<!DOCTYPE html>
<html>
<head>
<title>WebSite</title>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
<nav class="navbar navbar-expand-md navbar-dark bg-dark ">
<a class="navbar-brand" href="#">Navbar</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExampleDefault" aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarsExampleDefault">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#">Disabled</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="https://example.com" id="dropdown01" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown</a>
<div class="dropdown-menu" aria-labelledby="dropdown01">
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<a class="dropdown-item" href="#">Something else here</a>
</div>
</li>
</ul>
<form class="form-inline my-2 my-lg-0">
<input class="form-control mr-sm-2" type="text" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
</form>
</div>
</nav>
</body>
</html>
Fiddle

Anchor links not working when I used it in include files in php

Im using include 'header.php' so i'll not repeat my header code all over again but I noticed it that the links inside the header.php are not working except the parent file the dashboard.php.
ALl the anchor tags inside the dashboard.php are working but not inside the header.php
This is my dashboard.php code
<?php require_once 'includes/header.php'; ?>
<!-- Setting the treeview active -->
<script type="text/javascript">
document.getElementById("treeview1").className = "active menu-open"
</script>
<!-- End Setting the treeview active -->
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
<!-- Content Header (Page header) -->
<section class="content-header">
<h1>
Dashboard
<small>Version 2.0</small>
</h1>
<ol class="breadcrumb">
<li><i class="fa fa-dashboard"></i> Home</li>
<li><i class="fa fa-dashboard"></i> Question</li>
<li class="active">Dashboard</li>
</ol>
</section>
<!-- Main content -->
<section class="content">
</section>
<!-- /.content -->
</div>
<!-- /.content-wrapper -->
<?php require_once 'includes/footer.php'; ?>
Heres the header.php
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>SOG Evaluation System</title>
<!-- Tell the browser to be responsive to screen width -->
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<!-- Bootstrap 3.3.7 -->
<link rel="stylesheet" href="../assets/bower_components/bootstrap/dist/css/bootstrap.min.css">
<!-- Font Awesome -->
<link rel="stylesheet" href="../assets/bower_components/font-awesome/css/font-awesome.min.css">
<!-- Ionicons -->
<link rel="stylesheet" href="../assets/bower_components/Ionicons/css/ionicons.min.css">
<!-- Theme style -->
<link rel="stylesheet" href="../assets/dist/css/AdminLTE.min.css">
<!-- AdminLTE Skins. Choose a skin from the css/skins
folder instead of downloading all of them to reduce the load. -->
<link rel="stylesheet" href="../assets/dist/css/skins/skin-green.css">
<!-- CLOCK rico -->
<script src="../assets/plugins/clock/ricoClock.js"></script>
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body class="hold-transition sidebar-mini skin-green"> <!-- set dito yung name ng theme -->
<div class="wrapper">
<header class="main-header">
<!-- Logo -->
<a href="dashboard.php" class="logo">
<!-- mini logo for sidebar mini 50x50 pixels -->
<span class="logo-mini"><b>SOG</b></span>
<!-- logo for regular state and mobile devices -->
<span class="logo-lg">SOG Evaluation System</span>
</a>
<!-- Header Navbar: style can be found in header.less -->
<nav class="navbar navbar-static-top">
<!-- Sidebar toggle button-->
<a href="#" class="sidebar-toggle" data-toggle="push-menu" role="button">
<span class="sr-only">Toggle navigation</span>
</a>
<!-- Navbar Right Menu -->
<div class="navbar-custom-menu">
<ul class="nav navbar-nav">
<!-- Messages: style can be found in dropdown.less-->
<li class="dropdown messages-menu">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<i class="fa fa-envelope-o"></i>
<span class="label label-success">4</span>
</a>
<ul class="dropdown-menu">
<li class="header">You have 4 messages</li>
<li>
<!-- inner menu: contains the actual data -->
<ul class="menu">
<li><!-- start message -->
<a href="#">
<div class="pull-left">
<img src="../assets/dist/img/user2-160x160.jpg" class="img-circle" alt="User Image">
</div>
<h4>
Support Team
<small><i class="fa fa-clock-o"></i> 5 mins</small>
</h4>
<p>Why not buy a new awesome theme?</p>
</a>
</li>
<!-- end message -->
<li>
<a href="#">
<div class="pull-left">
<img src="../assets/dist/img/user3-128x128.jpg" class="img-circle" alt="User Image">
</div>
<h4>
AdminLTE Design Team
<small><i class="fa fa-clock-o"></i> 2 hours</small>
</h4>
<p>Why not buy a new awesome theme?</p>
</a>
</li>
<li>
<a href="#">
<div class="pull-left">
<img src="../assets/dist/img/user4-128x128.jpg" class="img-circle" alt="User Image">
</div>
<h4>
Developers
<small><i class="fa fa-clock-o"></i> Today</small>
</h4>
<p>Why not buy a new awesome theme?</p>
</a>
</li>
<li>
<a href="#">
<div class="pull-left">
<img src="../assets/dist/img/user3-128x128.jpg" class="img-circle" alt="User Image">
</div>
<h4>
Sales Department
<small><i class="fa fa-clock-o"></i> Yesterday</small>
</h4>
<p>Why not buy a new awesome theme?</p>
</a>
</li>
<li>
<a href="#">
<div class="pull-left">
<img src="../assets/dist/img/user4-128x128.jpg" class="img-circle" alt="User Image">
</div>
<h4>
Reviewers
<small><i class="fa fa-clock-o"></i> 2 days</small>
</h4>
<p>Why not buy a new awesome theme?</p>
</a>
</li>
</ul>
</li>
<li class="footer">See All Messages</li>
</ul>
</li>
<!-- Notifications: style can be found in dropdown.less -->
<li class="dropdown notifications-menu">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<i class="fa fa-bell-o"></i>
<span class="label label-warning">10</span>
</a>
<ul class="dropdown-menu">
<li class="header">You have 10 notifications</li>
<li>
<!-- inner menu: contains the actual data -->
<ul class="menu">
<li>
<a href="#">
<i class="fa fa-users text-aqua"></i> 5 new members joined today
</a>
</li>
<li>
<a href="#">
<i class="fa fa-warning text-yellow"></i> Very long description here that may not fit into the
page and may cause design problems
</a>
</li>
<li>
<a href="#">
<i class="fa fa-users text-red"></i> 5 new members joined
</a>
</li>
<li>
<a href="#">
<i class="fa fa-shopping-cart text-green"></i> 25 sales made
</a>
</li>
<li>
<a href="#">
<i class="fa fa-user text-red"></i> You changed your username
</a>
</li>
</ul>
</li>
<li class="footer">View all</li>
</ul>
</li>
<!-- User Account: style can be found in dropdown.less -->
<li class="dropdown user user-menu">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<img src="../assets/dist/img/avatar.png" class="user-image" alt="User Image">
<span class="hidden-xs">Superadmin</span>
</a>
<ul class="dropdown-menu">
<!-- User image -->
<li class="user-header">
<img src="../assets/dist/img/avatar.png" class="img-circle" alt="User Image">
<p>
Superadmin - Web Developer
<small>Member since Nov. 2012</small>
</p>
</li>
<!-- Menu Body -->
<li class="user-body">
<div class="row">
<div class="col-xs-4 text-center">
Followers
</div>
<div class="col-xs-4 text-center">
Sales
</div>
<div class="col-xs-4 text-center">
Friends
</div>
</div>
<!-- /.row -->
</li>
<!-- Menu Footer-->
<li class="user-footer">
<div class="pull-left">
Profile
</div>
<div class="pull-right">
Sign out
</div>
</li>
</ul>
</li>
<!-- Control Sidebar Toggle Button -->
</ul>
</div>
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->
<div class="user-panel">
<div class="pull-left image">
<img src="../assets/dist/img/avatar.png" class="img-circle" alt="User Image">
</div>
<div class="pull-left info">
<p>Superadmin</p>
<i class="fa fa-circle text-success"></i> Online
</div>
</div>
<!-- search form -->
<!-- <form action="#" method="get" class="sidebar-form">
<div class="input-group">
<input type="text" name="q" class="form-control" placeholder="Search...">
<span class="input-group-btn">
<button type="submit" name="search" id="search-btn" class="btn btn-flat">
<i class="fa fa-search"></i>
</button>
</span>
</div>
</form> -->
<!-- /.search form -->
<div id="clockbox" style="font:12pt ; color:#ffffff;text-align: center;margin-bottom: 7px;padding: 10px"></div>
<!-- sidebar menu: : style can be found in sidebar.less -->
<ul class="sidebar-menu" data-widget="tree">
<li class="header">MAIN NAVIGATION</li>
<li class="treeview" id="treeview1">
<a href="dashboard.php">
<i class="fa fa-dashboard"></i> <span>Dashboard</span>
</a>
</li>
<li class="treeview" id="treeview2">
<a href="manageUsers.php">
<i class="fa fa-user"></i> <span>User Management</span>
</a>
</li>
<li class="treeview" id="treeview3">
<a href="manageQuestions.php">
<i class="fa fa-list-ul"></i> <span>Questionnaire Management</span>
</a>
</li>
<li class="treeview" id="treeview4">
<a href="manageSchedule.php">
<i class="fa fa-calendar"></i> <span>Evaluation Schedule</span>
</a>
</li>
<li class="treeview" id="treeview5">
<a href="viewResults.php">
<i class="fa fa-bar-chart"></i> <span>Evaluation Results</span>
</a>
</li>
<li class="treeview" id="treeview6">
<a href="generateReports.php">
<i class="fa fa-file-text"></i> <span>Reports</span>
</a>
</li>
<li class="treeview" id="treeview7">
<a href="manageSystemSettings.php">
<i class="fa fa-wrench"></i> <span>System Settings</span>
</a>
</li>
<li class="header">LABELS</li>
<li><i class="fa fa-circle-o text-red"></i> <span>Important</span></li>
<li><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></li>
<li><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></li>
</ul>
</section>
<!-- /.sidebar -->
</aside>

All your links are empty. They are all <a href="#".
Then above href will make the browser go to top of page.
The way it should be used is <a href="#about".
And that will make the browser go to the about section (if there is an about id)
See this answer for a complete documentation of how it works.
What is href="#" and why is it used?

Guys I already found the error. The conflict is on my class, the treeview class on my sidebar-menu (header.php). I just removed it and it's working now.

Categories