how to create separate blade for menu , content , sidebar and footer - php

my html code is
<html>
<head>
</head>
<body>
<div id="content">
<div id="menu"></div>
<div id="container"></div>
<div id="sidebar"></div>
<div id="footer"></div>
<div>
</body>
</html>
master.blade.php is
<html>
<head>
#yield('title')
#yield('css')
#yield('js')
</head>
<body>
<div id="content">
<div id="container"></div>
<div>
</body>
</html>
menu.blade.php is
<div id="menu"></div>
sidebar.blade.php is
<div id="sidebar"></div>
footer.blade.php is
<div id="footer"></div>
my view file is home.blade.php
#extends('layouts.master')
#section('title')
<title>:: Login ::</title>
#stop
#section('js')
#stop
#extends('layouts.menu')
#extends('layouts.sidebar')
#extends('layouts.footer')
router.php
Route::get('home', array('uses' => 'HomeController#home'));
HomeController.php is
public function home()
{
return View::make('home');
}
id i run
localhost/project/public/index.php/home
it shows only master blade file content , y sidebar , footer and menu not showing , what is the mistake.

Create a your layout #including your menu:
<html>
<head>
<title>#yield('title')</title>
#yield('css')
#yield('js')
</head>
<body>
<div id="content">
<div id="container">
#include('menu')
#yield('content')
</div>
</body>
</html>
Your menu:
<div id="menu">
<ul>
<li>
Item 1
</li>
<li>
Item 2
</li>
<li>
Item 3
</li>
</ul>
</div>
And your view:
#extends('layouts.master')
#section('title')
:: Login ::
#stop
#section('content')
This is your content!
#stop

Related

#extends and #yield in laravel not working for second blade file

#extends , #section and #yield work for the main welcome page, but I made a new product-gel.blade.php file in view and used the #extends and #section and #endsection on it but it doesnt seem to work.
Here is the yield place
<!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.0">
<title>Document</title>
<link rel="stylesheet" href="..\resources\stylecss\style.css">
#vite(['resources/css/app.css', 'resources/js/app.js'])
<script></script>
</head>
<body>
<div id="app">
<section id="header">
<div class="main-pages-box">
<div class="main-pages">
CUSTOMER CARE
#if (Route::has('login'))
#auth
<a> {{Auth::user()->name}} </a>
LOG OUT
#else
LOGIN
#if (Route::has('register'))
REGISTER
#endif
#endauth
#endif
</div>
</div>
<div class="main-bar">
<div class="daraz-logo-container">
<img src="../resources/images/daraz_logo.png" alt="daraz_logo" class="daraz-logo">
</div>
<div class="search-box-container">
<form onSubmit="searching();">
<input type="text" placeholder=" Search on Daraz" name="search" class="search-bar" id="text-to-search">
<a onclick="searching();" class="search-btn"></a>
<img src="../resources/images/cart-icon.png" alt="">
<img src="../resources/images/downloadnow-icon.png" alt="">
</form>
</div>
</div>
</section>
<script src="../resources/scriptfiles/searching.js"></script>
#yield('content')
<section id="footer">
<div class="customer-care-end">
<h1>Customer Care</h1>
<ul>
<li>Help Center</li>
<li>How to Buy</li>
<li>Corporate & Bulk Purchasing</li>
<li>Returns & Refunds</li>
<li>Daraz Shop</li>
<li>Contact Us</li>
<li>Purchase Protection</li>
<li>Daraz Pick up Points</li>
<li>Fulfulled By Daraz (FBD)</li>
</ul>
</div>
<div class="codenthx">
<div class="QRcode"></div>
<div class="appdl">
<div class="QRthx"></div>
<p>Happy Shopping</p>
</div>
</div>
</section>
</div>
</body>
</html>
And here is the new file im trying to extend on (removed the html file and just put it a header testing file to see if it works)
#extends('layouts.frontend')
#section('content')
<div>
<h1>testing</h1>
</div>
#endsection
This works on the welcome.blade.php file but not on the product-gel.blade.php file.
this is what the directory is looking like for the welcome page
view > welcome.blade.php
and for the product one
view > produ > product-gel.blade.php
I have also tried moving the gel.blade.php file outside of produ folder like this
view > product-gel.blade.php
But that also doesnt work, I am still new to laravel so dont know what I am doing wrong here.
https://imgur.com/a/2crydOm
This is what it looks like.

Layout is not including in the main file in Laravel

