Footer Repeats Itself - php

I'm designing this website and I need it to be .php to communicate with a database and start some countdown clocks (which aren't up yet). The page was originally .html and everything was perfect, but since I changed it to .php for some reason the footer keeps repeating itself. The code will be fine on my editor, I'll load the page, reload the file on the editor and the code somehow appears there all on its own!
Right now there is no PHP code whatsoever, I merely changed the file's extension. If you visit the same URL but the .html version, you'll see everything is fine. What could be causing this?
Thanks in advance for your help!
EDIT:
Entire HTML Code:
<!DOCTYPE HTML>
<html>
<head>
<title>Aqua</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<link href="http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,700,900,300italic" rel="stylesheet" />
<script src="js/jquery-1.8.3.min.js"></script>
<script src="css/5grid/init.js?use=mobile,desktop,1000px&mobileUI=1&mobileUI.theme=none&mobileUI.titleBarOverlaid=1&viewport_is1000px=1060"></script>
<script src="js/jquery.dropotron-1.2.js"></script>
<script src="js/init.js"></script>
<noscript>
<link rel="stylesheet" href="css/5grid/core.css" />
<link rel="stylesheet" href="css/5grid/core-desktop.css" />
<link rel="stylesheet" href="css/5grid/core-1200px.css" />
<link rel="stylesheet" href="css/5grid/core-noscript.css" />
<link rel="stylesheet" href="css/style.css" />
<link rel="stylesheet" href="css/style-desktop.css" />
</noscript>
<!--[if lte IE 8]><link rel="stylesheet" href="css/ie8.css" /><![endif]-->
<!-- Photo gallery stuff -->
<link rel="stylesheet" href="css/slideshow/slideshow.css">
<style>
.slideshow { margin-left: 24.45%; }
</style>
<script src="js/mootools-1.3.2-core.js"></script>
<script src="js/mootools-1.3.2.1-more.js"></script>
<script src="js/slideshow.js"></script>
<script>
window.addEvent('domready', function(){
var data = { 'pic07.jpg': {/*No captions, thumbnails or anything*/}, 'pic06.jpg': {}, 'pic10.jpg': {}, 'pic02.jpg': {}};
new Slideshow('slideshow', data, { controller: false, thumbnails: false, loader: false, height: 400, width: 600, hu: 'images/', transition: 'back:in:out'});
});
</script>
<!--End-->
</head>
<body class="homepage">
<!-- Header Wrapper -->
<div id="header-wrapper">
<div class="5grid-layout">
<div class="row">
<div class="12u">
<!-- Header -->
<section id="header">
<!-- Logo -->
<img class="logo" src="images/aqua.jpg">
<!-- Nav -->
<nav id="nav" class="mobileUI-site-nav">
<ul>
<li class="current_page_item">Home</li>
<li>Photos</li>
<li>Videos</li>
<li>Store</li>
<li>About Us</li>
<li>Contact</li>
</ul>
</nav>
</section>
</div>
</div>
<div class="row">
<div class="12u">
<!-- Banner -->
<section id="banner">
<div id="slideshow" class="slideshow"></div>
</section>
</div>
</div>
<div class="row">
<div class="12u">
<!-- Intro -->
<section id="intro">
<div class="actions">
Get Started
Learn More
</div>
</section>
</div>
</div>
</div>
</div>
<!-- Footer Wrapper -->
<div id="footer-wrapper">
<!-- Footer -->
<section id="footer" class="5grid-layout">
<div class="row">
<div class="4u">
<section>
<header>
<h2>Links</h2>
</header>
<ul class="divided">
<li>Events/Tickets</li>
<li>Photos</li>
<li>Videos</li>
<li>Store</li>
<li>About Us</li>
<li>Contact</li>
</ul>
</section>
</div>
<div class="4u">
<section>
<header>
<h2>Connect with us</h2>
</header>
<ul class="social">
<li class="facebook">Facebook</li>
<li class="twitter">Twitter</li>
</ul>
<ul class="contact">
<li>
<h3>Address</h3>
<p>
Aqua, LLC<br />
39 Old Ridgebury Road<br />
Danbury, CT 06810
</p>
</li>
<li>
<h3>Phone</h3>
<p>(800) 000-0000</p>
</li>
</ul>
</section>
</div>
</div>
<div class="row">
<div class="12u">
<!-- Copyright -->
<div id="copyright">
<ul class="links">
<li>© Aqua, LLC</li>
<li>Images: Dreametry Doodle + Iconify.it</li>
<li>Design: HTML5 Up! + Daytaro</li>
</ul>
</div>
</div>
</div>
</section>
</div>
</body>
</html>
It's repeated really awkwardly after that. It might the FTP server, I use Koding (don't ask) for this and it's connected to my server via FTP. I tried using FileZilla too (didn't delete files before re-uploading) but that didn't do anything.

