How to show name instead of avatar/black circle with initials?

I don't want avatar. I want the user name something like

Auth::user->name

Auth::user->name

Auth::user->name

Auth::user->name I guess in the top right corner.
How to do that? Right now I have there a black circle with initials.

Solution

Or just use https://github.com/laravolt/avatar if you want it local.

GitHub

GitHub - laravolt/avatar: Plug n play avatar, turn name, email, and...

Plug n play avatar, turn name, email, and any other string into beautiful avatar (or gravatar), effortless. - GitHub - laravolt/avatar: Plug n play avatar, turn name, email, and any other string i...

Jump to solution

WirkhofOP•12/18/23, 9:10 AM

Is there any method to do that? Like ->avatar('name')->avatar('name') ?

WirkhofOP•12/18/23, 9:11 AM

or ->avatar('email')->avatar('email') ?

toeknee•12/18/23, 9:14 AM

I don't thinkso, you would need to disable the avatar and just add a render hook to render the users name.

WirkhofOP•12/18/23, 9:25 AM

I don't understand.

WirkhofOP•12/18/23, 9:25 AM

I don't want avatar. How to remove it and show my name or email instead?

WirkhofOP•12/18/23, 9:49 AM

In which file can I edit the visual representation of the top banner with the avatar and sway it for <div>{{ Auth::user->name }}</div> instead?

WirkhofOP•12/18/23, 9:50 AM

I don't even need a name of the user - it will be always me.

WirkhofOP•12/18/23, 9:50 AM

I want there perhaps just a log out button. No popup,drop down menu.

WirkhofOP•12/18/23, 9:51 AM

just a user name and a logout link

WirkhofOP•12/18/23, 9:57 AM

Why is such a simple thing so complicated?

WirkhofOP•12/18/23, 9:57 AM

WirkhofOP•12/18/23, 9:58 AM

I don't want avatars, I want {{ Auth::user->name }}

toeknee•12/18/23, 10:24 AM

So just hide it with CSS and put in a custom render hook rendering your User Name blade and a logout button.

https://filamentphp.com/docs/3.x/support/render-hooks
https://filamentphp.com/docs/3.x/panels/themes#creating-a-custom-theme

Render hooks - Core Concepts - Filament

Themes - Panel Builder - Filament

Ttoeknee So just hide it with CSS and put in a custom render hook rendering your User Nam...

WirkhofOP•12/18/23, 10:27 AM

This seems super complicated for me. I will probably just create my custom provider and generate an svg image with initials myself. https://stackoverflow.com/questions/28128491/center-text-in-circle-with-svg I don't understand why wouldn't it be done locally in the first place. Would it even work on intranet in an off-line mode - think some engineering factory with a filament backend for workers, etc.

Stack Overflow

Center text in circle with SVG

I'm trying to center text in a circle with SVG. The size of the text will be dynamic.
My code on Plunker:
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/

WWirkhof This seems super complicated for me. I will probably just create my custom provi...

toeknee•12/18/23, 10:28 AM

It can be done locally, if you want to keep the avatar you just simply add the getAvatar function to the user model and fetch it from whereever you want. But you specifically requested it to not render at all.

toeknee•12/18/23, 10:29 AM

All of this is in the docs.

Ttoeknee It can be done locally, if you want to keep the avatar you just simply add the g...

WirkhofOP•12/18/23, 10:29 AM

Yeah, but you use super advanced jargon and abstract terms. It's hard to understand you as a beginner.

WWirkhof Yeah, but you use super advanced jargon and abstract terms. It's hard to underst...

toeknee•12/18/23, 10:30 AM

It's fairly basic, not advanced jargon. You should understand the basics of PHP before using Laravel and Filamentphp.

WirkhofOP•12/18/23, 10:30 AM

I have been sucessfuly using Livewire, but Filament seems to be super abstract and hard to grasp and visualize.

WirkhofOP•12/18/23, 10:31 AM

It's all classes and implementations/interfaces

