Krishna Krishna - 1 year ago 96
PHP Question

How to add a layout with dynamic js and css in larvel?

Recently I sarted to learn laravel framework. I installed Laravel 5 using composer and I need to know how to include a constant layout where I can put up gobal css and js links. Thanks.

Answer Source

Write routes

Route::get('/', function()
    return View::make('pages.home');
Route::get('about', function()
    return View::make('pages.about');
Route::get('projects', function()
    return View::make('pages.projects');
Route::get('contact', function()
    return View::make('');

Make sure you follow this folder structure

- app
-- views
--- layouts
------- default.blade.php
------- sidebar.blade.php
--- pages
------- home.blade.php
------- about.blade.php
------- projects.blade.php
------- contact.blade.php
--- includes
------- head.blade.php
------- header.blade.php
------- footer.blade.php
------- sidebar.blade.php

Include following in head.blade.php

<meta charset="utf-8">
<meta name="description" content="">
<meta name="author" content="Scotch">
<title>Super Cool Layouts</title>
<!-- load bootstrap from a cdn -->
<link rel="stylesheet" href="<?php echo asset('css/style.css'); ?>">
<script type="text/javascript" src="<?php echo asset('js/main.js'); ?>"></script>

Write header and fooder in header.blade.php and footer.blade.php

<div class="navbar">
    <div class="navbar-inner">
        <a id="logo" href="/">Single Malt</a>
        <ul class="nav">
            <li><a href="/">Home</a></li>
            <li><a href="/about">About</a></li>
            <li><a href="/projects">Projects</a></li>
            <li><a href="/contact">Contact</a></li>

Finally create the layout in default.blade.php

<!doctype html>
<div class="container">

    <header class="row">

    <div id="main" class="row">



    <footer class="row">


To include the layout use this in home.blade.php

    i am the home page

I found a complete tutorial over here Include js and css file in laravel using blade

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download