Your website’s users are its dearest treasure. Drupal 8 offers everything to make your users happy and satisfied. They can publish content with ease, quickly find things through the robust search in Drupal 8, use their native language thanks to Drupal 8’s multilingual improvements, and so much more.
But let’s get to the beginning of their journey — user profiles. We will take a tour of building the structure of user profiles in Drupal 8.
First, let’s talk about some basics before moving on to a few interesting tweaks that make profiles richer and more engaging. These will involve new Drupal 8 core modules, such as:
- the Media Library to enrich profiles with multimedia
- the Layout Builder to shape the profile layout with the handy drag-and-drop feature
And we will also use the not so new but always essential Views module that is part of the Drupal 8 core to help us display the needed data more precisely. Let’s begin!
Building user profiles in Drupal 8
1. Introduction: using fields to build user profiles
Users are fieldable entities in Drupal 8 just like content types. This means you can build user profiles with any fields, and every account will have them.
These can be any fields imaginable — first name, last name, picture, email, link to the website, and so forth. They can be created in Configuration — People — Account settings — Manage fields with the use of the relevant field types.
The order in which the fields will appear to visitors can be specified by the drag-and-dropping at “Manage display,” hide or show their labels and use formatters.
Every field can be made required or optional on the field “Edit” page.
A special group of field types is “Reference”. It allows you to connect to other entity types. With this, you can allow users to:
- list other users of your website (i.e. “My mentors”)
- select options from taxonomy vocabularies (i.e. counties, cities, or spoken languages)
- list their favorite content from your website
and much more.
One of the interesting referenced entity cases comes next with the Media Library.
2. Making profiles richer with the Media Library
You can allow users to embed media of various types from Drupal 8’s Media Library into their profiles. This includes images, videos, audio, files, and remote videos from YouTube or Vimeo. For example, they can list their featured photos, favorite music videos, and so on.
The Media Library appeared as an experimental module in Drupal 8.6 for media handling. New Media Library interface in Drupal 8.7 impressed even the experts with its stylish design and handy features.
For media embedding, the Media and the Media Library core modules need to be enabled. Then it’s necessary to set the Reference field type to “Media,” specify the allowed number of values and select the media type.
With these settings like on our picture, the user’s account will have the fields for up to 5 featured photos that users can embed into profiles directly from the Media Library.
It’s great to know that in Drupal 8.8, there will be a media embed button added to the CKEditor dashboard.
3. Displaying the needed data in profiles via Views
More opportunities are open thanks to adding collections of entities, or Drupal Views. Remember, for example, we mentioned the referenced entity field open to other users, such as the “My mentors” field?
However, this just listed the mentor’s usernames on the user profile. What if we want the mentors’ pictures to be shown?
Views comes to the rescue! We can arrange mentors’ photos as Views and attach it as a block or page to the user profile.
We need to:
- go to Structure — Views and create a new view block of the “user” type that will use fields
- add the field for the user picture and, in the field settings, relate it to our “My Mentors” field
- add a relationship in the “Advanced” section of Views to the “My Mentors” field
- create a contextual filter in the “Advanced” section of Views that will display only the mentors of the particular user
With this done, we now have a block that shows the pictures of mentors on each user page. However, this block is not yet added anywhere to the site.
4. Shaping user profiles with the Layout Builder
It’s time to finally unite it all together. The Views block can be attached to the profile using the traditional Drupal block layout as a simple option. However, the new Layout Builder that appeared in Drupal 8.5 offers an amazing drag-and-drop interface for this purpose!
The Layout Builder is used with all fieldable entities, including user profiles. In addition to enabling the module, we need to enable the Layout Builder on the Manage Display tab of the particular entity type (in this case — user account settings).
The Manage layout button takes us to the drag-and-drop interface where we can add sections with a different number of columns, set their width proportions, and add blocks to them. Blocks include Drupal fields, Views blocks, forms, menus, and much more.
Every Drupal block is configured on the right sidebar, with all settings traditionally available in “Manage display.”
We are creating a three-column section and adding profile fields as blocks, including the “My featured photos” filed and the “My mentors” Views block. We will save the result and see how our profile looks.
Of course, it still needs a good touch of HTML and CSS. However, we have only touched the tip of the iceberg of what core Drupal 8 modules can do for building user profiles. The opportunities are endless!
Building user profiles in Drupal 8 with our team
Let your user profiles look exactly as you wish, with no limits to your imagination. Entrust building user profiles to our Drupal website development company who will use core, contributed, or custom modules created specifically for your case. Contact us!