WWirkhof I have been sucessfuly using Livewire, but Filament seems to be super abstract a...

toeknee•12/18/23, 10:31 AM

It's an abstracted approach yes, because it allows rapid functional development with crazy consistency throughtout.

If you have a decent IDE you will see all the layers, but the documentation explains everything fairly well.

WirkhofOP•12/18/23, 10:31 AM

evertyhing is overwritten and changed somewhere in the chain.

toeknee•12/18/23, 10:32 AM

It's only overwritten when you want to change something

WirkhofOP•12/18/23, 10:32 AM

Yes, it's super opinionated.

WirkhofOP•12/18/23, 10:32 AM

for 95% it's great. But sometimes, like in this case

WirkhofOP•12/18/23, 10:32 AM

you spend a few hours solving such a thing that would be done in 2 minutes

WirkhofOP•12/18/23, 10:33 AM

in plain livewire/blade

WirkhofOP•12/18/23, 10:33 AM

component

toeknee•12/18/23, 10:33 AM

But it's only not because you don't understand it.... I can do this is 2 minutes. You can't because you are not familiar with it.

WirkhofOP•12/18/23, 10:33 AM

Well, I doubt you wouldn't have to google svg

WirkhofOP•12/18/23, 10:33 AM

tags

toeknee•12/18/23, 10:33 AM

Once you learn render hooks, you'll understand how powerfull it can be, again another learning curve

WirkhofOP•12/18/23, 10:34 AM

and how to center text and stuff

toeknee•12/18/23, 10:34 AM

center text is easy? depending on where, ->alignCenter() again all explained in the docs

toeknee•12/18/23, 10:34 AM

or ->extraAttributes(['class' => 'text-center'])

WirkhofOP•12/18/23, 10:34 AM

By the way, this is off topic but this is a nice link https://svg-tutorial.com/svg/basic-shapes

SVG Tutorial

Day 1: How to Draw Basic Shapes with SVG - SVG Tutorial

Learn how to draw basic shaped with SVG. In the first example we draw a Christmas Ornament with two circles and a rectangle element.

WirkhofOP•12/18/23, 10:34 AM

O saw it on hackernews a few days ago

WirkhofOP•12/18/23, 10:35 AM

SVG is super underrated

toeknee•12/18/23, 10:35 AM

That is for basic shapes, but filament uses bladeicons so you can render any SVG from blade icons.

WirkhofOP•12/18/23, 10:35 AM

Yeah I will need to create a circle and put

WirkhofOP•12/18/23, 10:35 AM

the initials there

WirkhofOP•12/18/23, 10:35 AM

nothing fancy.

WirkhofOP•12/18/23, 10:36 AM

I think I will be able to do it in a few minutes or so

Solution

toeknee•12/18/23, 10:36 AM

Or just use https://github.com/laravolt/avatar if you want it local.

GitHub

GitHub - laravolt/avatar: Plug n play avatar, turn name, email, and...

Plug n play avatar, turn name, email, and any other string into beautiful avatar (or gravatar), effortless. - GitHub - laravolt/avatar: Plug n play avatar, turn name, email, and any other string i...

WirkhofOP•12/18/23, 10:37 AM

OK, thanks I will look at it.

toeknee•12/18/23, 10:41 AM

https://filamentphp.com/docs/3.x/panels/users#using-a-different-avatar-provider

FYI.

Users - Panel Builder - Filament

Ttoeknee https://filamentphp.com/docs/3.x/panels/users#using-a-different-avatar-provider ...

WirkhofOP•12/18/23, 10:51 AM

Try that example you linked. It's not working

WirkhofOP•12/18/23, 10:54 AM

I am trying the laravolt/avatar now though. It can do svg. So perhaps it will be the solution for now.

WirkhofOP•12/18/23, 10:54 AM

Hopefully it will work with Filament 3

How to show name instead of avatar/black circle with initials?

Similar Threads

Similar Threads

Similar Threads