Make sure you delete the file before uploading it. Some FTP clients will write over with some extra code...

Related

CSS in Public dont work in Show Controller

show function can't get the files in public
I tried in other controller without resources it can read the css at img in public sorry for my english
public function show($id)
{
$brand = Brand::where('c_id', $id)->get();
return view('brand.pick')->with('brand',$brand);
}
This is my HTML blade file
#extends('layouts.app')
#section('content')
#foreach($brand as $b)
<option value="{{$b->b_name}}" selected>{{$b->b_name}}
</option>
#endforeach
the page don't have css and image
This is in Index function the css is working when I run in show function
This is my Blade file Layout.app
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1,
shrink-to-fit=no">
<title>{{config ('app.name')}}</title>
<link rel="icon" href="img/favicon.png">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="css/bootstrap.min.css">
<!-- animate CSS -->
<link rel="stylesheet" href="css/animate.css">
<!-- owl carousel CSS -->
<link rel="stylesheet" href="css/owl.carousel.min.css">
<!-- themify CSS -->
<link rel="stylesheet" href="css/themify-icons.css">
<!-- flaticon CSS -->
<link rel="stylesheet" href="css/flaticon.css">
<!-- font awesome CSS -->
<link rel="stylesheet" href="css/magnific-popup.css">
<!-- swiper CSS -->
<link rel="stylesheet" href="css/swiper.min.css">
<!-- style CSS -->
<link rel="stylesheet" href="css/style.css">
</head>
<body>
#include('inc.nav');
#yield('content');
<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>
<!-- footer part start-->
<section class="footer-area section_padding">
<div class="container">
<div class="row">
<div class="col-xl-2 col-sm-4 mb-4 mb-xl-0 single-footer-
widget">
<h4>Top Products</h4>
<ul>
<li>Managed Website</li>
<li>Manage Reputation</li>
<li>Power Tools</li>
<li>Marketing Service</li>
</ul>
</div>
<div class="col-xl-2 col-sm-4 mb-4 mb-xl-0 single-footer-widget">
<h4>Quick Links</h4>
<ul>
<li>Jobs</li>
<li>Brand Assets</li>
<li>Investor Relations</li>
<li>Terms of Service</li>
</ul>
</div>
<div class="col-xl-2 col-sm-4 mb-4 mb-xl-0 single-footer-
widget">
<h4>Features</h4>
<ul>
<li>Jobs</li>
<li>Brand Assets</li>
<li>Investor Relations</li>
<li>Terms of Service</li>
</ul>
</div>
<div class="col-xl-2 col-sm-4 mb-4 mb-xl-0 single-footer-
widget">
<h4>Resources</h4>
<ul>
<li>Guides</li>
<li>Research</li>
<li>Experts</li>
<li>Agencies</li>
</ul>
</div>
<div class="col-xl-4 col-sm-8 col-md-8 mb-4 mb-xl-0 single-
footer-widget">
<h4>Newsletter</h4>
<p>You can trust us. we only send promo offers,</p>
<div class="form-wrap" id="mc_embed_signup">
<form target="_blank"
action="https://spondonit.us12.list-manage.com/subscribe/post?
u=1462626880ade1ac87bd9c93a&id=92a4423d01" method="get" class="form-
inline">
<input class="form-control" name="EMAIL"
placeholder="Your Email Address" onfocus="this.placeholder = ''"
onblur="this.placeholder = 'Your Email Address '" required=""
type="email">
<button class="click-btn btn btn-default text-
uppercase">subscribe</button>
<div style="position: absolute; left: -5000px;">
<input
name="b_36c4fd991d266f23781ded980_aefe40901a" tabindex="-1" value=""
type="text">
</div>
<div class="info"></div>
</form>
</div>
</div>
</div>
</div>
</section>
<footer class="copyright_part bottom">
<div class="container">
<div class="row align-items-center ">
<p class="footer-text m-0 col-lg-8 col-md-12"><!-- Link back
to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
Copyright ©<script>document.write(new Date().getFullYear());</script>
All
rights reserved | This template is made with <i class="ti-heart" aria-
hidden="true"></i> by <a href="https://colorlib.com"
target="_blank">Colorlib</a>
<!-- Link back to Colorlib can't be removed. Template is licensed under CC
BY
3.0. --></p>
<div class="col-lg-4 col-md-12 text-center text-lg-right
footer-social">
<i class="ti-facebook"></i>
<i class="ti-twitter"></i>
<i class="ti-instagram"></i>
<i class="ti-skype"></i>
</div>
</div>
</div>
</footer>
<!-- footer part end-->
<!-- jquery plugins here-->
<!-- jquery -->
<script src="js/jquery-1.12.1.min.js"></script>
<!-- popper js -->
<script src="js/popper.min.js"></script>
<!-- bootstrap js -->
<script src="js/bootstrap.min.js"></script>
<!-- aos js -->
<script src="js/aos.js"></script>
<!-- easing js -->
<script src="js/jquery.magnific-popup.js"></script>
<!-- swiper js -->
<script src="js/swiper.min.js"></script>
<!-- swiper js -->
<script src="js/masonry.pkgd.js"></script>
<!-- particles js -->
<script src="js/owl.carousel.min.js"></script>
<!-- carousel js -->
<script src="js/swiper.min.js"></script>
<!-- swiper js -->
<script src="js/swiper_custom.js"></script>
<!-- custom js -->
<script src="js/custom.js"></script>
<script src="{{ asset('js/app.js') }}"></script>
</body>
</html>
Use asset helper of laravel.
<link rel="stylesheet" href="{{ asset('css/bootstrap.min.css') }}">
By default asset helper will search path inside public folder, or you can configure asset url in .env file.
https://laravel.com/docs/5.8/helpers#method-asset

