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.

Help with background for behind ADMIN profile details in posts

View previous topic View next topic Go down

In progress Help with background for behind ADMIN profile details in posts

Post by shadowolfozo on October 17th 2011, 1:30 pm

Hi all,

alright, so I went looking for a way to put background images behind a user's profile details in a post.
I found:
http://help.forumotion.com/t96989-post-profile-background-image-only-4-admin-need-code?highlight=admin+font+colour
http://help.forumotion.com/t96900-adding-new-feature-and-need-help and
http://help.forumotion.com/t96719-post-profile-background-image

but none of them work. well, not completely.
this is the problem:


The darkgreen box is where the background image should appear, but it is ONLY loading, in the section where it says 'Founder' (or admin) and doesn't load downwards or up.
ATM, my coding for it was:


Code:
.admin {
background-image: url("http://i40.servimg.com/u/f40/13/50/39/90/admin_10.png");
}
along with the ranks

Code:
<div class="admin"><font color="darkred">Founder</font> </div>
//for founder and below for admin//
<div class="admin"> <font color="#006BB3">Alpha</font></div>
as one of those top links said to do. (the div class bit)
Is there a reason this isn't working?

originally, the username and rank were above the avatars, but i moved them under hoping it would fix it. It didn't.
please help Smile

Link to my forum:
http://www.warriorwolves.darkbb.com

EDIT: after asking my dad, he can do it, just later. he got it working for all members, and tomorrow or whatever will change it to just admins.
However, I'm still curious to know why the original plan didn't work.

shadowolfozo
New Member

Posts : 18
Reputation : 0
Language : Australian
Location : Halo's Control Panel holding the Index (while playing Halo somewhere in Western Australia)

http://warriorwolves.darkbb.com

Back to top Go down

In progress Re: Help with background for behind ADMIN profile details in posts

Post by !_NICK_! on October 21st 2011, 1:07 am

Okay, I see the problem.

For the code you put in the CSS should be this.

Code:
.admin {
background-image: url("http://i40.servimg.com/u/f40/13/50/39/90/admin_10.png");
}

Now for the rank you should put this as the code.

Code:
<div class="admin"><font color="darkred">Founder</font> </div>

Note that in the image you chose it will only show the top little part.

!_NICK_!
Active Poster

Male Posts : 1505
Reputation : 69
Language : English, HTML, and CSS
Location : In the middle of no return.

Back to top Go down

In progress Re: Help with background for behind ADMIN profile details in posts

Post by LGforum on October 21st 2011, 3:03 am

Are you wanting the whole post profile to be a different background color?

Because if so, none of the above will work.

Notice how the DIV with class 'Admin' is both opened and closed within the rank, so any background image is ONLY going to be within the rank.

To do this correctly you will need a javascript which loops through the post profiles, checks if it is the admin post profile and if it is, changes the post profile background.

LGforum
Hyperactive

Male Posts : 2254
Reputation : 254
Language : English
Location : UK

http://www.avacweb.com/

Back to top Go down

In progress Re: Help with background for behind ADMIN profile details in posts

Post by Nera. on October 22nd 2011, 8:34 pm

Hi,

This should work for phpBB2 for the whole post.

PHPBB2

Step 1: Click on user on your board and you will arrive on his nick in AP. Scroll down and you will see Assign special rank. Add the rank corresponding to the user. Without it it wont work.

Step 2: AP > Users and groups > Rank administration, edit the rank of for example administrators and wrap it with a class

Code:
    <span class="admin1">Administrator</span>

Do the same thing for the moderator but with this

Code:
    <span class="mod2">Administrator</span>

Step 3: AP > Diplay > Templates > General > Wievtopic_body template and find this

Code:
   <tr class="post">
      <td class="{postrow.displayed.ROW_CLASS}"{postrow.displayed.THANK_BGCOLOR} valign="top" width="150">
         <span class="name"><a name="{postrow.displayed.U_POST_ID}"></a><strong>{postrow.displayed.POSTER_NAME}</strong></span>

            <span class="postdetails poster-profile">
            {postrow.displayed.POSTER_RANK}

            {postrow.displayed.RANK_IMAGE}{postrow.displayed.POSTER_AVATAR}


            <!-- BEGIN profile_field -->
            {postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
            <!-- END profile_field -->
            {postrow.displayed.POSTER_RPG}
         </span>

         <img src="http://illiweb.com/fa/empty.gif" alt="" style="width:150px;height:1px" />
      </td>
      <td class="{postrow.displayed.ROW_CLASS}"{postrow.displayed.THANK_BGCOLOR} valign="top" width="100%" height="28" colspan="2">
         <table width="100%" border="0" cellspacing="0" cellpadding="0">
            <tr>

Replace it with this

Code:
      <tr class="post">
<td class="post {postrow.displayed.ROW_CLASS}"{postrow.displayed.THANK_BGCOLOR} valign="top" width="150">
         <span class="name"><a name="{postrow.displayed.U_POST_ID}"></a><strong>{postrow.displayed.POSTER_NAME}</strong></span>

            <span class="postdetails poster-profile">
            {postrow.displayed.POSTER_RANK}

            {postrow.displayed.RANK_IMAGE}{postrow.displayed.POSTER_AVATAR}


            <!-- BEGIN profile_field -->
            {postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
            <!-- END profile_field -->
            {postrow.displayed.POSTER_RPG}
         </span>

         <img src="http://illiweb.com/fa/empty.gif" alt="" style="width:150px;height:1px" />
      </td>
      <td class="post {postrow.displayed.ROW_CLASS}"{postrow.displayed.THANK_BGCOLOR} valign="top" width="100%" height="28" colspan="2"><span class="novo" style="display:none;">{postrow.displayed.POSTER_RANK}</span>
         <table width="100%" border="0" cellspacing="0" cellpadding="0">
            <tr>

Save and publish your template on the green Add

End: AP > JS managment (Mark all pages) and add this
Code:
$(document).ready(function() {
$('.post:has(".admin1")').css('background-color', 'lightblue');
$('.post:has(".mod2")').css('background-color', '#FF77B1');
});

Example:


There's probably an easier way but I would not know it.

If you want an image you just need to use the JS images code, like this:

Code:
$(document).ready(function() {
$('.post:has(".admin1")').css('background-image' , 'url(http://www.nextgenupdate.com/forums/images/Admin-bg.jpg)');
$('.post:has(".mod2")').css('background-image' , 'url(http://www.nextgenupdate.com/forums/images/Admin-bg.jpg)');
});

Hello

Nera.
Energetic

Female Posts : 7077
Reputation : 2013
Language : English
Location : -

http://webartzforum.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