today i just try to test my codes and i got a weird problrm.
i have a app blade to use as my yied or shared header and footer
the codes is this
<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<title>Diva - Beauty salon template</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Favicon -->
<link href="img/favicon.ico" rel="shortcut icon">
<!-- Stylesheets -->
<link rel="stylesheet" href="css/bts.css">
<link rel="stylesheet" href="css/style.css">
<!------ Include the above in your HEAD tag ---------->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.1.0/css/all.css" integrity="sha384-lKuwvrZot6UHsBSfcMvOkWwlCMgc0TaWr+30HWe3a4ltaBwTZhyTEggF5tJv8tbt" crossorigin="anonymous">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ" crossorigin="anonymous">
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<!-- Page Preloder -->
<div id="preloder" style="display: none;">
<div class="loader" style="display: none;"></div>
</div>
<!-- Header section -->
<header class="header-section" dir="rtl">
<div class="header-warp">
<!-- logo -->
<a href="home.html" class="site-logo">
<img src="img/logo.png" alt="">
</a>
<!-- responsive -->
<div class="nav-switch">
<i class="fa fa-bars"></i>
</div>
<!-- Navigation Menu -->
<ul class="main-menu">
<li class="active">{{ __('general.Anohe') }}</li>
<li>{{ __('general.about-us')}}</li>
<li>{{ __('general.sell-place') }}</li>
<li>{{ __('general.about') }}</li>
<li>{{ __('general.contact-with-us') }}</li>
</ul>
<div class="header-right mb-4">
09359127500
{{ __('general.menu') }}
</div>
</div>
</header>
<!-- Header section end -->
<div class="container">
#include('...shared.message')
<div class="card-deck mb-3 text-center">
#yield('content')
</div>
</div>
<!-- Footer section end -->
<!-- Footer -->
<footer class="footer">
<div class="container bottom_border">
<div class="row">
<div class=" col-sm-4 col-md col-sm-4 col-12 col">
<h5 class="headin5_amrc col_white_amrc pt2">Find us</h5>
<!--headin5_amrc-->
<p class="mb10">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</p>
<p><i class="fa fa-location-arrow"></i> 9878/25 sec 9 rohini 35 </p>
<p><i class="fa fa-phone"></i> +91-9999878398 </p>
<p><i class="fa fa fa-envelope"></i> info#example.com </p>
</div>
<div class=" col-sm-4 col-md col-6 col">
<h5 class="headin5_amrc col_white_amrc pt2">Quick links</h5>
<!--headin5_amrc-->
<ul class="footer_ul_amrc">
<li>Image Rectoucing</li>
<li>Clipping Path</li>
<li>Hollow Man Montage</li>
<li>Ebay & Amazon</li>
<li>Hair Masking/Clipping</li>
<li>Image Cropping</li>
</ul>
<!--footer_ul_amrc ends here-->
</div>
<div class=" col-sm-4 col-md col-6 col">
<h5 class="headin5_amrc col_white_amrc pt2">Quick links</h5>
<!--headin5_amrc-->
<ul class="footer_ul_amrc">
<li>Remove Background</li>
<li>Shadows & Mirror Reflection</li>
<li>Logo Design</li>
<li>Vectorization</li>
<li>Hair Masking/Clipping</li>
<li>Image Cropping</li>
</ul>
<!--footer_ul_amrc ends here-->
</div>
<div class=" col-sm-4 col-md col-12 col">
<h5 class="headin5_amrc col_white_amrc pt2">Follow us</h5>
<!--headin5_amrc ends here-->
<ul class="footer_ul2_amrc">
<li><i class="fab fa-twitter fleft padding-right"></i> <p>Lorem Ipsum is simply dummy text of the printing...https://www.lipsum.com/</p></li>
<li><i class="fab fa-twitter fleft padding-right"></i> <p>Lorem Ipsum is simply dummy text of the printing...https://www.lipsum.com/</p></li>
<li><i class="fab fa-twitter fleft padding-right"></i> <p>Lorem Ipsum is simply dummy text of the printing...https://www.lipsum.com/</p></li>
</ul>
<!--footer_ul2_amrc ends here-->
</div>
</div>
</div>
<div class="container">
<ul class="foote_bottom_ul_amrc">
<li>Home</li>
<li>About</li>
<li>Services</li>
<li>Pricing</li>
<li>Blog</li>
<li>Contact</li>
</ul>
<!--foote_bottom_ul_amrc ends here-->
<p class="text-center">Copyright #2017 | Designed With by Your Company Name</p>
<ul class="social_footer_ul">
<li><i class="fab fa-facebook-f"></i></li>
<li><i class="fab fa-twitter"></i></li>
<li><i class="fab fa-linkedin"></i></li>
<li><i class="fab fa-instagram"></i></li>
</ul>
<!--social_footer_ul ends here-->
</div>
</footer>
<!-- Footer -->
<!--====== Javascripts & Jquery ======-->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
<script src="js/jquery-3.2.1.min.js"></script>
<script src="js/jquery-ui.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/circle-progress.min.js"></script>
<script src="js/main.js"></script><div id="ui-datepicker-div" class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all"></div>
</body></html>
and two other page with section
page one
#extends('layouts.app')
#section('content')
<div dir="rtl" >
<div class="d-flex d-inline-flex" style="width: 100%; height: 300px;">
<div class="shadow-sm border d-block h-100" style="width: 20%; ">
<p>
منو
</p>
<div class="w-100 mb-2">پوشاک<p class="fa fa-angle-left float-left ml-2"></p></div>
<div class="w-100 mb-2">الکترونیکی<p class="fa fa-angle-left float-left ml-2"></p></div>
<div class="w-100 mb-2">کتای<p class="fa fa-angle-left float-left ml-2"></p></div>
<div class="w-100 mb-2">بازی و سرگرمی<p class="fa fa-angle-left float-left ml-2"></p></div>
</div>
<div class="shadow border mr-3 h-100" style="width: 80%;">
<div id="demo" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ul class="carousel-indicators">
<li data-target="#demo" data-slide-to="0" class="active"></li>
<li data-target="#demo" data-slide-to="1"></li>
<li data-target="#demo" data-slide-to="2"></li>
</ul>
<!-- The slideshow -->
<div class="carousel-inner">
<div class="carousel-item active">
<img style="height: 300px;width: 100%" src="http://smarterware.org/wp-content/uploads/2016/09/technology1.jpg" alt="Los Angeles">
</div>
<div class="carousel-item">
<img style="height: 300px;width: 100%" src="https://www.cmo.com/content/dam/CMO/Home%20Page/1046x616_Modern-Commerce-2.0-Technology-Sets-The-Stage-For-A-New-Round-Of-Disruption.jpg" alt="Chicago">
</div>
<div class="carousel-item">
<img style="height: 300px;width: 100%" src="https://sohopress.com/wp-content/uploads/2018/05/web-summit-feature_1200x675_hero_110717.jpg" alt="New York">
</div>
</div>
<!-- Left and right controls -->
<a class="carousel-control-prev" href="#demo" data-slide="prev">
<span class="carousel-control-prev-icon"></span>
</a>
<a class="carousel-control-next" href="#demo" data-slide="next">
<span class="carousel-control-next-icon"></span>
</a>
</div>
</div>
</div>
<div class="shadow border mt-3">
<p>
ایران نت
</p>
<hr style="border-color: #bdbdbd;">
</div>
<div class="d-flex d-inline-flex" style="width: 100%">
<div class="shadow border mt-3" style="width: 20%">
<p>
آخرین اخبار
</p>
<hr style="border-color: #ff8a05">
<ul class="list-group">
<li class="list-group-item" style="height: 60px; text-overflow: ellipsis; white-space: nowrap;overflow: hidden; word-wrap: break-word;"> شاسی بلند لامبورگینی اوروس با تیونینگ TopCar معرفی شد </li>
<li class="list-group-item" style="height: 60px; text-overflow: ellipsis; white-space: nowrap;overflow: hidden; word-wrap: break-word;"> اینتل دانگل هوش مصنوعی جدید خود را معرفی کرد </li>
<li class="list-group-item" style="height: 60px; text-overflow: ellipsis; white-space: nowrap;overflow: hidden; word-wrap: break-word;"> چهارمین همایش آینده وب و موبایل </li>
<li class="list-group-item" style="height: 60px; text-overflow: ellipsis; white-space: nowrap;overflow: hidden; word-wrap: break-word;"> بزرگترین کارخانه تولید داروهای ضدسرطان خاورمیانه در ایران افتتاح شد </li>
<li class="list-group-item" style="height: 60px; text-overflow: ellipsis; white-space: nowrap;overflow: hidden; word-wrap: break-word;"> جگوار لندرور در صنعت موتورسیکلت سرمایهگذاری میکند </li>
</ul>
</div>
<div class="shadow border mt-3 mr-3" style="width: 80%; height: 350px">
<img class="w-100 h-100" src="https://boygeniusreport.files.wordpress.com/2018/06/fortnite.jpg?quality=98&strip=all&w=782"/>
</div>
</div>
<div class="shadow border mt-3">
<p>
جدید ترین ها
</p>
<hr style="border-color: #bdbdbd;">
<div class=" d-inline-flex" style="height: 300px">
#foreach($products as $product)
<div class="w-25 m-2">
<div class="h-50 p-2">
<img class="w-75 h-100" style="border-radius: 20px;" src="/image/products/{{$product->id}}product1.jpg"/>
</div>
<div class="p-2" style=" overflow: hidden; word-wrap: normal; height: 35%;">
{{$product->pname}}
<p>{{$product->description}} </p>
</div>
توضیحات محصول
</div>
#endforeach
</div>
</div>
<div class="shadow border mt-3">
<p>
دیجیکالا
</p>
<hr style="border-color: #bdbdbd;">
<div class=" d-inline-flex">
#if(isset($Dproducts))
#foreach($Dproducts as $product)
<div class="w-25 border m-2">
<div class="h-50 p-2 border">
<img class="w-100 h-100" src="/image/products/{{$product->id}}product1.jpg"/>
</div>
<div class="h-25 p-2 border">
{{$product->pname}}
<p style=" overflow: hidden; word-wrap: break-word;">{{$product->description}} </p>
</div>
توضیحات محصول
</div>
#endforeach
#endif
</div>
</div>
</div>
#endsection
and page two
#extends('layouts.app')
#section('content')
<div class="container">
<h2 class="text-center">Contac Form</h2>
<div class="row justify-content-center">
<div class="col-12 col-md-8 col-lg-6 pb-5">
<div class="container">
<h1>Contact US Form</h1>
#if(Session::has('success'))
<div class="alert alert-success">
{{ Session::get('success') }}
</div>
#endif
<form method="post" action="{{route('contactus.store')}}" enctype="multipart/form-data">
{{ csrf_field() }}
<div class="form-group {{ $errors->has('name') ? 'has-error' : '' }}">
<label>Name</label>
<input type="text" name="name" id="name" placeholder="Enter Name" class="form-control" value="{{old('name')}}">
<span class="text-danger">{{ $errors->first('name') }}</span>
</div>
<div class="form-group {{ $errors->has('email') ? 'has-error' : '' }}">
<label>Email</label>
<input type="text" name="email" id="email" placeholder="Enter Email" class="form-control" value="{{old('email')}}">
<span class="text-danger">{{ $errors->first('email') }}</span>
</div>
<div class="form-group {{ $errors->has('message') ? 'has-error' : '' }}">
<label>Message</label>
<textarea type="text" name="message" id="message" placeholder="Enter Message" class="form-control" value="{{old('message')}}"></textarea>
<span class="text-danger">{{ $errors->first('message') }}</span>
</div>
<div class="form-group">
<button class="btn btn-success">Contact US!</button>
</div>
</form>
</div>
<!--Form with header-->
</div>
</div>
</div>
#include('...shared.errors')
#endsection
problem is my shared blade work in my first page without problem.but in my second page CSS file don't work .
i test it a lot my self and i find out that when my address bar get more than one / this problem happening .
route of my first page is /home and my second page is /page/about
There’s nothing wrong with #yield, the problem is you’re using a relative path for your CSS files, so if your page is within a folder the URL will become invalid.
Instead, use the url() helper in Laravel to automatically prepend the application’s base URL to your CSS URLs:
<link rel="stylesheet" href="{{ url('css/bts.css') }}">
<link rel="stylesheet" href="{{ url('css/style.css') }}">
Related
I have problem regarding register the route of slash in web.php, it gives me error that my route is not defined. Route [/] not defined. is there way to register my slash to the web.php? my main point here is when the user access the url http://localhost:8000/ the redirection will go to the index controller.
I will share to you guys my controller and my web.php
Web.php
Route::get('/', 'HomeController#index')->name('index');
Controller:
public function index() {
return view('index')
}
index.blade.php
#extends('layouts.app')
#section('content')
<!-- <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<img src="{{asset('assets/W4_Double_bucket_EN.jpg')}}" class="d-block w-100" alt="...">
</div>
<div class="carousel-item">
<img src="{{asset('assets/BBQ_Big_Crunch_Banner_en.jpg')}}" class="d-block w-100" alt="...">
</div>
</div>
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
<br><br><br> -->
<!-- Scroll to Top Button-->
<div id="wrapper" >
<!-- Sidebar -->
<!-- End of Sidebar -->
<div class="container-fluid">
<br><br><br><br>
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<img src="{{asset('assets/W4_Double_bucket_EN.jpg')}}" class="d-block w-100" alt="...">
</div>
<div class="carousel-item">
<img src="{{asset('assets/BBQ_Big_Crunch_Banner_en.jpg')}}" class="d-block w-100" alt="...">
</div>
</div>
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
<br><br><br>
<div class="row">
<div class="col-md-3">
<div class="card shadow ">
<div class="card-header bg-danger">
<b style=" font-weight: 500; font-size:14px; color:white;"><i class="far fa-comments"></i> Recent Posts</b>
</div>
<div class="card-body">
<h5 class="card-title" style="font-size:15px; font-weight: 400; color:black;">Special title treatment</h5>
<p class="card-text" style="color:#757a91; font-size:14px;">With supporting text below as a natural lead-in to additional content.</p>
<hr></hr>
</div>
</div>
<br/>
<div class="card shadow">
<div class="card-header bg-danger" >
<b style=" font-weight: 500; font-size:14px; color:white;"><i class="far fa-user"></i> RGM Corner</b>
</div>
<div class="card-body">
<h5 class="card-title">
<div>
<h5 class="card-title" style="font-size:15px; font-weight: 400; color:black;">Special title treatment</h5>
<div class="postDate" style="font-size:11px; color:#999;">2d ago</div>
</div>
</h5>
<p class="card-text" style="color:#757a91; font-size:14px;">With supporting text below as a natural lead-in to additional content.</p>
<a class="nav-link" href="#" style="color:#757a91; font-size: 13px;"><i class="far fa-thumbs-up" style="color:#757a91; font-size:13px;"></i> 2 Likes</a>
<hr></hr>
<br/>
<h5 class="card-title">
<div>
<h5 class="card-title" style="font-size:15px; font-weight: 400; color:black;">Special title treatment</h5>
<div class="postDate" style="font-size:11px; color:#999;">2d ago</div>
</div>
</h5>
<p class="card-text" style="color:#757a91; font-size:14px;">With supporting text below as a natural lead-in to additional content.</p>
<a class="nav-link" href="#" style="color:#757a91; font-size: 13px;"><i class="far fa-thumbs-up" style="color:#757a91; font-size:13px;"></i> 2 Likes</a>
<hr></hr>
</div>
</div>
<br><br>
</div>
<div class="col-md-6">
<div class="card shadow ">
<div class="card-body">
<p class="card-title">
<div class="row">
<div class="col-md-1"> <img src="{{asset('assets/rounded_image.jpg')}}" style="height:40px;,width:40px;" class="rounded-circle" alt="..."/></div>
<div class="col-md-4">
<div style="line-height: 1.3;">
<div class="postName" style="color:#900; font-weight: 500; font-size:14px;">Ronald Perpekto</div>
<div class="postPosition" style="font-size:12px; color:#999;">Operations</div>
<div class="postDate" style="font-size:11px; color:#999;">2d ago</div>
</div>
</div>
</div>
<hr></hr>
</p>
<p class="card-text" style="color:#757a91; font-size:13px;">As a pre-emptive measure to ensure the safety of our people most especially our students, from the onslaught of Typhoon Tisoy that is predicted</p>
<p class="card-text">
<img class="d-block w-100" src="{{asset('assets/BBQ_Big_Crunch_Banner_en.jpg')}}"></img>
</p>
</div>
<div class="card-footer text-muted">
<div class="row">
<div class="col-md-6">
<div class="row">
<a class="nav-link" href="#" style="color:#757a91; font-size:13px;"><i class="far fa-thumbs-up" style="color:#757a91; font-size:13px;"></i> 2 Likes</a>
<a class="nav-link" href="#" style="color:#757a91; font-size: 13px;"><i class="far fa-comments" style="color:#757a91; font-size:13px;"></i> 50 Comments</a>
</div>
</div>
</div>
</div>
</div>
<br/>
<div class="card shadow">
<div class="card-body">
<p class="card-title">
<div class="row">
<div class="col-md-1"> <img src="{{asset('assets/rounded_image.jpg')}}" style="height:40px;,width:40px;" class="rounded-circle" alt="..."/></div>
<div class="col-md-4">
<div style="line-height: 1.3;">
<div class="postName" style="color:#900; font-weight: 500; font-size:14px;">Ronald Perpekto</div>
<div class="postPosition" style="font-size:12px; color:#999;">Operations</div>
<div class="postDate" style="font-size:11px; color:#999;">2d ago</div>
</div>
</div>
</div>
<hr></hr>
</p>
<p class="card-text" style="color:#757a91; font-size:13px;">As a pre-emptive measure to ensure the safety of our people most especially our students, from the onslaught of Typhoon Tisoy that is predicted</p>
<p class="card-text">
<img class="d-block w-100" src="{{asset('assets/W4_Double_bucket_EN.jpg')}}" style="height:40,width:40"></img>
</p>
</div>
<div class="card-footer text-muted">
<div class="row">
<div class="col-md-6">
<div class="row">
<a class="nav-link" href="#" style="color:#757a91; font-size: 13px;"><i class="far fa-thumbs-up" style="color:#757a91; font-size: 13px;"></i> 2 Likes</a>
<a class="nav-link" href="#" style="color:#757a91; font-size: 13px;"><i class="far fa-comments" style="color:#757a91; font-size: 13px;"></i> 50 Comments</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-3">
<div class="card shadow">
<div class="card-header bg-danger">
<b style=" font-weight: 500; font-size:14px; color:white;"><i class="far fa-calendar"></i> What's Happening </b>
</div>
<div class="card-body">
<h5 class="card-title" style="font-size:15px; font-weight: 400; color:black;">Special title treatment</h5>
<p class="card-text" style="color:#757a91; font-size:14px;">With supporting text below as a natural lead-in to additional content.</p>
<hr></hr>
</div>
</div>
<br/>
<div class="card shadow">
<div class="card-header bg-danger">
<b style=" font-weight: 500; font-size:14px; color:white;"><i class="far fa-file"></i> Recommended Pages</b>
</div>
<div class="card-body">
<p class="card-text">
<div class="row">
<div class="col-md-2"><i class="fa fa-bicycle fa-2x" style="background: #f3f3f3; padding:9px; border-radius: 50%;"></i></div>
<div class="col-md-9">
<div style="line-height: 1.3; margin-left:0px;">
<div class="postName" style="font-weight: 400; color:black; font-size:15px;">Hiflyer Website</div>
<div class="postPosition" style="font-size:12px; color:#999;">https://www.hiflyer.ca/</div>
<div class="postDate" style="font-size:11px; color:#999;">2019</div>
</div>
</div>
</div>
</p>
<p class="card-text">
<div class="row">
<div class="col-md-2"><i class="fas fa-desktop fa-2x" style="background: #f3f3f3; padding:9px; border-radius: 50%;"></i></div>
<div class="col-md-9">
<div style="line-height: 1.3; margin-left:0px;">
<div class="postName" style="font-weight: 400; color:black; font-size:15px;">Customer Display</div>
<div class="postPosition" style="font-size:12px; color:#999;">https://icweb.hiflyer.ca/CustomerDisplay</div>
<div class="postDate" style="font-size:11px; color:#999;">2019</div>
</div>
</div>
</div>
</p>
</div>
</div>
<br/>
<div class="card shadow">
<div class="card-header bg-danger">
<b style=" font-weight: 500; font-size:14px; color:white;"><i class="far fa-calendar"></i> Upcoming Events </b>
</div>
<div class="card-body">
<h5 class="card-title" style="font-size:15px; font-weight: 400; color:black;">Special title treatment</h5>
<p class="card-text" style="color:#757a91; font-size:14px;">With supporting text below as a natural lead-in to additional content.</p>
<hr></hr>
</div>
</div>
<br/>
</div>
</div>
</div>
</div>
<!-- End of Page Wrapper -->
<!-- Scroll to Top Button-->
<a class="scroll-to-top rounded" href="#page-top">
<i class="fas fa-angle-up"></i>
</a>
<br><br><br><br>
#endsection
Error:
Somewhere in your index.blade.php file you are using a route link like this route('/') and thats wrong (in your case).
In the route() function you need to enter the url name (in your case 'index') instead of the url path. So if you change route('/') to route('index') it work's.
Check the index.php file you've added {{ route('/') }} but in web.php file there is no route as the same name.
So, replace {{ route('/') }} to {{ route('index') }} in index.php file.
Or with url you can define it as below.
{{ url('/') }}
check with this change
Route::get('/', 'HomeController#index');
When i look at you error screenshot which you've mentioned,i saw Authenticate.php
So i think you need to set home url over there
<?php
namespace App\Http\Middleware;
use Illuminate\Auth\Middleware\Authenticate as Middleware;
use Illuminate\Support\Facades\Request;
class Authenticate extends Middleware
{
/**
* Get the path the user should be redirected to when they are not authenticated.
*
* #param \Illuminate\Http\Request $request
* #return string
*/
protected function redirectTo($request)
{
if (! $request->expectsJson()) {
return route('index');
// by default it's : return route('login'); you might have changed here
}
}
}
I have a navigation toggle it appears when screen is small after i included 1 php file which which is bootstrap modal, after including that my navigation toggle is not closing after opening.Im unable to close the navigation menu.
I have include both the files index as well as request which is data modal file
<?php require 'request.php';?>
<header class="navigation navbar navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<!-- responsive nav button -->
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<!-- /responsive nav button -->
<!-- logo -->
<a class="navbar-brand logo" href="index.html">
<img class="logo-white" src="images/logo1.png" alt="logo" style="width:40px;float:left;"/>
<p class="logo-white" style="float:right;font-size: 30px;color: white;font-family: initial;margin-top:5px;margin-left:8px;">Expert Web Solutions</p>
<img class="logo-default" src="images/logo2.png" alt="logo" style="width:40px;float:left;"/>
<p class="logo-default" style="float:right;font-size: 30px;color: #000;font-family: initial;margin-top:5px;margin-left:8px;">Expert Web Solutions</p>
</a>
<!-- /logo -->
</div>
<!-- main nav -->
<nav class="collapse navbar-collapse navbar-right">
<ul id="nav" class="nav navbar-nav menu">
<li>
<a href="index.html" >Home </span></a>
</li>
<li class="dropdown">
Services <span class="caret"></span>
<ul class="dropdown-menu">
<li>Mobile App Development</li>
<li>Web Development</li>
<li>Software Development</li>
<li>Software Consultancy</li>
<li>Software Testing and<br> Quality Assurance</li>
</ul>
</li>
<li>Technologies</li>
<li>About Us</li>
<li>Careers</li>
<li><button type="button" data-toggle="modal" data-target="#myModal">Request A Quote</button></li>
<li>Contact Us</li>
</li>
</ul>
</nav>
<!-- /main nav -->
</div>
</header>
<this is request.php>
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<link rel="stylesheet" href="form.css" >
<script src="form.js"></script>
</head>
<body>
<div class="container">
<!-- Trigger the modal with a button -->
<!-- Modal -->
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Request A Quote</h4>
</div>
<div class="panel-body">
<form id="reused_form">
<div class="form-group">
<input type="text" name="name" required class="form-control" placeholder="Enter Name">
</div>
<div class="form-group">
<input type="email" name="email" required class="form-control" placeholder="Enter Email">
</div>
<div class="form-group">
<input name="phone" class="form-control" placeholder="Enter Phone Number">
</div>
<div class="form-group">
<textarea rows="3" name="message" class="form-control" placeholder="Write Your Requirements"></textarea>
</div>
<div class="form-group">
<button class="btn btn-raised btn-lg btn-warning" type="submit" style="
border: none;
padding: 15px 0;
width: 100%;
margin: 0;
background: #2b315d;
color: #fff;
border-radius: 0;
">Send</button>
</div>
</form>
<div id="error_message" style="width:100%; height:100%; display:none; ">
<h4>
Error
</h4>
Sorry there was an error sending your form.
</div>
<div id="success_message" style="width:100%; height:100%; display:none; ">
<h2 style="color:#000; font-size:22px;text-align:center;">Thank You! <br>Your Message was Sent Successfully.<br>One of our representatives will contact you shortly.</h2>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
I think require.php breaks the html including head section again and opening and closing html and body tags.
Maybe this will work ?
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<link rel="stylesheet" href="form.css" >
<script src="form.js"></script>
</head>
<body>
<header class="navigation navbar navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<!-- responsive nav button -->
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<!-- /responsive nav button -->
<!-- logo -->
<a class="navbar-brand logo" href="index.html">
<img class="logo-white" src="images/logo1.png" alt="logo" style="width:40px;float:left;"/>
<p class="logo-white" style="float:right;font-size: 30px;color: white;font-family: initial;margin-top:5px;margin-left:8px;">Expert Web Solutions</p>
<img class="logo-default" src="images/logo2.png" alt="logo" style="width:40px;float:left;"/>
<p class="logo-default" style="float:right;font-size: 30px;color: #000;font-family: initial;margin-top:5px;margin-left:8px;">Expert Web Solutions</p>
</a>
<!-- /logo -->
</div>
<!-- main nav -->
<nav class="collapse navbar-collapse navbar-right">
<ul id="nav" class="nav navbar-nav menu">
<li>
<a href="index.html" >Home </span></a>
</li>
<li class="dropdown">
Services <span class="caret"></span>
<ul class="dropdown-menu">
<li>Mobile App Development</li>
<li>Web Development</li>
<li>Software Development</li>
<li>Software Consultancy</li>
<li>Software Testing and<br> Quality Assurance</li>
</ul>
</li>
<li>Technologies</li>
<li>About Us</li>
<li>Careers</li>
<li><button type="button" data-toggle="modal" data-target="#myModal">Request A Quote</button></li>
<li>Contact Us</li>
</li>
</ul>
</nav>
<!-- /main nav -->
</div>
</header>
<?php require 'request.php';?>
</body>
</html>
below request PHP
<!-- Trigger the modal with a button -->
<!-- Modal -->
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Request A Quote</h4>
</div>
<div class="panel-body">
<form id="reused_form">
<div class="form-group">
<input type="text" name="name" required class="form-control" placeholder="Enter Name">
</div>
<div class="form-group">
<input type="email" name="email" required class="form-control" placeholder="Enter Email">
</div>
<div class="form-group">
<input name="phone" class="form-control" placeholder="Enter Phone Number">
</div>
<div class="form-group">
<textarea rows="3" name="message" class="form-control" placeholder="Write Your Requirements"></textarea>
</div>
<div class="form-group">
<button class="btn btn-raised btn-lg btn-warning" type="submit" style="
border: none;
padding: 15px 0;
width: 100%;
margin: 0;
background: #2b315d;
color: #fff;
border-radius: 0;
">Send</button>
</div>
</form>
<div id="error_message" style="width:100%; height:100%; display:none; ">
<h4>
Error
</h4>
Sorry there was an error sending your form.
</div>
<div id="success_message" style="width:100%; height:100%; display:none; ">
<h2 style="color:#000; font-size:22px;text-align:center;">Thank You! <br>Your Message was Sent Successfully.<br>One of our representatives will contact you shortly.</h2>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
i have managed to create a form whereby the user logs in using sessions and once the user is logged in ,he/she is able to post data into a different table named members.My problem is that I'm unable to retrieve the data added by the logged in user from the members table.I'm a newbie and i hope someone here will help me figure out this.below is my code
<!DOCTYPE html>
<?php
session_start();
if(!isset($_SESSION['phone'])){
header("location: login2.php");
}
else {
include ("../includes/db.php");
$sql = "select * FROM post";
$run = mysql_query($sql);
$total_post=mysql_num_rows($run);
$sql = "select * FROM gallary";
$run = mysql_query($sql);
$total_image=mysql_num_rows($run);
$sql = "select * FROM user";
$run = mysql_query($sql);
$total_user=mysql_num_rows($run);
$sql = "select * FROM course";
$run = mysql_query($sql);
$total_course=mysql_num_rows($run);
$sql = "select * FROM mails";
$run = mysql_query($sql);
$total_mails=mysql_num_rows($run);
?>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>Dashboard</title>
<!-- Bootstrap Core CSS -->
<link href="../bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- MetisMenu CSS -->
<link href="../bower_components/metisMenu/dist/metisMenu.min.css" rel="stylesheet">
<!-- Timeline CSS -->
<link href="../dist/css/timeline.css" rel="stylesheet">
<!-- Custom CSS -->
<link href="../dist/css/sb-admin-2.css" rel="stylesheet">
<!-- Morris Charts CSS -->
<link href="../bower_components/morrisjs/morris.css" rel="stylesheet">
<!-- Custom Fonts -->
<link href="../bower_components/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="wrapper">
<!-- Navigation -->
<nav class="navbar navbar-default navbar-static-top" role="navigation" style="margin-bottom: 0">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.php">Dashboard</a>
</div>
<!-- /.navbar-header -->
<ul class="nav navbar-top-links navbar-right">
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
<i class="fa fa-user fa-fw"></i> <i class="fa fa-caret-down"></i>
</a>
<ul class="dropdown-menu dropdown-user">
<li><i class="fa fa-sign-out fa-fw"></i> Logout
</li>
</ul>
<!-- /.dropdown-user -->
</li>
<!-- /.dropdown -->
</ul>
<!-- /.navbar-top-links -->
<div class="navbar-default sidebar" role="navigation">
<div class="sidebar-nav navbar-collapse">
<ul class="nav" id="side-menu">
<li>
<i class="fa fa-dashboard fa-fw"></i> Dashboard
</li>
<!--
<li>
<i class="fa fa-edit fa-fw"></i> Create New Post
</li>
<li>
<i class="fa fa-table fa-fw"></i> View All Post
</li>
<li>
<i class="fa fa-edit fa-fw"></i> Create New Story
</li>
<li>
<i class="fa fa-table fa-fw"></i> View All Story
</li>
<li>
<i class="fa fa-edit fa-fw"></i> Upload Image
</li>
<li>
<i class="fa fa-photo fa-fw"></i> View All Image</span>
</li>
<li>
<i class="fa fa-photo fa-fw"></i> View All emails</span>
</li>
<li>
<i class="fa fa-edit fa-fw"></i> View All Joining members</span>
</li>
-->
</ul>
</div>
<!-- /.sidebar-collapse -->
</div>
<!-- /.navbar-static-side -->
</nav>
<div id="page-wrapper">
<div class="row">
<div class="col-lg-12">
<h1 class="page-header">Dashboard</h1>
</div>
<!-- /.col-lg-12 -->
</div>
<!-- /.row -->
<div class="row">
<div class="col-lg-3 col-md-6">
<div class="panel panel-primary">
<div class="panel-heading">
<div class="row">
<div class="col-xs-3">
<i class="fa fa-list-ul fa-5x"></i>
</div>
<div class="col-xs-9 text-right">
<div class="huge"><?php echo $total_post; ?></div>
<div>All Posts!</div>
</div>
</div>
</div>
<a href="index.php?view_post=view_post">
<div class="panel-footer">
<span class="pull-left">View Details</span>
<span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>
<div class="clearfix"></div>
</div>
</a>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="panel panel-green">
<div class="panel-heading">
<div class="row">
<div class="col-xs-3">
<i class="fa fa-photo fa-5x"></i>
</div>
<div class="col-xs-9 text-right">
<div class="huge"><?php echo $total_image; ?></div>
<div>All Images!</div>
</div>
</div>
</div>
<a href="images.php">
<div class="panel-footer">
<span class="pull-left">View Details</span>
<span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>
<div class="clearfix"></div>
</div>
</a>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="panel panel-yellow">
<div class="panel-heading">
<div class="row">
<div class="col-xs-3">
<i class="fa fa-users fa-5x"></i>
</div>
<div class="col-xs-9 text-right">
<div class="huge"><?php echo $total_user; ?></div>
<div>All Users!</div>
</div>
</div>
</div>
<a href="users.php">
<div class="panel-footer">
<span class="pull-left">View Details</span>
<span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>
<div class="clearfix"></div>
</div>
</a>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="panel panel-red">
<div class="panel-heading">
<div class="row">
<div class="col-xs-3">
<i class="fa fa-database fa-5x"></i>
</div>
<div class="col-xs-9 text-right">
<div class="huge"><?php echo $total_course; ?></div>
<div>All Story!</div>
</div>
</div>
</div>
<a href="course.php">
<div class="panel-footer">
<span class="pull-left">View Details</span>
<span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>
<div class="clearfix"></div>
</div>
</a>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="panel panel-yellow">
<div class="panel-heading">
<div class="row">
<div class="col-xs-3">
<i class="fa fa-database fa-5x"></i>
</div>
<div class="col-xs-9 text-right">
<div class="huge"><?php echo $total_mails; ?></div>
<div>All mails!</div>
</div>
</div>
</div>
<a href="mails.php">
<div class="panel-footer">
<span class="pull-left">View Details</span>
<span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>
<div class="clearfix"></div>
</div>
</a>
</div>
</div>
</div>
<!--Post Section Open-->
<div class="row">
<div class="col-lg-12">
<div class="panel panel-default">
<div class="panel-heading">
<div class="panel-heading">
<h2>All users</h2>
</div>
<div class="panel-body">
<div class="dataTable_wrapper">
<table class="table table-striped table-bordered table-hover" id="dataTables-example">
<thead>
<tr>
<th>S.No.</th>
<th>Id</th>
<th>First_name</th>
<th>Last NAme</th>
<th>Email</th>
<th>phone</th>
<th>created</th>
<th>modified</th>
<th>status</th>
<th>Edit</th>
<th>Delete</th>
</tr>
</thead>
<?php
include("../includes/db.php");
$i=1;
$query="SELECT members.user_id,members.name,members.phone,members.location, user.username,user.phone
FROM members
LEFT JOIN user
ON members.user_id=user.phone
ORDER BY members.user_id;"
?>
<?php } ?>
</div>
</div>
</div>
</div>
</div>
</div>
<!--Post Section Close-->
</div>
<!-- /#page-wrapper -->
</div>
<!-- /#wrapper -->
<!-- jQuery -->
<script src="../bower_components/jquery/dist/jquery.min.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="../bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<!-- Metis Menu Plugin JavaScript -->
<script src="../bower_components/metisMenu/dist/metisMenu.min.js"></script>
<!-- Charts JavaScript -->
<script src="../bower_components/raphael/raphael-min.js"></script>
<script src="../bower_components/morrisjs/morris.min.js"></script>
<script src="../js/morris-data.js"></script>
<!-- Custom Theme JavaScript -->
<script src="../dist/js/sb-admin-2.js"></script>
</body>
</html>
You must join table with valid condition. I don't know your table structure for user table, as a guess i think this will help you.
$query="SELECT members.user_id,members.name,members.phone,members.location,
user.username,user.phone, user.id
FROM members
LEFT JOIN user
ON members.user_id=user.id
ORDER BY members.user_id;"
My code works just fine if it is in html file, the header and footer codes are in the products page. The problem is if I make it in php file, the side navbar won't work, I already tried moving the body tag in the products page but it still doesn't work. Appreciate any help :)
header-ee.php
<html>
<head>
<?php
include('parameters.php');
?>
<title> <?php echo $page_title; ?> </title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="<?= $server_addr ?>/common/css/bootstrap.css">
<script src="<?= $server_addr ?>/common/js/jquery-3.2.1.js"></script>
<script src="<?= $server_addr ?>/common/js/bootstrap.js"></script>
<script src="js/ee-home.js"></script>
<link rel="stylesheet" href="css/ee-home.css">
</head>
<body data-spy="scroll" data-target="#myScrollspy" data-offset="20">
<!--Start header-->
<nav class="navbar navbar-default navigation-bar">
<div class="container-fluid">
<div class="row">
<div class="navbar-header col-xs-12 col-sm-12 col-md-12 col-lg-6 centered-a">
<div class="row">
<div class="col-sm-3 centered-a">
<img src="img/ee-logo.png">
</div>
<div class="col-sm-9">
<h1 id="nav-brand">
EQUIPMENT ENGINEERS, INC.</br>
</h1>
<h1 id="nav-brand-subtitle">
<small>
Your Reliable Solutions Partner
</small>
</h1>
</div>
</div>
<a href="#">
<span class="link-spanner"></span>
</a>
</div>
<div class="navbar-header col-lg-6 visible-lg centered-a">
<div class="row centered-a" id="nav-box">
<div class="col-lg-2 centered-a">
<a href="#">
<p>Home</p>
<span class="link-spanner"></span>
<a>
</div>
<div class="col-lg-2 centered-a">
<a href="#">
<p>Our Company</p>
<span class="link-spanner"></span>
<a>
</div>
<div class="col-lg-2 centered-a">
<a href="#">
<p>SCM</p>
<span class="link-spanner"></span>
<a>
</div>
<div class="col-lg-2 centered-a">
<a href="#">
<p>Products</p>
<span class="link-spanner"></span>
<a>
</div>
<div class="col-lg-2 centered-a">
<a href="#">
<p>Inquiries</p>
<span class="link-spanner"></span>
<a>
</div>
<div class="col-lg-2 centered-a" id="last-item">
<a href="#">
<p">Supplier Accreditation</p>
<span class="link-spanner"></span>
<a>
</div>
</div>
</div>
</div>
<div class="panel-group col-md-12 centered-a hidden-lg">
<div class="panel panel-default">
<div class="panel-heading" >
<h2 class="panel-title centered-a">
<span class="glyphicon glyphicon-triangle-bottom"></span>
<a data-toggle="collapse" href="#collapse1">
<span class="link-spanner"></span>
<a>
</h2>
</div>
<div id="collapse1" class="panel-collapse collapse">
<ul class="list-group">
<li class="list-group-item">
Home
<span class="link-spanner"></span>
</li>
<li class="list-group-item">
Our Company
<span class="link-spanner"></span>
</li>
<li class="list-group-item">
SCM
<span class="link-spanner"></span>
</li>
<li class="list-group-item">
Products
<span class="link-spanner"></span>
</li>
<li class="list-group-item">
Inquiries
<span class="link-spanner"></span>
</li>
<li class="list-group-item">
Supplier Accreditation
<span class="link-spanner"></span>
</li>
</ul>
</div>
</div>
</div>
</div>
</nav>
<!--End header-->
products.php
<?php include("includes/header-ee.php"); ?>
<link rel="stylesheet" href="products.css"></link>
<div class="container-fluid">
<div class="row">
<!--Sidebar-->
<nav class="col-md-3" id="myScrollspy">
<span>Product Lineup</span>
<ul class="nav nav-pills nav-stacked">
<li class="active">Section 1</li>
<li>Section 2</li>
<li>Section 3</li>
</ul>
</nav>
<!--Content-->
<div class="col-md-9">
<div id="section1">
<div class="bg-franklin bg-img centered-a">
<div class="caption" style="border:10px; border-color:white;">
<img src="img/products/franklin.png" style="width:50%; background-color:white;"></img>
</div>
</div>
<p style="margin-left:10px; margin-right:10px; font-size: 1.2em; text-align:left;padding: 0% 3%;">
</br>
</br></br>
</br></br>
</p>
</div>
<div id="section2">
<div class="bg-franklin bg-img centered-a">
<div class="caption" style="border:10px; border-color:white;">
<img src="img/products/franklin.png" style="width:50%; background-color:white;"></img>
</div>
</div>
<p style="margin-left:10px; margin-right:10px; font-size: 1.2em; text-align:left;padding: 0% 3%;">
</br>
</br></br>
</br></br>
</p>
</div>
</div>
</div>
</div>
<?php include("includes/footer-ee.php"); ?>
footer-ee.php
</body>
<footer>
<div class="footer-blk row">
<div style="float: none;text-align: center;">
Home | Terms and Conditions | Privacy Policy
</div>
<div style="float: none;text-align: center;">
</div>
</div>
</footer>
The problem is following
I create a PHP (CodeIgniter) project and want to construct Home Page
view/pages/home.php and over here I have this code:
Home.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Car Sharing</title>
<!-- Bootstrap Core CSS -->
<link href="assets/lib/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- Additional fonts for this theme -->
<link href="assets/lib/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<link href='https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Merriweather:400,300,300italic,400italic,700,700italic,900,900italic' rel='stylesheet' type='text/css'>
<!-- Plugin CSS -->
<link href="assets/lib/magnific-popup/magnific-popup.css" rel="stylesheet">
<!-- Theme CSS -->
<link href="assets/css/creative.min.css" rel="stylesheet">
</head>
<body id="page-top">
<header>
<div class="header-content">
<div class="header-content-inner">
<h1 id="homeHeading">Putujmo Zajedno</h1>
<hr>
<p>Tražiš prevoz?</p>
<p>ili samo putuješ negdje?</p>
Postavi Oglas
</div>
</div>
</header>
<section class="bg-primary" id="about">
<div class="container">
<div class="row">
<div class="col-lg-8 offset-lg-2 text-center">
<h2 class="section-heading text-white">We've got what you need!</h2>
<hr class="light">
<p class="text-faded">Putujmo zajedno - web stranica je naredni korak razvijanja ideje o djeljenju prevoza (carpooling) u Bosni i Hercegovini ali i šire, započeta putem društvene mreže Facebook od strane nekoliko aktivista i volontera.
Za nešto više od godinu dana, grupa na Facebook mreži je prešla 12 000 članova, sa nekoliko stotina oglasa mjesečno. Ovaj broj u razvoju saobraćajnih sistema predstavlja broj korisnika koji svojim prisustvom imaju potrebu za novim načinom prevoza, te organizovanja i komuniciranja unutar istog. To je bio još jedan razlog za pokretanje ove web stranice koja ima za cilj da olakša postavljanje oglasa za nuđenje i traženje prevoza, kao i pregled već postavljenih oglasa.
Uzevši u obzir da su ovo pionirski koraci na našim prostorima, otvoreni smo za sve prijedloge, kritike i svakako pohvale. Cijeli projekat dijeljenja prevoza je zasnovan na volonterskom radu i resursima pojedinaca, tako da je svaka vrsta podrške više nego dobrodošla.
Pored ove web stranice, grupa "Tražim- nudim prevoz" na Facebooku ostaje i dalje aktivna i operativna.</p>
</div>
</div>
</div>
</section>
<section id="services">
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<h2 class="section-heading">ZAŠTO PODIJELITI VOŽNJU?</h2>
<hr class="primary">
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-lg-3 col-md-6 text-center">
<div class="service-box">
<i class="fa fa-4x fa-diamond text-primary sr-icons"></i>
<h3>Jeftinije je</h3>
</div>
</div>
<div class="col-lg-3 col-md-6 text-center">
<div class="service-box">
<i class="fa fa-4x fa-paper-plane text-primary sr-icons"></i>
<h3>Brinemo o životnoj sredini</h3>
</div>
</div>
<div class="col-lg-3 col-md-6 text-center">
<div class="service-box">
<i class="fa fa-4x fa-newspaper-o text-primary sr-icons"></i>
<h3>Brze je</h3>
</div>
</div>
<div class="col-lg-3 col-md-6 text-center">
<div class="service-box">
<i class="fa fa-4x fa-heart text-primary sr-icons"></i>
<h3>Društvenije je</h3>
</div>
</div>
</div>
</div>
</section>
<section class="no-padding" id="portfolio">
<div class="container-fluid">
<div class="row no-gutter popup-gallery">
<div class="col-lg-4 col-sm-6">
<a href="assets/images/HomePage/portfolio/fullsize/Beograd.jpg" class="portfolio-box">
<img src="assets/images/HomePage/portfolio/fullsize/Beograd.jpg" class="img-fluid" alt="">
<div class="portfolio-box-caption">
<div class="portfolio-box-caption-content">
<div class="project-category text-faded">
Beograd
</div>
</div>
</div>
</a>
</div>
<div class="col-lg-4 col-sm-6">
<a href="assets/images/HomePage/portfolio/fullsize/Novi Sad.jpg" class="portfolio-box">
<img src="assets/images/HomePage/portfolio/fullsize/Novi Sad.jpg" class="img-fluid" alt="">
<div class="portfolio-box-caption">
<div class="portfolio-box-caption-content">
<div class="project-category text-faded">
Novi Sad
</div>
</div>
</div>
</a>
</div>
<div class="col-lg-4 col-sm-6">
<a href="assets/images/HomePage/portfolio/fullsize/Sarajevoo.jpg" class="portfolio-box">
<img src="assets/images/HomePage/portfolio/fullsize/Sarajevoo.jpg" class="img-fluid" alt="">
<div class="portfolio-box-caption">
<div class="portfolio-box-caption-content">
<div class="project-category text-faded">
Sarajevo
</div>
</div>
</div>
</a>
</div>
<div class="col-lg-4 col-sm-6">
<a href="assets/images/HomePage/portfolio/fullsize/Zagreb.jpg" class="portfolio-box">
<img src="assets/images/HomePage/portfolio/fullsize/Zagreb.jpg" class="img-fluid" alt="">
<div class="portfolio-box-caption">
<div class="portfolio-box-caption-content">
<div class="project-category text-faded">
Zagreb
</div>
</div>
</div>
</a>
</div>
<div class="col-lg-4 col-sm-6">
<a href="assets/images/HomePage/portfolio/fullsize/Ljubljana.jpg" class="portfolio-box">
<img src="assets/images/HomePage/portfolio/fullsize/Ljubljana.jpg" class="img-fluid" alt="">
<div class="portfolio-box-caption">
<div class="portfolio-box-caption-content">
<div class="project-category text-faded">
Ljubljana
</div>
</div>
</div>
</a>
</div>
<div class="col-lg-4 col-sm-6">
<a href="assets/images/HomePage/portfolio/fullsize/Wien.jpg" class="portfolio-box">
<img src="assets/images/HomePage/portfolio/fullsize/Wien.jpg" class="img-fluid" alt="">
<div class="portfolio-box-caption">
<div class="portfolio-box-caption-content">
<div class="project-category text-faded">
Wien
</div>
</div>
</div>
</a>
</div>
</div>
</div>
</section>
<aside class="bg-dark">
<div class="container text-center">
<div class="call-to-action">
</div>
</div>
</aside>
<section id="contact">
<div class="container">
<div class="row">
<div class="col-lg-8 offset-lg-2 text-center">
<h2 class="section-heading">Let's Get In Touch!</h2>
<hr class="primary">
<p>Ready to start your next trip with us? That's great! Give us a call or send us an email and we will get back to you as soon as possible!</p>
</div>
<div class="col-lg-4 offset-lg-2 text-center">
<i class="fa fa-phone fa-3x sr-contact"></i>
<p>062/266-198</p>
</div>
<div class="col-lg-4 text-center">
<i class="fa fa-envelope-o fa-3x sr-contact"></i>
<p>demirmahmutovic#gmail.com</p>
</div>
</div>
</div>
</section>
<script src="assets/lib/jquery/jquery.js"></script>
<script src="assets/lib/tether/tether.min.js"></script>
<script src="assets/lib/bootstrap/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
<script src="assets/lib/scrollreveal/scrollreveal.min.js"></script>
<script src="assets/lib/magnific-popup/jquery.magnific-popup.min.js"></script>
<script src="assets/js/creative.min.js"></script>
</body>
</html>
And also I have header/footer which is contructed, the code is belowe for header
Header.php
<html>
<head>
<title>Car Sharing</title>
<link rel="stylesheet" href="https://bootswatch.com/darkly/bootstrap.min.css"/>
<link rel="stylesheet" href="<?php echo base_url()?>assets/css/style.css">
</head>
<body>
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="<?php echo base_url()?>pages/home">Car Sharing</a>
</div>
<ul class="nav navbar-nav">
<?php if($this->session->userdata('logged_in')):?>
<li>Postavi Oglas</li>
<li>Postavi Kategoriju</li>
<li>Kategorije</li>
<li>Sve voznje</li>
<li>O nama</li>
<li>Contact</li>
<li>Log out</li>
<?php endif;?>
</ul>
<ul class="nav navbar-nav navbar-right">
<?php if(!$this->session->userdata('logged_in')):?>
<li><span class="glyphicon glyphicon-user"></span> Registruj Se</li>
<li><span class="glyphicon glyphicon-log-in"></span> Login</li>
<?php endif ;?>
</ul>
</div>
</nav>
<div class="container">
<?php if($this->session->flashdata('user_registred')):?>
<?php echo '<p class="alert alert-success">'.$this->session->flashdata('user_registred').'</p>'?>
<?php endif;?>
<?php if($this->session->flashdata('post_created')):?>
<?php echo '<p class="alert alert-success">'.$this->session->flashdata('post_created').'</p>'?>
<?php endif;?>
<?php if($this->session->flashdata('post_updated')):?>
<?php echo '<p class="alert alert-success">'.$this->session->flashdata('post_updated').'</p>'?>
<?php endif;?>
<?php if($this->session->flashdata('category_creted')):?>
<?php echo '<p class="alert alert-success">'.$this->session->flashdata('category_created').'</p>'?>
<?php endif;?>
<?php if($this->session->flashdata('post_deleted')):?>
<?php echo '<p class="alert alert-success">'.$this->session->flashdata('post_deleted').'</p>'?>
<?php endif;?>
<?php if($this->session->flashdata('login_failed')):?>
<?php echo '<p class="alert alert-danger">'.$this->session->flashdata('login_failed').'</p>'?>
<?php endif;?>
<?php if($this->session->flashdata('user_loggedin')):?>
<?php echo '<p class="alert alert-success">'.$this->session->flashdata('user_loggedin').'</p>'?>
<?php endif;?>
<?php if($this->session->flashdata('user_loggedout')):?>
<?php echo '<p class="alert alert-success">'.$this->session->flashdata('user_loggedout').'</p>'?>
<?php endif;?>
<?php if($this->session->flashdata('category_deleted')):?>
<?php echo '<p class="alert alert-success">'.$this->session->flashdata('category_deleted').'</p>'?>
<?php endif;?>
And output of these two look like this:
When I delete my header/footer.php file my other web-site tabs are without css.
What I need to do to make Home Page normal
try to wrap your ul with navbar-collapse collapse
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="<?php echo base_url()?>pages/home">Car Sharing</a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<!-- -->
</ul>
<ul class="nav navbar-nav navbar-right">
<!-- -->
</ul>
</div>
</div>
</nav>
also make sure your li have following properties applied
.navbar-nav > li {
float: left;
}