How to change Jetstream logo in Laravel 8?

Question

I installed Laravel 8 with Jetstream authentication. Now I want to change the login components, specifically the logo. Where are these components placed?

Answer 1

I found this, follow below step.

You can run below commands to publish the assets.

php artisan vendor:publish --tag=jetstream-views

After that files will be available under the folder resources/views/vendor/jetstream/components

Answer 2

There is an answer in the installation tutorial.

https://jetstream.laravel.com/1.x/installation.html#application-logo

php artisan vendor:publish --tag=jetstream-views

Livewire

Next, you should customize the SVGs located in the resources/views/vendor/jetstream/components/application-logo.blade.php, resources/views/vendor/jetstream/components/authentication-card-logo.blade.php, and resources/views/vendor/jetstream/components/application-mark.blade.php components.

Inertia

Next, you should customize the SVGs located in resources/views/vendor/jetstream/components/authentication-card-logo.blade.php, resources/js/Jetstream/ApplicationLogo.vue, and resources/js/Jetstream/ApplicationMark.vue. After customizing these components, you should rebuild your assets:

Answer 3

If you want to get your logo on your database.

You need to run first php artisan vendor:publish --tag=jetstream-views this command. After that, you need to get resources\views\auth\login.blade.php and replace this <x-jet-authentication-card-logo /> with you own component!

You can do this like that run this command php artisan make:component AppLogo And create a your own component.

<?php

namespace App\View\Components;

use App\Models\GeneralSettings;
use Illuminate\View\Component;

class AppLogo extends Component
{
    public $logo;

    public function __construct()
    {
        $this->logo = GeneralSettings::first()->favicon;
    }

    /**
     * Get the view / contents that represent the component.
     *
     * @return \Illuminate\Contracts\View\View|string
     */
    public function render()
    {
        return view('components.home.app-logo');
    }
}

After that you need to edit your resources\views\components\home\app-logo.blade.php file like that;

<div>
    <img src="{{$logo}}">
</div>

After that, you need to get resources\views\auth\login.blade.php and replace this <x-jet-authentication-card-logo /> with you own component! Like that <x-applogo />

Result to be like that;

<x-guest-layout>
    <x-jet-authentication-card>
        <x-slot name="logo">
{{--            <x-jet-authentication-card-logo />--}}
            <x-applogo />
        </x-slot>

        <x-jet-validation-errors class="mb-4" />
....

Answer 4

To change Jetstream logo in Laravel 8. You must do 3 steps

• 1.first run This Command to generate components
  php artisan vendor:publish --tag=jetstream-views this will generate view [\vendor\laravel\jetstream\resources\views] To
  [\resources\views\vendor\jetstream]
• 2.Open \resources\views\vendor\jetstream and move to authentication-card-logo.blade
• 3.Crate your Svg image from https://www.w3schools.com/graphics/svg_intro.asp or download free from 1: https://freesvg.org I also change my logo by doing this

Answer 5

Just add your own html.

Do like this,

<x-slot name="logo">
    <img src="{{ url('logo.png') }}" />
</x-slot>

Answer 6

On Laravel 10, to change Jetstream Logo on all pages:

1. Replace content of /resources/views/components/application-logo.blade.php by:

<img src="{{ asset('images/logo.png') }}" alt=""/>

2. Replace content of /resources/views/components/authentication-card-logo.blade.php by:

<a href="/">
    <img src="{{ asset('images/logo.png') }}" alt=""/>
</a>