How can I create a "Achievments" div?

Go down

In progress How can I create a "Achievments" div?

Post by Daniel Klein on February 4th 2019, 6:34 pm

Hi guys!

I'm searching how I can add a "Achievments" space above of the post div.

If the "Achievments" content can be automatically the same of a specific field of the user profile, it would be awesome.

But if it cannot be automatic, it's ok. I just want a "Achievments" div for each user and a way to edit the content of that div.

Here is a example of a board that uses this resource:

http://shinsekai.forumeiros.com/t129-olar-tudo-bem#601 (Note the "Conquistas" field above the post div, I see the translation of "Conquistas" and is "Achievments")

My forum version is ModernBB! Thank you. Smile
Daniel Klein
Daniel Klein
New Member

Posts : 9
Reputation : 1
Language : English

http://psu-sna.forumotion.net/

Back to top Go down

In progress Re: How can I create a "Achievments" div?

Post by SLGray on February 4th 2019, 7:52 pm




When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
SLGray
SLGray
Administrator
Administrator

Male Posts : 44977
Reputation : 3174
Language : English
Location : United States

http://fmthemesdesignteam.forumotion.com/

Back to top Go down

In progress Re: How can I create a "Achievments" div?

Post by Daniel Klein on February 4th 2019, 8:25 pm


This tutorial is very good, and i really liked it. Congratulations! Very Happy

But this is not exactly my question Sad

I will work with this system of awards (achievments), but my real question is: How can I show the awards in a div above the messages of the user?

See this image:



Daniel Klein
Daniel Klein
New Member

Posts : 9
Reputation : 1
Language : English

http://psu-sna.forumotion.net/

Back to top Go down

In progress Re: How can I create a "Achievments" div?

Post by skouliki on February 4th 2019, 8:34 pm

you need to modify the view topic body and then style it with css
skouliki
skouliki
Manager
Manager

Female Posts : 5292
Reputation : 840
Language : English,Greek
Location : Greece

http://iconskouliki.forumgreek.com

Back to top Go down

In progress Re: How can I create a "Achievments" div?

Post by SLGray on February 4th 2019, 8:49 pm

I am sending you a PM about a different issue I found on your forum.



When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
SLGray
SLGray
Administrator
Administrator

Male Posts : 44977
Reputation : 3174
Language : English
Location : United States

http://fmthemesdesignteam.forumotion.com/

Back to top Go down

In progress Re: How can I create a "Achievments" div?

Post by Daniel Klein on February 4th 2019, 9:18 pm

@skouliki wrote:you need to modify the view topic body and then style it with css

That's okay, but how i will put the awards of each specific user on the field above the message of that user? Modify the view topic body will make the field appear, but don't will make it work. I will be simply creating an empty field. :s
Daniel Klein
Daniel Klein
New Member

Posts : 9
Reputation : 1
Language : English

http://psu-sna.forumotion.net/

Back to top Go down

In progress Re: How can I create a "Achievments" div?

Post by Daniel Klein on February 5th 2019, 10:39 pm

bump
Daniel Klein
Daniel Klein
New Member

Posts : 9
Reputation : 1
Language : English

http://psu-sna.forumotion.net/

Back to top Go down

In progress Re: How can I create a "Achievments" div?

Post by Hades Riviera on February 7th 2019, 12:23 pm

Can we use this in Awesome BB Beta?
Hades Riviera
Hades Riviera
New Member

Posts : 2
Reputation : 1

Back to top Go down

In progress Re: How can I create a "Achievments" div?

Post by skouliki on February 7th 2019, 1:01 pm

@Hades Riviera wrote:Can we use this in Awesome BB Beta?

hello

please do not hijack other members posts
you can open your own thread if you need help
skouliki
skouliki
Manager
Manager

Female Posts : 5292
Reputation : 840
Language : English,Greek
Location : Greece

http://iconskouliki.forumgreek.com

Back to top Go down

In progress Re: How can I create a "Achievments" div?

Post by Daniel Klein on February 8th 2019, 7:43 am

bump
Daniel Klein
Daniel Klein
New Member

Posts : 9
Reputation : 1
Language : English

http://psu-sna.forumotion.net/

Back to top Go down

In progress Re: How can I create a "Achievments" div?

Post by TheCrow on February 8th 2019, 8:48 am

Hello @Daniel Klein,

Please create a profile field as below:
Type : Text Zone
Name : Any
Description : Any
URL icon : Leave blank
Necessarily filled ? No
Display : Profile & Messages
Display type : Icon
Who can modify the profile field value ? Moderators
Display this field for users that are at least : Any
Separator : Back to the line

