Laravel - Plantillas Blade

Laravel 5.1 introduce el concepto de usar Blade, un motor de plantillas para diseñar un diseño único. El diseño así diseñado puede ser utilizado por otras vistas e incluye un diseño y una estructura consistentes.

En comparación con otros motores de plantillas, Blade es único en las siguientes formas:

  • No restringe al desarrollador el uso de código PHP simple en las vistas.

  • Las vistas de hoja así diseñadas se compilan y almacenan en caché hasta que se modifican.

La estructura de directorios completa de Laravel se muestra en la captura de pantalla que se proporciona aquí.

Puede observar que todas las vistas se almacenan en el resources/views directorio y la vista predeterminada para el marco de Laravel es welcome.blade.php.

Tenga en cuenta que otras plantillas de hoja también se crean de manera similar.

Pasos para crear un diseño de plantilla de hoja

Deberá seguir los siguientes pasos para crear un diseño de plantilla de hoja:

Paso 1

  • Cree una carpeta de diseño dentro del resources/viewscarpeta. Usaremos esta carpeta para almacenar todos los diseños juntos.

  • Crea un nombre de archivo master.blade.php que tendrá el siguiente código asociado:

<html>
   <head>
      <title>DemoLaravel - @yield('title')</title>
   </head>
   <body>
      @yield('content')
   </body>
</html>

Paso 2

En este paso, debe ampliar el diseño. Ampliar un diseño implica definir los elementos secundarios. Laravel usa elBlade @extends directiva para definir los elementos secundarios.

Cuando amplíe un diseño, tenga en cuenta los siguientes puntos:

  • Las vistas definidas en Blade Layout inyectan el contenedor de una manera única.

  • Se crean varias secciones de vista como elementos secundarios.

  • Los elementos secundarios se almacenan en la carpeta de diseños como child.blade.php

Aquí se muestra un ejemplo que muestra la extensión del diseño creado anteriormente:

@extends('layouts.app')
@section('title', 'Page Title')
@section('sidebar')
   @parent
<p>This refers to the master sidebar.</p>
@endsection
@section('content')
<p>This is my body content.</p>
@endsection

Paso 3

Para implementar los elementos secundarios en las vistas, debe definir el diseño de la manera que sea necesario.

Observe la captura de pantalla que se muestra aquí. Puede encontrar que cada uno de los enlaces mencionados en la página de destino son hipervínculos. Tenga en cuenta que también puede crearlos como elementos secundarios con la ayuda de plantillas blade mediante el procedimiento que se describe anteriormente.