Editing "Edit User Profile" layout templates - display order

[michaelschutz]

Forum URL: (private)

Hi - I want to strongly encourage my users to fill out their Display Name field and some custom fields. So one part of trying to do that is trying to make these things more visible to them. So I want to 1. have the first tab active when clicking "Edit Profile" to be the Personal tab, not Avatar; and 2. move the custom fields in the Personal tab to display right underneath the "Display Name" field.

I've poked around in the template editor, but I can't find a way to do either of these things.

Re: #1 - I can't find any code that would suggest how to specify the "first active" tab. It's not the source order in the code, since the source order of the tabs doesn't match the display order on the actual Edit Profile page. Am I missing seeing something in the code, or is there another way to do this?

Re: #2 - on the "User Profile" layout template editor page, there are tabs for editing the sections of the profile display "Summary, Activity, Following", etc. But on the "Edit User Profile" page, there are no such tabs for its individual sections. It would make sense to me that this is where I could edit the display of the "Personal" tab, and get the custom fields to display up higher on the page. Since those aren't an option, how can I edit the layout templates of those individual tab sections to re-order the display of the various elements in a given section/tab?

Thanks in advance for any help.

[Brian]

Hi, michaelschutz.

1. The default tab is determined by what's present in the address bar. You'll notice that when you switch tabs the URL in the address bar changes. With that in mind, go to Themes > Layout Templates > User Profile and change this line:

$[edit_profile_button]

To this:

{if $[edit_profile_button]}<a class="button" role="button" href="/user/$[user.id]/personal">Edit Profile</a>{/if}

2. You need to use Javascript to achieve this since you can't edit the majority of this template. Adding this to the beginning of the Edit User Profile template should do it.

<script type="text/javascript">
    $(document).ready(function(){
        $('.form_user_edit_personal div[class^="custom-field-"]').insertAfter($('.form_user_edit_personal input[id$="_name_input"]').first().nextAll('br').eq(1));
    });
</script>

[michaelschutz]

Thanks for the prompt reply, Brian. I'll make those changes.

[michaelschutz]

Both of those worked great. Thanks for the quick and easy fix!