Cake PHP Theme integration

I have following html/css theme and trying to convert it to cake php theme.
I was reading through tutorials but I just don't understand it. Either css file is not working or the content is not displaying.
<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>Shedule Me</title>
<!-- Bootstrap Core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- Theme CSS -->
<link href="css/styles.css" rel="stylesheet">
<!-- Custom Fonts -->
<link href="framework/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800" rel="stylesheet">
<!-- Navigation -->
<nav id="mainNav" class="navbar navbar-default navbar-custom">
<div class="container header">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header page-scroll">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span><i class="fa fa-bars"></i>
</button>
<a class="navbar-brand logo-text" href="#page-top">New Theme</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li class="hidden">
</li>
<li class="page-scroll">
Home
</li>
<li class="page-scroll">
About
</li>
<li class="page-scroll">
Services
</li>
<li class="page-scroll">
Contact Us
</li>
</ul>
</div>
<!-- /.navbar-collapse -->
</div>
<!-- /.container-fluid -->
</nav>
<!-- Header -->
<section>
<div class="container">
<div class="row">
<div class="col-md-7">
<img src="img/benner.png" alt="Banner" class="img-responsive" />
</div>
<div class="col-md-5">
<div class="card">
<h3 class="title-log">Already a Member?</h3>
<label>
Email
<input style="display:block;margin:0 auto;" type="text"/>
</label>
<label>
Password
<input style="display:block;margin:0 auto;" type="password"/>
</label>
<input type="button" value="Log in" class="elevator"/>
<h3>Not a Member?</h3>
Sign up
</div>
</div>
</div>
</div>
</section>
<!-- jQuery -->
<script src="framework/jquery/jquery.min.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="framework/bootstrap/js/bootstrap.min.js"></script>
webroot/
custom/ <-- custom css/js plugin folder, for example datepicker plugin
css/
js/
css/
img/
js/
CSS
// load css from css folder, example.com/css/bootstrap.min.css
<?= $this->Html->css('bootstrap.min') ?>
// load css from custom folder, example.com/custom/bootstrap.min.css
<?= $this->Html->css('/custom/bootstrap.min') ?>
// load remote / cdn css file, note without http or https
<?= $this->Html->css('//fonts.googleapis.com/css?family=Montserrat:400,700') ?>
JS / jQuery
// load js file from js folder, example.com/js/bootstrap.min.js
<?= $this->Html->js('bootstrap.min') ?>
// load js file from custom folder, example.com/custom/bootstrap.min.js
<?= $this->Html->js('/custom/bootstrap.min') ?>
// load remote / cdn js file, note without http or https
<?= $this->Html->js('//code.jquery.com/jquery-2.2.4.min.js') ?>
read more http://book.cakephp.org/3.0/en/views/helpers/html.html