And to the text zone content please paste this in it:
Code:
[table id="achievements" class="postAch"][tr][td]ACHIEVEMENT 1[/td][td]ACHIEVEMENT 2[/td][/tr][/table]

Once you do that, all you have to do is to add this in your Javascript set to all the pages:
Code:
$(function(){
  $('#achievements').insertBefore('.post');
});
And save your Script.

Last but not least go to your CSS and paste this code in it:
Code:
table#achievements {
  display: block;
  background: #e1ebf2;
  margin: 5px 0;
  padding: 5px;
  border: 1px solid;
  font-size: 14px;
  border-radius: 5px;
}
And save.

That should create what you wish for and once you change this field on a member's profile it should automatically change in the posts as well.

Regards. :rose:
TheCrow
TheCrow
Manager
Manager

Male Posts : 5953
Reputation : 672
Language : Greek, English
Location : Cyprus, Greece

https://www.inforumgr.com

Back to top Go down

In progress Re: How can I create a "Achievments" div?

Post by Daniel Klein on February 10th 2019, 6:01 am

@TheCrow wrote:Hello @Daniel Klein,

Please create a profile field as below:
Type : Text Zone
Name : Any
Description : Any
URL icon : Leave blank
Necessarily filled ? No
Display : Profile & Messages
Display type : Icon
Who can modify the profile field value ? Moderators
Display this field for users that are at least : Any
Separator : Back to the line

And to the text zone content please paste this in it:
Code:
[table id="achievements" class="postAch"][tr][td]ACHIEVEMENT 1[/td][td]ACHIEVEMENT 2[/td][/tr][/table]

Once you do that, all you have to do is to add this in your Javascript set to all the pages:
Code:
$(function(){
  $('#achievements').insertBefore('.post');
});
And save your Script.

Last but not least go to your CSS and paste this code in it:
Code:
table#achievements {
  display: block;
  background: #e1ebf2;
  margin: 5px 0;
  padding: 5px;
  border: 1px solid;
  font-size: 14px;
  border-radius: 5px;
}
And save.

That should create what you wish for and once you change this field on a member's profile it should automatically change in the posts as well.

Regards. :rose:

Hey, TheCrow

Thank you so much! But there still a problem: The achievments keep showing in the profile info in the side of the messages! They show in both of profile info and over the post box.

What should I do in this case?

Only the first message of the topic don't show the achievments in the box of profile info at the side of message.
Daniel Klein
Daniel Klein
New Member

Posts : 9
Reputation : 1
Language : English

http://psu-sna.forumotion.net/

Back to top Go down

In progress Re: How can I create a "Achievments" div?

Post by TheCrow on February 12th 2019, 6:47 pm

Hello @Daniel Klein,

I did not understand what is the problem. Can you please send us a link where guests can view this problem or maybe some screenshot to help us understand the issue more.

Regards.
TheCrow
TheCrow
Manager
Manager

Male Posts : 5953
Reputation : 672
Language : Greek, English
Location : Cyprus, Greece

https://www.inforumgr.com

Back to top Go down

In progress Re: How can I create a "Achievments" div?

Post by Daniel Klein on February 14th 2019, 7:34 am

@TheCrow wrote:Hello @Daniel Klein,

I did not understand what is the problem. Can you please send us a link where guests can view this problem or maybe some screenshot to help us understand the issue more.

Regards.

I solved the problem.

But I discover a bigger problem. It's very simple.

The "achievments" field is not displaying the respective user achievments... the field it's ever displaying the achievments of the first user of the topic page! xD

For example, if i'm the author of the first post of page 2 and my achievment field is filled with just "winner.png". In this case, ALL the achievments spaces of all users in the page 2 is displaying exactly just "winner.png".

I think this is a fail in the javascript code.

Code:
        $(function(){
          $('#achievements').insertBefore('.post');
        });

The code pick the #achievments and insert before post. But... it has to pick the nearest #achievments and insert before each respective post.

I don't know how to fix this, but i think i identified the problem. What should I do? :s
Daniel Klein
Daniel Klein
New Member

Posts : 9
Reputation : 1
Language : English

http://psu-sna.forumotion.net/

Back to top Go down

In progress Re: How can I create a "Achievments" div?

Post by Daniel Klein on February 15th 2019, 6:03 pm

bump Sad
Daniel Klein
Daniel Klein
New Member

Posts : 9
Reputation : 1
Language : English

http://psu-sna.forumotion.net/

Back to top Go down

In progress Re: How can I create a "Achievments" div?

Post by Daniel Klein Today at 12:40 am

bump ...
Daniel Klein
Daniel Klein
New Member

Posts : 9
Reputation : 1
Language : English

http://psu-sna.forumotion.net/

Back to top Go down

Back to top


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