How to change Jetstream logo in Laravel 8?
Asked Answered
L

6

8

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

Letterpress answered 27/9, 2020 at 19:23 Comment(0)
L
4

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

Letterpress answered 27/9, 2020 at 19:23 Comment(0)
P
6

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:

Papilloma answered 27/9, 2020 at 19:31 Comment(1)
What if i want to change it to a .png ?Fistulous
L
4

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

Letterpress answered 27/9, 2020 at 19:23 Comment(0)
F
4

Just add your own html.

Do like this,

<x-slot name="logo">
    <img src="{{ url('logo.png') }}" />
</x-slot>
Frailty answered 8/4, 2021 at 18:56 Comment(0)
I
2

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" />
....
Insolent answered 19/12, 2020 at 20:28 Comment(0)
S
2

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 this the login page of jetstreme
Soidisant answered 8/7, 2021 at 8:53 Comment(0)
F
0

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=""/>
  1. Replace content of /resources/views/components/authentication-card-logo.blade.php by:
<a href="/">
    <img src="{{ asset('images/logo.png') }}" alt=""/>
</a>

Fruitless answered 26/2 at 18:23 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.