How to add custom HTML on user profile page in Drupal 8?

coderama picture coderama · Jan 17, 2016 · Viewed 7.4k times · Source

When a user logs in, it takes them to their /user page. This page usually has the default text on it: Member for X months. But nothing else.

You can manage this display here: admin/config/people/accounts/display

The problem is, it's not very obvious how to add more information on this page. I preferred editing the user-profile template directly, but that doesn't seem to be used on Drupal 8 anymore.

The type of things I want to add:

  • An icon menu to links to different aspects of the user's account (e.g. Invoices, Orders, Edit Account, My Points etc)
  • Random blocks of text for things like: "X invoices due", "X time until next game starts" etc
  • Account information obtained from an external API (Username, password, address, total orders etc)

I was going to make a "drupal block" and just show that on all /user paths, but I don't think I'm using the page properly.

  1. Is there a way I should be adding fields that can be used to display this information? (So that I can manage it from admin/config/people/accounts/display)
  2. Is there perhaps a user-profile template I can override

Keep in mind, whatever is used, one user muust never get access to another users profile. It will only be used as the landing page for a logged in user, so that user and that user only, can see the details on their account.

UPDATE

I see that you can override user.html.twig, but this means no PHP in the file (which of course is not a good way to do it anyway). So how do I get PHP logic onto that template?

Answer

Monal Soft picture Monal Soft · Jun 22, 2016

First thing: you can override user profile template. make a template named user--profile.html.twig in yourtheme/templates/ dir. In this file you can find user entity in {{ var_dump(user) }}. you can render info as you want.

Second thing: If you want extra variables on user profile. you can attach those variables to user in hook_user_load(). In this hook you can write all your logic, you can attach your block from here. and access those as {{ user.your_variable }} in twig.

As we can not write php code in twig, we need to attach everything to thing from our hooks, module_functions, controllers to twig. and this is very good practice.