The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Place the last of profile fields above post message

3 posters

Go down

Solved Place the last of profile fields above post message

Post by LeChat 24/10/2023, 22:44

Technical Details


Forum version : #phpBB3
Position : Founder
Forum link : https://mayo.forumpolish.com/

Description of problem

I wanna add a last of profile fields above a post (near to user name).

Like here:
color post - Place the last of profile fields above post message FhK6rzW

Is it possible to do that and keep the current fields layout?


Last edited by LeChat on 26/10/2023, 20:48; edited 1 time in total
LeChat
LeChat
Forumember

Posts : 39
Reputation : 1
Language : english, polish

http://cadikim.forumpl.net

Back to top Go down

Solved Re: Place the last of profile fields above post message

Post by Razor12345 25/10/2023, 16:14

Good afternoon!

Since you have heavily modified templates, I can't test the code on my test forum and use developer tools.

1) You need to create a field that will be displayed in the user's profile (AP - Users & Groups - Profiles)
For the demonstration, I will use your existing field - Multikonta.

2) You need to change the viewtopic_body template
Find the code fragment that is responsible for displaying the block with the class
Code:
headpost
.
In this block, add the following code:

Code:
<div class="special__element"></div>

color post - Place the last of profile fields above post message Scree467

3) AP - Modules - Javascript codes management - Create new JavaScript
Title: any
Placement: In the topics
Code:

Code:

$(document).ready(function() {
const listOfPosts = document.querySelectorAll('.post');

listOfPosts.forEach((item) => {
    const campoPElements = item.querySelectorAll('.pto-dentro .campo-p');
    const lastCampoElements = campoPElements[campoPElements.length - 1];
const layoutSpecialElement = item.querySelector('.special__element');
    if (lastCampoElements && layoutSpecialElement) {
            const spesialElementTitle = lastCampoElements.querySelector('.campp-label').textContent;

if (spesialElementTitle === 'Multikonta : ') {
       
        const specialElement = lastCampoElements.querySelector('.campp-cont').innerHTML;

    layoutSpecialElement.append(specialElement);
    lastCampoElements.style.display = 'none';

    }
    }
});
});

Save. Result:

Before:

color post - Place the last of profile fields above post message Scree468

After:

color post - Place the last of profile fields above post message Scree469

Important!
1) The profile field, which will be outside the information block, should be the last field in the users' profile.
2) This line of code checks for the presence of the field in the profile
Code:
if (spesialElementTitle === 'Multikonta : ') {

The string in quotes must match the name of the field in the profile.


color post - Place the last of profile fields above post message Screen51
Razor12345
Razor12345
Support Moderator
Support Moderator

Male Posts : 1462
Reputation : 262
Language : Ukr, Rus, Eng
Location : Ukraine

SarkZKalie likes this post

Back to top Go down

Solved Re: Place the last of profile fields above post message

Post by LeChat 25/10/2023, 22:50

Thank you, I tried to do that, but I think I must did something wrong. Can you check it on Jayden Ray profile?
LeChat
LeChat
Forumember

Posts : 39
Reputation : 1
Language : english, polish

http://cadikim.forumpl.net

Back to top Go down

Solved Re: Place the last of profile fields above post message

Post by Razor12345 25/10/2023, 23:39

Send me the login and password for the admin account by private message, please.
I don't see any errors in the console that are related to this code.

I'll look into this issue tomorrow


color post - Place the last of profile fields above post message Screen51
Razor12345
Razor12345
Support Moderator
Support Moderator

Male Posts : 1462
Reputation : 262
Language : Ukr, Rus, Eng
Location : Ukraine

Back to top Go down

Solved Re: Place the last of profile fields above post message

Post by Razor12345 26/10/2023, 11:49

I changed the logic a bit and added an additional check

Result:

color post - Place the last of profile fields above post message Scree471

If you need help styling this area, let me know.


color post - Place the last of profile fields above post message Screen51
Razor12345
Razor12345
Support Moderator
Support Moderator

Male Posts : 1462
Reputation : 262
Language : Ukr, Rus, Eng
Location : Ukraine

Back to top Go down

Solved Re: Place the last of profile fields above post message

Post by LeChat 26/10/2023, 20:48

I styled it myself.
color post - Place the last of profile fields above post message OuPBUW2

Thank you for your help. <3
LeChat
LeChat
Forumember

Posts : 39
Reputation : 1
Language : english, polish

http://cadikim.forumpl.net

Razor12345 likes this post

Back to top Go down

Solved Re: Place the last of profile fields above post message

Post by skouliki 26/10/2023, 21:02

Problem solved & topic archived.
Please read our forum rules: ESF General Rules
skouliki
skouliki
Manager
Manager

Female Posts : 15133
Reputation : 1696
Language : English,Greek
Location : Greece

http://iconskouliki.forumgreek.com

Back to top Go down

Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum