28 January, 2022 seen 665This is an article back from 2014, when I had the vision to launch a web agency in Tbilisi, Georgia. In the end, I didn…
Working on a customers project I faced another interesting obstacle (s):
- First to have separate User Admin and User Profile pages
- Second - on user edit pages to display fields on two columns (according to the design).
So here arises two problems:
First how to have 2 user profiles and how to style them
My first approach for two user profiles was using Profiles 2 modules - I must admit - I'm not a huge fan of using such scenarios - they broke - and so did happened this time:
I did setup a Profile 2 user fields, worked with field permission, like when to hide some of the required fields on user register form.
So fare everything great -
but now arises second problem - how to display fields from form in two columns.
In short - answer comes from Display Suite Module which allows us to style forms as we wish, but it doesn't integrate well on Profile 2 edit forms.
So after couple of hours of investigation - I found a small but brilliant module to replace Profile 2 - Edit Profile Module
This module creates separate "Edit account" and "Edit profile" tabs for each user, with custom user fields configured under "Edit profile."
The goal of the module is to make fields attached to users (a new feature introduced in Drupal 7 core) a reasonable option for building simple, clean user profiles. Instead of having all properties of the user account editable via a single "Edit" tab (as Drupal does by default), where custom user profile fields are mixed in with account settings such as username, password, and time zone, sites using this module get a clean separation between these two different concepts, and a nicer experience for their end users.
Now - once we have Edit Profile module enabled we can get rid of Profile 2 module completely
Just add new fields to existing user account page (I used existing fields options not to break things up)
Now it's time for Display Suite module
Display Suite allows you to take full control over how your content is displayed using a drag and drop interface. Arrange your nodes, views, comments, user data etc. the way you want without having to work your way through dozens of template files. A predefined list of layouts (D7 only) is available for even more drag and drop fun!
By defining custom view modes (build modes in D6), you can define how one piece of content should be displayed in different places such as teaser lists, search results, the full node, views etc.
Drupal Display Suites edit form
When enabled Display Suites module head to configuration options and choose for you are interested in (in this case user - manage form)
You will have many options to choose from how to display your from - in my case I chose Two Column layout
Here is the final result of user/edit form
User edit form DS
Bonus - Display default image on forms
This is a little utility module that shows the default image of an image field as part of the image widget, if no image has been uploaded yet. It is displayed in the same way that the image preview of images that have been uploaded is displayed.
The display logic is identical to that of the image formatter: If the field instance has defined a default image, that is displayed. Else, if the field has defined a default image, that is displayed. Else no image is displayed, just like without this module.
The module does not come with any configuration or permissions.