Cara gunakan @yield @section Laravel Blade

By Posted on
Cara gunakan @yield @section Laravel Blade


Salah satu fitur yang sangat berguna dari Laravel adalah kemampuan untuk mengelola konten di dalam satu halaman dan dapat digunakan ke halaman lain menggunakan @yield dan @section. Artikel ini akan membahas cara gunakan @yield dan @section Laravel Blade Template Engine.

Apa itu @yield dan @section?

Pertama, mari kita pahami apa itu @yield dan @section dalam Laravel dan bagaimana keduanya bekerja bersama untuk mempermudah manajemen tampilan web.

  • @yield
    Ini seperti membuat lubang pada halaman web Anda. Anda memberi lubang tersebut nama (misalnya, ‘head’ atau ‘content’). Kemudian, dalam halaman yang berbeda, Anda bisa mengisi lubang itu dengan berbagai konten. Jadi, ketika halaman yang berbeda menggunakan tampilan yang sama, mereka bisa mengisi lubang dengan konten yang berbeda.
  • @section
    Ini seperti menyiapkan konten untuk dimasukkan ke dalam lubang. Ketika Anda ingin menggunakan tampilan yang memiliki lubang, Anda menggunakan @section untuk menentukan apa yang akan dimasukkan ke dalam lubang tersebut. Dengan kata lain, Anda mendefinisikan apa yang akan ada di dalam lubang tersebut pada halaman yang menggunakan tampilan tersebut.

Jadi, dengan @yield Anda membuat tempat (lubang) yang bisa diisi, dan dengan @section Anda memberi tahu apa yang harus diisi ke dalam lubang tersebut pada halaman yang menggunakan tampilan tersebut.

Membuat Halaman Induk

Sekarang, mari kita buatkan dulu halaman induk yang dimana kita letakkan kode utama disini. Katakan saja kita akan memberi nama dengan “layouts.blade.php”. Contoh penggunaan @yield dan @section dalam halaman induk adalah: 

<!DOCTYPE html>
<html>
<head>
    @yield('head')
</head>
<body>
    @yield('content')
</body>
</html>


Membuat Halaman Anak (Turunan 1)

Selanjutnya, mari kita bahas cara mengisi konten di dalam bagian <body> tampilan web dengan @yield dan @section. Ini termasuk konten seperti judul halaman, teks, gambar, dan elemen HTML lainnya yang ada di dalam bagian <body>. 

@extends('layouts')

@section('head')
    <title>Halaman Beranda</title>
    <meta name="description" content="Deskripsi halaman beranda">
@endsection

@section('content')
    <h1>Selamat datang di halaman beranda!</h1>
    <p>Ini adalah konten halaman beranda.</p>
@endsection


Membuat Halaman Anak (Turunan 2)

Misalnya kita ingin membuat halaman lain yang menggunakan base kode program utama. Berikut adalah contohnya: 

@extends('layouts')

@section('head')
    <title>Halaman Info</title>
    <meta name="description" content="Deskripsi halaman info">
@endsection

@section('content')
    <h1>Berikut adalah informasi terbaru:!</h1>
    <p>Sesi 1</p>
@endsection

Sekian dan semoga artikel Cara Gunakan @yield dan @section Laravel Blade Template Engine bermanfaat

Pencarian serupa: