Yield functions doesn't load particular sections in other files.
Route
Route::get('/', function () {
return view('add-listing');
});
add-listing.blade.php
#extends('layout')
#section('body')
This is add-listing page
#stop
header.blade.php
#extends('layout')
#section('header')
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<title>Find Do Responsive Directory Template</title>
<link rel="stylesheet" type="text/css" href="css/master.css">
<link rel="stylesheet" type="text/css" href="css/color-green.css">
<link rel="stylesheet" type="text/css" href="css/app.css">
<link rel="shortcut icon" href="images/short_icon.png">
#stop
layout.blade.php
<!DOCTYPE html>
<html lang="en">
<head>
#yield('header')
</head>
<body>
#yield('body')
</body>
When I run this only the #section('body') content is loading. It doesn't load the #section('header'). Why is that?
You may use #include('header') in layout :
<!DOCTYPE html>
<html lang="en">
<head>
#include('header')
</head>
<body>
#yield('body')
</body>
header.blade.php :
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<title>Find Do Responsive Directory Template</title>
<link rel="stylesheet" type="text/css" href="css/master.css">
<link rel="stylesheet" type="text/css" href="css/color-green.css">
<link rel="stylesheet" type="text/css" href="css/app.css">
<link rel="shortcut icon" href="images/short_icon.png">
In this example you call add-listing.blade.php and in this file just you said call layout.blade so your blades don't call header.blade just prepare a section for get header contents and you don't call header.blade in your flow.
Yield is such as a variable that can be set by section:
#yield('header') ~ echo $header
#section('header')
header value is here
#endsection
So $header = header value is here.
Related
I don't understand how this happen.
In my index.php, i require the page header.php :
<?php require("view/viewHeader.php");
Which contains this :
<!DOCTYPE html>
<html lang="fr">
<head>
<title>Mon systeme</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="manifest" href="manifest.json" />
<link rel="stylesheet" href="css/global.css" />
</head>
<body>
<div id="content">
So how i get this on the final page ?
link outside the head
The index.php has 165 lines, so i show you the beginning of the switch where the require call the viewHeader.php :
switch ($action) {
case 'ajout':
$menuTitre = "Ajout";
require("view/viewHeader.php");
require("view/viewMenuEnTete.php");
require("view/viewAjout.php");
require("view/viewFooter.php");
break;
Yes in the source it is alright
<div id="debug">ACTION: string(5) "ajout"
<br/>RECH: NULL
<br/><hr />POST<br/>array(1) {
["action"]=>
string(5) "ajout"
}
<hr /></div><!DOCTYPE html>
<html lang="fr">
<head>
<title>Mon systeme</title>
<link rel="manifest" href="manifest.json" />
<link rel="stylesheet" href="css/global.css" />
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>
<body>
<div id="content">
But the manifest is not detected. I thought there were a problem with the head mixed up.
I get rid of the small div in top, but it doesn't change anything :(
<!DOCTYPE html>
<html lang="fr">
<head>
<title>Mon systeme</title>
<link rel="manifest" href="manifest.json" />
<link rel="stylesheet" href="css/global.css" />
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>
<body>
<div id="content">
In my localhost the program runs well, but when I deploy it to heroku it doesn't show anything Like this and this is my folder This. Here my index code:
<?php
session_start();
?>
<!DOCTYPE html>
<html lang="ina">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Lovanto Blog</title>
<link href="css/bootstrap-4.0.0.css" rel="stylesheet">
<link href="css/styles.css" rel="stylesheet">
<link href="css/modal.css" rel="stylesheet">
<script src="js/jquery.min.js"></script>
<link rel="icon" href="icon.ico" type="image/x-icon" />
</head>
<body>
<?php
require 'vendor/autoload.php';
require 'cloudinary/vendor/autoload.php';
require 'cloudinary/config.php';
include 'conn.php';
include 'code/clock.php';
include 'view/header.php';
include 'view/body.php';
include 'view/footer.php';
?>
</body>
</html>
And this is my Procfile
web: vendor/bin/heroku-php-apache2
When I use pgp require it moves the head content on the included file into the body tags, I've explored questions somewhat related to my problem but none have solved my problem.
index.php:
<!DOCTYPE html>
<html>
<head></head>
<body></body>
</html>
<?php
require '/home/sethfreeman/public_html/subdomains/gwd/navigation/header/header.html';
?>
Included File:
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="http://sethjfreeman.com/subdomains/gwd/assets/css/header.css" type="text/css">
<link rel="stylesheet" href="http://sethjfreeman.com/subdomains/gwd/assets/libs/bootstrap/css/bootstrap.css" media="screen">
<link rel="stylesheet" href="http://sethjfreeman.com/subdomains/gwd/assets/libs/bootstrap/css/bootstrap-responsive.css" media="screen">
</head>
<body>
<div class="container"></div>
<script src="http://sethjfreeman.com/subdomains/gwd/assets/js/jquery-3.1.1.js"></script>
<script src="http://sethjfreeman.com/subdomains/gwd/assets/libs/bootstrap/js/bootstrap.min.js"></script>
</body>
</html>
Chrome Output:
<!DOCTYPE html>
<html lang="en">
<head></head>
<body>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="http://sethjfreeman.com/subdomains/gwd/assets/css/header.css" type="text/css">
<link rel="stylesheet" href="http://sethjfreeman.com/subdomains/gwd/assets/libs/bootstrap/css/bootstrap.css" media="screen">
<link rel="stylesheet" href="http://sethjfreeman.com/subdomains/gwd/assets/libs/bootstrap/css/bootstrap-responsive.css" media="screen">
<div class="container"></div>
<script src="http://sethjfreeman.com/subdomains/gwd/assets/js/jquery-3.1.1.js"></script>
<script src="http://sethjfreeman.com/subdomains/gwd/assets/libs/bootstrap/js/bootstrap.min.js"></script>
</body>
</html>
"Require isn't smart. It's simply going to dump the contents of the required file where it's invoked. If you want some code in the head portion, put that in a separate file and require it in the correct place." - Major Productions LLC
To close this question.
I am using PHP (DOMDocument and DOMXPath classes to be more precise) to modify the content of an HTML file (for the moment I just change the title in the head tag and the first element of the body which is an h1).
The functionality is there meaning that I am able to modify what I desire into the document but the output is not keeping the indentation of the original file.
What solutions I found online are referring to XML, having to no effect when it comes to HTML.
My question is how can I keep my original indentation after using DOMXPath? It is even possible using this alone or I should consider some 3rd party library?
My PHP code snippet:
<?php
$dom = new DOMDocument;
$dom->loadHTMLFile($dst . '/index.html');
$xpath = new DOMXPath($dom);
$title_tag = $xpath->query('/html/head/title')->item(0);
$title_tag->nodeValue = $_POST['website-title'];
$body_tag = $xpath->query('/html/body/h1')->item(0);
$body_tag->nodeValue = $_POST['website-title'];
$dom->saveHTMLFile($dst . '/index.html');
?>
Original HTML:
<!DOCTYPE html>
<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">
<title></title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/bootstrap-theme.min.css">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<!--[if lt IE 9]>
<script type="text/javascript" src="js/html5shiv.min.js"></script>
<script type="text/javascript" src="js/respond.min.js"></script>
<![endif]-->
</head>
<body>
<h1>Hello world!</h1>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
</body>
</html>
Output HTML :
<!DOCTYPE html>
<html lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>Test Website</title><link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"><link rel="stylesheet" type="text/css" href="css/bootstrap-theme.min.css"><link rel="icon" type="image/x-icon" href="favicon.ico"><!--[if lt IE 9]>
<script type="text/javascript" src="js/html5shiv.min.js"></script>
<script type="text/javascript" src="js/respond.min.js"></script>
<![endif]--></head><body>
<h1>Test Website</h1>
<script type="text/javascript" src="js/jquery.min.js"></script><script type="text/javascript" src="js/bootstrap.min.js"></script></body></html>
EDIT: After using $dom->formatOutput = true; (thank you PeeHaa for this) before saving the HTML file, the output is the following:
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Test Website</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/bootstrap-theme.min.css">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<!--[if lt IE 9]>
<script type="text/javascript" src="js/html5shiv.min.js"></script>
<script type="text/javascript" src="js/respond.min.js"></script>
<![endif]-->
</head>
<body>
<h1>Test Website</h1>
<script type="text/javascript" src="js/jquery.min.js"></script><script type="text/javascript" src="js/bootstrap.min.js"></script>
</body>
</html>
Header.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="/Contents/css/bootstrap.min.css" rel="stylesheet">
<link href="/Contents/fonts/css/font-awesome.min.css" rel="stylesheet">
<link href="/Contents/css/animate.min.css" rel="stylesheet">
<link href="/Contents/css/custom.css" rel="stylesheet">
<link href="/Contents/css/icheck/flat/green.css" rel="stylesheet">
<script src="/Contents/js/jquery.min.js"></script>
</head>
Login View
<body style="background:#F7F7F7;">
....Html...
</body>
</html>
Login Controller
<?php
class loginController extends CI_Controller {
public function login() {
$this->load->View("template/header");
$this->load->View("login_view");
}
}
?>
Content Folder is present in Root Directory. Below is the structure
When I check this in Browser....css and js files does not load. Kindly suggest the corrective action
Add base_url() for each links, like this,
link href="<?= base_url("Contents/css/bootstrap.min.css") ?>" rel="stylesheet">
Change it in all links.