Why laravel don't show bootstrap from controller?

When I try to return a view from a route like this:
Route::get('/testid', function () {
$id = 1; // for test only
$title = 'Dashboard';
$username=Auth::user()->name;
$job=Auth::user()->job;
$p = 1;
$requestedorder = \App\Order::findOrfail($id);
return view('ViewOrder',compact('requestedorder','title','username','job','p'));
});
in the browser it shows up normally like any bootstrap view
but when this view is returned from a controller
public function show($id)
{
$title = 'Dashboard';
$username=Auth::user()->name;
$job=Auth::user()->job;
$p = 1;
$requestedorder = Order::findOrfail($id);
return view('ViewOrder',compact('requestedorder','title','username','job','p'));
}
the view be like this without any bootstrap or any css or even without images : http://1drv.ms/1m7N8Yk
I noticed that this problem occures in any url with id like this "http://localhost:8000/testid/1"
this is vieworder view
#extends('WDashBoard')
#section('content2')
<div>
<h1>Order Details</h1>
<hr>
<div class="row">
<div class="col-sm-3">
<h5><B>From :</B></h5>
</div>
<div class="col-sm-9">
<h5> {{ $requestedorder->customeremail }}</h5>
</div>
</div>
<div class="row">
<div class="col-sm-3">
<h5><B>Details :</B></h5>
</div>
<div class="col-sm-9">
<h5>{{ $requestedorder->details }}</h5>
</div>
</div>
<div class="row">
<div class="col-sm-3">
<h5><B>Required Work :</B></h5>
</div>
<div class="col-sm-9">
<h5>{{ $requestedorder->requiredwork }}</h5>
</div>
</div>
<div class="row">
<div class="col-sm-3">
<h5><B>Date :</B></h5>
</div>
<div class="col-sm-9">
<h5> {{ $requestedorder->date }}</h5>
</div>
</div>
<div class="row">
<div class="col-sm-3">
<h5><B>Time :</B></h5>
</div>
<div class="col-sm-9">
<h5>{{ $requestedorder->time }}</h5>
</div>
</div>
<div class="row">
<div class="col-sm-3">
<h5><B>Message :</B></h5>
</div>
<div class="col-sm-9">
<h5>{{ $requestedorder->message }}</h5>
</div>
</div>
</div>
#stop
and this is my DashBoard view
#extends('master')
#section('content')
<section class="slider2">
<div class="slider-wrap2">
<h1>DashBoard</h1>
</div>
</section>
<section class="container">
<div class="row">
<div class="col-sm-3">
<div class="dash">
<br><br>
<center><img src="images/default-avatar.png" class="img-responsive img-circle" /></center>
<center><h3> {{ $username }} </h3></center>
<center><h4> {{ $job }} </h4></center>
<br>
<ul class="nav nav-pills nav-stacked">
<li class="nav-header"></li>
<li><a href="/profile"><i class="glyphicon glyphicon-list-alt"></i>
My Profile</a></li>
<li class="divider"></li>
<li><a href="/orders"><i class="glyphicon glyphicon-briefcase"></i>
Requested Orders</a></li>
</ul>
<br><br><br><br>
</div>
</div>
<div class="col-sm-9">
#yield('content2')
</div>
</div>
<br>
</section>
#stop
and this is master view
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>{{ $title }}</title>
<!-- Mobile Specific Metas
================================================== -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- CSS
================================================== -->
<!-- Bootstrap -->
<link href="assets/css/bootstrap.min.css" rel="stylesheet">
<!-- FontAwesome -->
<link rel="stylesheet" href="css/font-awesome.min.css">
<!-- Elegant icon font -->
<link rel="stylesheet" href="css/line-icons.min.css">
<!-- Animation -->
<link rel="stylesheet" href="css/animate.css">
<!-- Prettyphoto -->
<link rel="stylesheet" href="css/prettyPhoto.css">
<!-- Owl Carousel -->
<link rel="stylesheet" href="css/owl.carousel.css">
<link rel="stylesheet" href="css/owl.theme.css">
<!-- Scrolling nav css -->
<link rel="stylesheet" href="css/scrolling-nav.css">
<!-- Template styles-->
<link rel="stylesheet" href="css/style.css">
<!-- Responsive styles-->
<link rel="stylesheet" href="css/responsive.css">
<!-- HTML5 shim and Respond.js for 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.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body data-spy="scroll" data-target=".navbar-fixed-top" >
<!-- Header start -->
<header id="header" role="banner" >
<nav class="navbar navbar-default navbar-fixed-top" id="tf-menu">
<div class="container">
<div class="row">
<!-- Logo start -->
<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>
<div class="navbar-brand">
<a href="#" class="page-scroll">
<img class="img-responsive" src="images/logo1.png" alt="logo">
</a>
</div>
</div><!--/ Logo end -->
<div class="collapse navbar-collapse clearfix navMenu" role="navigation">
<ul class="nav navbar-nav navbar-right">
<li><a class="page-scroll" href="/" >Home</a></li>
<li><a class="page-scroll" href="/about" >About</a></li>
<li><font style="opacity:.1">....................</font></li>
#if($p == 0)
<li><a href="/login" ><small>SignIn</small></a></li>
<li><small>Register</small></li>
#endif
#if($p == 1)
<li><a href="/profile" ><small>hi {{ $username }}</small></a></li>
<li><small>Logout</small></li>
#endif
</ul>
</div><!--/ Navigation end -->
</div><!--/ Row end -->
</div><!--/ Container end -->
</nav>
</header><!--/ Header end -->
<!-- END MAIN NAV -->
#yield('content')
<!-- section Footer start -->
<footer id="footer">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="footer-content text-center">
<a href="#slider-part" class="page-scroll logo-title">
<img src="images/blackbg.png" alt="" class="img-responsive">
</a>
<ul class="footer-socail list-inline">
<li><i class="fa fa-facebook"></i></li>
<li><i class="fa fa-twitter"></i></li>
<li><i class="fa fa-linkedin"></i></li>
</ul>
</div>
<hr>
<div class="row">
<div class="col-md-6">
<div class="copyright">
<p> copyright © <span>mycompany</span> - 2015</p>
</div>
</div>
<div class="col-md-6">
</div>
</div>
</div>
</div> <!-- row end -->
</div> <!-- container end -->
</footer>
<!-- section Footer end -->
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="assets/js/bootstrap.min.js"></script>
<!-- initialize jQuery Library -->
<script type="text/javascript" src="js/jquery.js"></script>
<!-- Bootstrap jQuery -->
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<!-- Style Switcher -->
<script type="text/javascript" src="js/isotope.js"></script>
<!-- Owl Carousel -->
<script type="text/javascript" src="js/owl.carousel.js"></script>
<!-- PrettyPhoto -->
<script type="text/javascript" src="js/jquery.prettyPhoto.js"></script>
<!-- Isotope -->
<script type="text/javascript" src="js/isotope.js"></script>
<!-- Wow Animation -->
<script type="text/javascript" src="js/wow.min.js"></script>
<!-- SmoothScroll -->
<script type="text/javascript" src="js/smooth-scroll.js"></script>
<!-- Eeasing -->
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<!-- Counter -->
<script type="text/javascript" src="js/jquery.counterup.min.js"></script>
<!-- Waypoints -->
<script type="text/javascript" src="js/jquery.waypoints.min.js"></script>
<!-- Scrolling navigation -->
<script type="text/javascript" src="js/scrolling-nav.js"></script>
<!-- Google Map API Key Source -->
<!--<script src="http://maps.google.com/maps/api/js?sensor=false"></script>-->
<!-- Custom js -->
<script type="text/javascript" src="js/custom.js"></script>
<script type="text/javascript" src="js/mapjs.js"></script>
<script>
new WOW().init();
</script>
<script>
$('.counter').counterUp({
delay: 100,
time: 2000
});
</script>
</body>
</html>
please help me
thanks in advance
I'm assuming you're using relative paths in your HTML that are not properly mapping to your assets through your 'folder' structure.
Have you wrapped your asset URLs in the asset() helper function in your view?
<link href="{{ asset( 'path/to/asset' ) }}" rel="stylesheet">
<img src="{{ asset( 'path/to/image' ) }}">
Remember, use of the / means you're in a 'subfolder' in traditional URL-to-Unix-style path mapping, so your asset references need to account for that.
Thankfully, Laravel makes this super easy with the URL helper functions.

