The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Group post profile bakground

View previous topic View next topic Go down

Group post profile bakground

Post by Mimóza on January 2nd 2016, 3:38 pm

Hello,
I'd like to add different background images to the different group's post profile.
Anyone could help me, please? Very Happy 





punbb 
http://escvillage.createtopic.com/

Mimóza
Forumember

Female Posts : 541
Reputation : 241
Language : :)
Location : @Graphic Balloon

http://www.graphicballoon.com/

Back to top Go down

Re: Group post profile bakground

Post by 10spetter10 on January 2nd 2016, 4:18 pm

I haven't really tested it but I guess this should do.

It takes the value of the title attribute of the rank image and place that as a classname to the profile.

Javascript, on the topics:
Code:
$(function () {
  $('div.author-info').each(function () {
      if($(this).find('img').length) {
        var rank = $(this).find('img').attr('title');
        var contProfile = $('this').parent();
        contProfile.addClass(rank);
      }
  });
});

css:
Code:
div.topic-author.Admin {
  background: red;
}

10spetter10
Forumember

Posts : 195
Reputation : 81
Language : Dutch

Back to top Go down

Re: Group post profile bakground

Post by YoshiGM on January 2nd 2016, 4:36 pm

Hi @Mimóza,
First, Go To : ACP > Modules > Javascript codes management.

And create a new one:

Code:
$(function() { $('st-admin').closest('div.topic-author').addClass('st-admin');
});

Place: In All Pages.

Next, Go Users & Groups > Rank Administration > Modifi your admin rank (click on :modify: ) and add this span class in the rank title:

Code:
<span class="st-admin">Rank Title</span>

And hit Save.

Finally, add this on your CSS (ACP > Display > Colors > CSS Stylesheet)

Code:
.topic-author, .st-admin {
    background-color: #FFE346;
}

You can add background-image: url('IMAGE LINK HERE'); or any other option that you want in the special ranks.

If you want a different background for each staff member, only add in the javascript a new class:

Code:
$('st-name').closest('div.topic-author').addClass('st-name');

I hope it helps you ^^
Have a nice day,

Yoshi ~

YoshiGM
Forumember

Male Posts : 512
Reputation : 76
Language : Spanish & English
Location : Mexico

http://asistencia.foroactivo.com/u21373

Back to top Go down

Re: Group post profile bakground

Post by Mimóza on January 2nd 2016, 6:03 pm

Thank you, guys! Very Happy
@10spetter10, unfortunately, nothing happened when I added those codes. Smile
@YoshiGM, the codes you have given changed all the members's background to the same. Very Happy Could it be restricted to groups?

Mimóza
Forumember

Female Posts : 541
Reputation : 241
Language : :)
Location : @Graphic Balloon

http://www.graphicballoon.com/

Back to top Go down

Re: Group post profile bakground

Post by Ace 1 on January 3rd 2016, 7:30 pm

I think that would only work if the users are in a group.

My guess is create multiple classes via javascript.

Follow what @YoshiGm said

Ace 1
Forumember

Male Posts : 691
Reputation : 38
Language : my css ready java yo scripts boi
Location : Druid Hill Park smoking indo

http://genocideclan.forumotion.com

Back to top Go down

Re: Group post profile bakground

Post by 10spetter10 on January 3rd 2016, 11:58 pm

Yoshi's code and mine should do actually the same thing. Except the part that in mine is a little error.

quick fix:
Code:
$(function () {
  $('div.author-info').each(function () {
      if($(this).find('img').length) {
        var rank = $(this).find('img').attr('title').toLowerCase();
        var contProfile = $(this).closest('.topic-author');
        contProfile.addClass(rank);
      }
  });
});

My guess for Yoshi's idea is that you have forgotten to update your rank image. Now it is for the admin:
Code:
<img src="http://i1370.photobucket.com/albums/ag257/AppleDrink/administrator.png" alt="Admin" title="Admin">

But you should change it to:
Code:
<img src="http://i1370.photobucket.com/albums/ag257/AppleDrink/administrator.png" alt="Admin" title="Admin" class="st-admin">


Because it search to a class, mine does search to the title.

10spetter10
Forumember

Posts : 195
Reputation : 81
Language : Dutch

Back to top Go down

Re: Group post profile bakground

Post by Mimóza on January 4th 2016, 4:30 pm

Well, yeah... this is were my copypaste-skills fail. I can't make it work!   
And I'm not sure if I want it to work anymore. Thank you so much for your time, anyway! Very Happy 

The topic may be garbaged. 

Mimóza
Forumember

Female Posts : 541
Reputation : 241
Language : :)
Location : @Graphic Balloon

http://www.graphicballoon.com/

Back to top Go down

Re: Group post profile bakground

Post by 10spetter10 on January 4th 2016, 6:20 pm

One last thing before it goes into the garbage.

While I was looking for the code of your hashtag-links I saw that you were trying to make it work, but there was a small mistake in your css.

You used:
Code:
.topic-author, .st-admin {
    background-color: #FFE346;
}

But it should be:
Code:
.topic-author.st-admin {
    background-color: #FFE346;
}

The profile container (topic-author) has both class' so there is no need for a komma. You only use a komma as an 'if' but in this case you need an 'and' (elements with classname 'topic-author' and 'st-admin').

10spetter10
Forumember

Posts : 195
Reputation : 81
Language : Dutch

Back to top Go down

Re: Group post profile bakground

Post by Mimóza on January 4th 2016, 8:15 pm

Geez, I feel so lame! Very Happy I tried again, but it's not working. This feature just wasn't meant for me. Very Happy 
Thank you for all your time, 10spetter10!! You're very caring and helpful! Very Happy

Mimóza
Forumember

Female Posts : 541
Reputation : 241
Language : :)
Location : @Graphic Balloon

http://www.graphicballoon.com/

Back to top Go down

View previous topic View next topic Back to top


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