Replacing #current-user nav item with text

Dev
1

Hello everyone.

I need to replace the #current-user (profile picture) item in the navigation with the text “profile”.
What would be the best approach to do that?

I have tried adding text to #current-user a::before

and set the display of the profile photo to none,

but that would also hide the notifications.

the desired result is something like this.

27%20PM

thank you in advance.

1 Like
2

I suppose you could create an image that contained the text “profile”. And just render that image instead of the avatar.

7 Likes
3

@blake, thanks for the response.
I am working on a new theme and I don’t think that would be optimal.
Do you think I could do it using the pluginAPI or a widget?

5

Hello,

This is also possible with css. :slightly_smiling_face:

Common > CSS

li#current-user {
  a.icon {
    padding: 0.2143em 0.5em;
    border: 1px solid transparent;
    border-bottom: none;
    &:before {
      content: "profile";
      font-weight: 600;
    }
    img.avatar {
      display: none;
    }
  }
}
// Align the new user menu
.desktop-view {
  .user-menu.revamped {
    right: 0.25em;
  }
}
2 Likes