change logo and customize menu dashboard

@gianmarx the blade files for those lives in

resources/views/vendor/jetstream/components/application-logo.blade.php resources/views/vendor/jetstream/components/authentication-card-logo.blade.php resources/views/vendor/jetstream/components/application-mark.blade.php

you should run the following

php artisan vendor:publish --tag=jetstream-views to publish assets to your resources/views directory. You can then edit and either swap out the svg for another svg or add an image if you want to do that instead.

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

Your menu blade should be in the resources/views/vendor/jetstream/components/ directory too.

look in resources/views/layouts/app.blade.php

there you will see

                            <!-- Logo -->
                            <div class="flex-shrink-0 flex items-center">
                                <a href="/dashboard">
                                    <x-jet-application-mark class="block h-9 w-auto" />
                                </a>
                            </div>

x-jet-application-mark is a component that contains the jetstream logo

<svg viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" {{ $attributes }}>
  <path d="M11.395 44.428C4.557 40.198 0 32.632 0 24 0 10.745 10.745 0 24 0a23.891 23.891 0 0113.997 4.502c-.2 17.907-11.097 33.245-26.602 39.926z" fill="#6875F5"/>
  <path d="M14.134 45.885A23.914 23.914 0 0024 48c13.255 0 24-10.745 24-24 0-3.516-.756-6.856-2.115-9.866-4.659 15.143-16.608 27.092-31.75 31.751z" fill="#6875F5"/>
</svg>

YOu can either replace the content of the application-mark file or replace the component in the layout file with your own image <img src="">

BTW here's your thread from last week https://laracasts.com/discuss/channels/laravel/change-logo-jet-stream

can you mark that as answered if thats all the info you need?

For the Dashboard text, you need to update the dashboard.blade.php file. You should be able to find it in resources/views/vendor/jetstream/dashboard.blade.php

forgive me but I can't figure out how I can edit such a file:

resources/views/vendor/jetstream/components/application-logo.blade.php

<svg viewBox="0 0 317 48" fill="none" xmlns="http://www.w3.org/2000/svg" {{ $attributes }}>

@automica then I have to edit dashboard including the menu

its a scaleable vector graphic. if you want to swap it for a jpeg or png, use html img tag.

as @bobbybouwmann said, template for dashboard is resources/views/vendor/jetstream/dashboard.blade.php

@gianmarx You either need to create a new SVG or use an existing one and paste it in there. It's nothing more than that ;)

You have to write html

remember that?

when i include this html code i find

<x-slot name="header">

 </x-slot>

a code excerpt from: .../views/dashboard.blade.php

the dashboard with everything included. I would like to understand how to modify it to change the logo and dashboard writing

this path does not exist resources/views/vendor/jetstream/dashboard.blade.php @bobbybouwmann

@gianmarx look in

/views/dashboard.blade.php

for

<x-app-layout>
    <x-slot name="header">
        <h2 class="font-semibold text-xl text-gray-800 leading-tight">
            {{ __('Dashboard') }}
        </h2>
    </x-slot>

    <div class="py-12">
        <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
            <div class="bg-white overflow-hidden shadow-xl sm:rounded-lg">
                <x-jet-welcome />
            </div>
        </div>
    </div>
</x-app-layout>

ok @automica I have already seen and modified the body as I wanted but I would like to modify

    <x-slot name = "header"> 
</x-slot> 

and I have no idea how to modify it. I have no idea how to edit SVGs and how do I put the logo I am interested in

@snapey I do not understand what you mean. I didn't understand how to change header. all here I have no idea where to change it.

@gianmarx google is your friend

https://www.w3schools.com/graphics/svg_intro.asp

The header is in app.blade.php

look for:

            <!-- Page Heading -->
            <header class="bg-white shadow">
                <div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
                    {{ $header }}
                </div>
            </header>

anything you mark as x-slot name="header"

eg

    <x-slot name="header">
        <h2 class="font-semibold text-xl text-gray-800 leading-tight">
            {{ __('Dashboard') }}
        </h2>
    </x-slot>

will be pushed into there. You'll end up with:

            <!-- Page Heading -->
            <header class="bg-white shadow">
                <div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
                          <h2 class="font-semibold text-xl text-gray-800 leading-tight">
           			 {{ __('Dashboard') }}
        </h2>
                </div>
            </header>

ok i understand that:

application-mark.blade.php logo located at the top of the dashboard once logged in

authentication-card-logo.blade.php here you can change the login logo

what I did not understand how to delete / change the dashboard written next to the logo once logged in.

not the dashboard written under the logo

@automica @snapey @bobbybouwmann

default Jetstream/livewire dashboard.blade.php

<x-app-layout :pagetitle="$pagetitle">
    <x-slot name="header">
        <h2 class="font-semibold text-xl text-gray-800 leading-tight">
            {{ __('Dashboard') }}
        </h2>
    </x-slot>

    <div class="py-12">
        <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
            <div class="bg-white overflow-hidden shadow-xl sm:rounded-lg">
                <x-jet-welcome />
            </div>
        </div>
    </div>
</x-app-layout>

<x-jet-welcome> is a component that returns the default dashboard content. Remove this and add whatever you want

Or if having that much trouble switch over to bootstrap for everything, or use custom CSS, and your custom HTML, with whatever image you want.

we did not understand each other. I will not have explained well. I have attached an image to show what I would like to change.

https://drive.google.com/file/d/1tw5ucVKREdK-uvL2tv-le_mHe9tvyC6G/view?usp=sharing

@snapey

private image

dashboard written next to the logo is the navigation menu

in layouts/app.blade.php

                            <!-- Navigation Links -->
                            <div class="hidden space-x-8 sm:-my-px sm:ml-10 sm:flex">
                                <x-jet-nav-link href="/dashboard" :active="request()->routeIs('dashboard')">
                                    {{ __('Dashboard') }}
                                </x-jet-nav-link>
                            </div>

try now @snapey

@gianmarx both myself and @snapey have told you where to find that.

if you search for ' {{ __('Dashboard') }}' within your resources folder, you'll find it.

@automica YES I found it in nav-linke.blade.php

@gianmarx for a lesson about slots and components (which have been in laravel since 5.4), see

https://laracasts.com/series/whats-new-in-laravel-5-4/episodes/6

many thanks @automica

@gianmarx Seriously... I already pointed you to that file in one of the first replies... Come on man

@bobbybouwmann I think everybody did. and last week too. I mean, its almost as if someone should write some documentation for Laravel.