Passing values over two pages PHP

Just trying to refresh my memory of PHP and have come across this problem. Im trying to pass a value from one page to another. I have been trying session variables and have called session_start(). Even when setting the variable on the page = 'string' it prints nothing. What am I doing wrong here? Im trying to get the value of the # of stars and the textarea from the contactus page to the review.php page
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Contact</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
<link rel="stylesheet" href="Icons/icon-pack-custom.css" />
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<style>
[data-role=page]{height: 100% !important; position:relative !important;}
[data-role=footer]{bottom:0; position:absolute !important; top: auto !important; width:100%;}
#banner img {
width:100%;
}
.ui-collapsible {
width:130px;
}
</style>
</head>
<body>
<!-- Start of first page: #one -->
<div data-role="page" id="home" data-theme="b">
<div data-role="header" >
<h1>Forever Fitness</h1>
<nav data-role="navbar" data-iconpos="left">
<ul>
<li>Home</li>
<li>Products</li>
<li>Contact Us</li>
</ul>
</nav>
</div><!-- /header -->
<div data-role="content" >
</div><!-- /content -->
<div data-role="controlgroup">
<p>
<?php
session_start();
echo $_SESSION['ta'] = 'string';
?>
</p>
Home
Back
</div>
</div><!-- /page one -->
START OF THE NEXT PAGE
<?php
session_start();
$_SESSION['ta'] = 'string';
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Citizenship Canada</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
<link rel="stylesheet" href="Icons/icon-pack-custom.css" />
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<style>
[data-role=page]{height: 100% !important; position:relative !important;}
[data-role=footer]{bottom:0; position:absolute !important; top: auto !important; width:100%;}
#banner img {
width:100%;
}
.ui-collapsible {
}
</style>
</head>
<body>
<!-- Start of first page: #one -->
<div data-role="page" id="home" data-theme="b">
<div data-role="header" >
<h1>Forever Fitness</h1>
<nav data-role="navbar" data-iconpos="left">
<ul>
<li><a href="index.html" data-icon="home" >Home</a></li>
<li><a href="provinces.html" data-icon="shop" >Products</a></li>
<li>Contact Us</li>
</ul>
</nav>
</div><!-- /header -->
<div data-role="content">
<div data-role="collapsible" data-collapsed-icon="phone" data-expanded-icon="phone">
<h4>Contact By Phone</h4>
<ul data-role="listview" data-inset="true">
<li>1-800-991-1929 Toll Free</li>
</ul>
</div>
<div data-role="collapsible" data-collapsed-icon="phone" data-expanded-icon="phone">
<h4>Contact By Email</h4>
<ul data-role="listview" data-inset="true">
<li>Send an Email</li>
</ul>
</div>
<ul data-role="listview" data-inset="true">
<li>Write a Review</li>
</ul>
</div>
</div>
<div data-role="page" id="r" data-theme="b">
<div data-role="content" >
<h2 style="text-align:center;">Write a Review</h2>
<form action="review.php" method="get">
<label for="stars">Stars</label>
<input type="range" name="stars" id="stars" value="5" min="0" max="5" data-highlight="true" />
<div data-role="fieldcontain">
<label for="textarea">Your Review</label>
<textarea name="textarea" id="textarea"></textarea></br>
<input type="submit"value="submit" data-theme="b">
</div>
</form>
</div><!-- /content -->
<div data-role="controlgroup">
Home
Back
</div>
</div><!-- /page one -->
</html>
First page - define session variable
<?php
session_start();
$_SESSION['ta'] = 'string';
?>
On second page - display the session variable
<?php
session_start();
echo $_SESSION['ta'];
?>

