• Skip to primary navigation
  • Skip to content
  • Skip to primary sidebar

Zubair Amin

Helping You Be Your Own Boss!

  • WordPress
  • SEO
  • Blogging
  • Business
    • Ecommerce
  • Domains

How to Add a Class to body in Laravel View

November 2, 2021 by Zubair Amin Leave a Comment

I have started to practice Laravel (PHP Framework) for one of my clients. As a project coordinator and business development manager I mainly focus on bringing more work to my own company and assign the projects to my team of programmers. I have little experience on laravel and could not achieve much in it due to management activities in services.

Well, Lets come to the point. While working on Laravel project, I feel a need to Add a class to body of each web page. Because in website design each page was required in separate color scheme and to achieve this, It was must to add a separate class to every page. All pages were creating dynamically from admin panel.

After little stack overflow searches and readings on google search, I have concluded some perfect solutions in all cases if you ever need to achieve such tasks in Laravel any version.

Add a class to body in Laravel view

There are many ways to add a class to the body of a Laravel view file. This is necessary if you want to add certain functionality to a particular page. The best way to add a class to the body of a Laravel view is to pass the variable class from the child view to the layout file.

Pass variable class from child view to layout

Extending sidebar layout in child view and passing the variable name to the layout.

//resources\views\article.blade.php
@extends('layouts.sidebar', ['body_class' => 'article'])

Display variable name to body class in layout.

//resources\views\layouts\sidebar.blade.php
<body class="{{ $body_class ?? ''}}">
//Or
<body class="{{ !empty($body_class) ? $body_class : '' }}">

You can pass variable class name from the child view (article.blade.php) to the sidebar layout and after that, you can display class to your body in the laravel layout file (sidebar.blade.php) which you are extending in the child view file.

Add class to body using @yield directive in Laravel

Display class name in laravel layout file.

//resources\views\layouts\sidebar.blade.php

<body class="@yield('body_class')"

Pass class name using @section directive in child template.

//resources\views\article.blade.php

@section('body_class', 'article')

You can add class to the body tag in Laravel view file by passing the class name from the child template (article.blade.php) to the layout template (layouts/sidebar.blade.php) using @section directive and display in layout template using @yield directive.

Add class name to body using current route name

//resources\views\<layouts>\<default>.blade.php
//Or
//resources\views\<index>.blade.php
<body class="current_route_name-{{ Route::currentRouteName() }}">

You can pass a class name to the body using current route name in laravel using Route::currentRouteName() in your layout file or child template.

Add class to body using URL segments in Laravel

//resources\views\<layouts>\<default>.blade.php
<body class="template-{{ collect(\Request::segments())->implode('-') }}">

Add class to body using view composers

//routes\web.php
View::composer('*', function ($view) {
    View::share('viewName', $view->getName());
});

Or

//app\Providers\AppServiceProvider.php

//Before class definition
use View;
//Inside boot method of AppServiceProvider class
public function boot()
{
    View::composer('*', function ($view) {
        View::share('viewName', $view->getName());
    });
}
//resources\views\<layouts>\<default>.blade.php
<body class="template-{{ $viewName }}">

You can add class to the body in laravel view using view composer. View composers are callbacks or class methods that are called when a view is rendered. You can pass class name using View::share() method and display it using {{ $viewName }} in the laravel view file.

 

Filed Under: Programming, Web Design Tagged With: body class, Laravel view

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

  • Facebook
  • LinkedIn
  • Medium
  • RSS
  • Twitter

Recommended Posts

  • Godaddy acquires DAN for $71.4 million
  • How To Fix – “Fatal error: Uncaught Error: Class ‘Elementor\Scheme_Color’”
  • How to Create Shine Effects on Your Website Logo With CSS
  • How to Check Your Laptop’s Battery Health on Windows 10
  • How to Change Checkout Form Heading in WooCommerce

Categories

  • Blogging
  • Business
  • Crypto Currency
  • Domains
  • Ecommerce
  • Make Money Online
  • Programming
  • SEO
  • Tech Tips
  • Technology
  • Web Design
  • Wordpress

Subscribe via Email

Sign up and receive make money online tips, blogging and travel tips right in your inbox.

  • About
  • Work
  • Contact me

Copyright © 2023 · Zubair Amin