I've the main file which is welcome.blade.php where I've mark up something like this
<!DOCTYPE html>
<html>
<head>
<title>
#yield('title') // title from signup.blade.php
</title>
</head>
<body>
<!-- some content here -->
#yield('signup') // I'm loading this from signup.blade.php
<!-- some content here -->
</body>
</html>
I'm loading sign up page from signup.blade.php which is in directory layouts/signup.blade.php.
signup.blade.php page has code something like this:
#include('welcome')
#section('title')
measurement
#endsection
#section('signup')
<div class="container">
<div class="row">
<div class="col-md-6">
<form action="">
<input type="text" class="form-control">
</form>
</div>
</div>
</div>
#endsection
The structure of the files is like this :
resources/views/welcome.blade.php
resources/views/layouts/signup.blade.php
But the problem is neither the title is showing when I load welcome.blade.php neither the sign up form appears.
Note: The title is showing localhost:8000 , don't know why ?
Am I doing anything wrong, please help me thanks.
Your master template welcome.blade.php
<!DOCTYPE html>
<html>
<head>
<title>
#yield('title')
</title>
</head>
<body>
#yield('content')
</body>
</html>
And now any page that will use this template need to extends it. In your case signup.blade.php
#extends('welcome')
#section('title')
measurement
#endsection
#section('content')
<div class="container">
<div class="row">
<div class="col-md-6">
<form action="">
<input type="text" class="form-control">
</form>
</div>
</div>
</div>
#endsection

Inheritance with Laravel 5

I have a master_page.blade with global content for my html:
<!DOCTYPE html>
<html lang="es">
<head>
#include('layout.head')
</head>
<body>
#include('layout.header')
#yield('master_content')
#section('footer')
#include('layout.footer')
#show
#include('layout.scripts')
#yield('custom_scripts')
</body>
</html>
After, I have a layout in Bootstrap with 2-6 columns, this blade inherit of the master_blade, his name is 2_10_columns.blade:
#extends('layout.master_page')
#section('master_content')
<div class="container">
<div class="main-content">
<div class="col-sm-2">
#section('content1')
#show
</div>
<div class="col-sm-10">
#section('content2')
#show
</div>
</div>
</div>
#stop
Ok, this looks good but, finally I need fill the 2_10_columns.blade with some content, for example I tried this with mi contact.blade.php:
#extends('layout.2_10_columns')
#section('content1')
<p>Column 2 left content of my section...</p>
#stop
#section('content2')
<p>Column 10 right content of my section ...</p>
...some forms here
#stop
Definitely this does not work...
How could I do this with Laravel? Look at this infographic:
its working like this(simplified for example):
master layout:
<html>
<body>
<div class="container">
#yield('master_content')
</div>
</body>
</html>
2 cols layout:
#extends('layouts.master')
#section('master_content')
<div class="co-l2">
<p>index</p>
#yield('sidebar')
</div>
<div class="col-10">
#yield('content')
</div>
#endsection
contact view:
#extends('layouts.2cols')
#section('sidebar')
<p>delete</p>
#endsection
#section('content')
<h1> person name </h1>
<p>about the person</p>
#endsection

parent & show element in Laravel freamwork?

i'm learning Laravel frame work, and have a question:
in this code:
<!DOCTYPE HTML>
<html>
<body>
<nav>
#section('nav')
<a>Home page</a>
#show
</nav>
<div id="content">
#yield('content')
</div>
</body>
</html>
what to do: #show ?!
Having a layout (layout.blade.php) view of
<!DOCTYPE HTML>
<html>
<body>
<nav>
#section('nav')
<a>Home page</a>
#show
</nav>
<div id="content">
#yield('content')
</div>
</body>
</html>
And a view (users.blade.php) of
#extends('layout')
#section('nav')
> <a>Users</a>
#stop
You should see rendered:
Home page > Users
But you could also use stop on layout:
#section('nav')
<a>Home page</a>
#stop
And #parent on your view:
#section('nav')
#parent
> <a>Users</a>
#stop
Take a look at video's 6 and 7 regarding "blade basics" and "master pages"
https://laracasts.com/series/laravel-from-scratch

Blade templating structure - how to put fixed sections such as header and footer

This is my scenario:
I have made a main.blade.php and it contains the following code:
<!DOCTYPE html>
<html>
<head>
<title>{{ $title }}</title>
</head>
<body>
<div id='header'>
#yield('header')
</div>
<div id='main-wrapper'>
#yield('content')
</div>
<div id='footer'>
#yield('footer')
</div>
</body>
</html>
And then this is the controller:
class Userindex extends BaseController
{
protected $layout = "main";
function register ()
{
$this->layout = View::make("user.register")
->with("title","Registration");
}
}
Here is the register.blade.php in user folder:
#extends('main')
#section('content')
<p>This the content of the page register.</p>
#stop
My PROBLEM: I have two other pages as header.blade.php and footer.blade.php that I don't know how should I include them into the register.blade.php
Do a little adjustment to you layout file, replace #yield with #include and that's it!
<!DOCTYPE html>
<html>
<head>
<title>{{ $title }}</title>
</head>
<body>
<div id='header'>
#include('partials.header')
</div>
<div id='main-wrapper'>
#yield('content')
</div>
<div id='footer'>
#include('partials.footer')
</div>
</body>
</html>

Categories