foundation menu is not working in CodeIgniter

I'am new to foundation framework and i trying to integrate foundation with CodeIgniter. Everything working but menu portion is not working. it seems the style is not effecting the menu. its been 2-3 days i'am working on this, please help me to solve this.
<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Foundation | Welcome</title>
<link rel="stylesheet" href="<?php echo base_url().'public/lib/found/'; ? >
css/foundation.css" />
<script src="<?php echo base_url().'public/lib/found/'; ?>js/vendor/
modernizr.js"> </script>
<style>
.columns
{
border:1px solid red;
}
</style>
</head>
<body>
<div class="row">
<nav class="top-bar" data-topbar>
<ul class="title-area">
<li class="name">
<h1>My Site</h1>
</li>
<li class="toggle-topbar menu-icon">Menu</li>
</ul>
<section class="top-bar-section">
<!-- Right Nav Section -->
<ul class="right">
<li class="active">Right Button Active</li>
<li class="has-dropdown">
Right Button Dropdown
<ul class="dropdown">
<li>First link in dropdown</li>
</ul>
</li>
</ul>
<!-- Left Nav Section -->
<ul class="left">
<li>Left Nav Button</li>
</ul>
</section>
</nav>
</div>
<div class="row">
<div class="large-4 columns"><br/><br/></div>
<div class="large-8 columns"><br/><br/></div>
</div>
<script src="<?php echo base_url().'public/lib/found/'; ?>js/vendor/
jquery.js"> </script>
<script src="<?php echo base_url().'public/lib/found/'; ?>js/
foundation.min.js"></script>
<script>
$(document).foundation();
</script>
</body>
</html>
I find the problem. I only added the file which i included in the html page like modernizr.js, foundation.min.js, foundation.css ..etc. But when i added entire foundation folder to my new application its works.

Categories