Div under Whole MP

[Alan Vende]

Forum URL: psychic-psyghtings.proboards.com

I was wondering how the div was put under the mini-profile in this post. I know that it's only for the winners of the Custom Mini-Profile Design Contest, but I wanted to do something like that for my staff - giving them an area where they can have a custom message in their mini-profiles that follow them.

So far, I have this:



That was after doing this in the HTML:

<div class="msg-user-info">
$[user]<br />
<div class="msg-group-name">$[user.group.name]</div>
$[user.group.stars]
<div class="msg-custom-title">$[user.custom_title]</div>
$[user.warning.bar]<br />
$[user.avatar]<br />
<div class="msg-status">$[user.personal_text]</div>
<div class="info">
       <div class="msgpostlike">Posts: <span class="float-right">$[user.posts]</span>
           <br />Likes: <span class="float-right">$[user.likes]</span></div>
<span class="msg-staff">Staff Member</span>
<div class="msg-MPro-PM">
           <a href="http://psychic-psyghtings.proboards.com/conversation/new/40" alt="PM $[user.name]">Send PM</a>
</div>
<div class="msg-online">
   Member is Online
</div>
<div class="badges">
   <br />
   $[user.badges]
</div>
</div>
</div>

<div class="staff-group-tag">$[user.group.name]</div>

<div class="content-box" style="font-size: 9px; text-align: center; padding: 0 0 5px; position: relative; top: 5px; margin-bottom: 5px;">
<img style="width: 16px; height: 16px; position: relative; top: 4px;" src="http://images.proboards.com/v5/badges/small_icons/designer.png">
<a href="http://support.proboards.com/thread/491036/results-mini-profile-design-contest">MP Design Contest Winner</a>
</div>
To put it below everything, I naturally thought that it would go below the whole mini-profile, but that's apparently not the case.

If my memory serves, Brian told me that it was done using his Custom Mini-Profile Creator Plugin, but the above screenshot is as far as I have gotten. I have tried to reposition it with CSS, but that didn't work out very well...

/* .mini-profile.msg-mp .msg-bottom-div {
   position: absolute;
   margin-bottom: 500px;
} */
I have since commented it out to make sure that it didn't execute, but I wanted to keep it there in case it could be figured out.

Thanks for your help!

[Alan Vende]

Bump

[T.C.]

Try this 
<div class="msg-user-info">
$[user]<br />
<div class="msg-group-name">$[user.group.name]</div>
$[user.group.stars]
<div class="msg-custom-title">$[user.custom_title]</div>
$[user.warning.bar]<br />
$[user.avatar]<br />
<div class="msg-status">$[user.personal_text]</div>
<div class="info">
       <div class="msgpostlike">Posts: <span class="float-right">$[user.posts]</span>
           <br />Likes: <span class="float-right">$[user.likes]</span></div>
<span class="msg-staff">Staff Member</span>
<div class="msg-MPro-PM">
           <a href="http://psychic-psyghtings.proboards.com/conversation/new/40" alt="PM $[user.name]">Send PM</a>
</div>
<div class="msg-online">
   Member is Online
</div>
<div class="badges">
   <br />
   $[user.badges]
</div>
</div>
</div>

<div class="staff-group-tag">$[user.group.name]</div>

<div class="content-box" style="font-size: 9px; text-align: center; padding: 0 0 5px; position: relative; top: 5px; margin-bottom: 5px;">
<img style="width: 16px; height: 16px; position: relative; top: 4px;" src="http://images.proboards.com/v5/badges/small_icons/designer.png">
</div>
<a href="http://support.proboards.com/thread/491036/results-mini-profile-design-contest">MP Design Contest Winner</a>
</div>

[Alan Vende]

Thanks, T.C. !

That's closer, but it got me this:

[T.C.]

I just tried it using the default mini profile layout. Placing the </div> above <a href="http://support.proboards.com/thread/491036/results-mini-profile-design-contest">MP Design Contest Winner</a> placed it outside the mp. I tried but failed 

[Alan Vende]

Dec 21, 2015 16:20:28 GMT -8 T.C. said:

I just tried it using the default mini profile layout. Placing the </div> above <a href="http://support.proboards.com/thread/491036/results-mini-profile-design-contest">MP Design Contest Winner</a> placed it outside the mp. I tried but failed 

Thank you for trying, my friend.

[Alan Vende]

Bump

[Alan Vende]

Bump

[Alan Vende]

Bump

[Alan Vende]

Bump

[Alan Vende]

Bump

[Tumbleweed]

Alan Vende ,

Is that all you have in your mini-profile because I put this....


<div class="content-box" style="font-size: 9px; text-align: center; padding: 0 0 5px; position: relative; top: 5px; margin-bottom: 5px;">
<img style="width: 16px; height: 16px; position: relative; top: 4px;" src="http://images.proboards.com/v5/badges/small_icons/designer.png">
<a href="http://support.proboards.com/thread/491036/results-mini-profile-design-contest">MP Design Contest Winner</a>
</div>

...at the bottom of my mini-profile template without your css and it is at the bottom just like Kami's. Although adding it like that will not be specific to a user but be on all the mini-profiles.

[Alan Vende]

Jan 5, 2016 21:34:41 GMT -8 Tumbleweed said:

Alan Vende ,

Is that all you have in your mini-profile because I put this....


<div class="content-box" style="font-size: 9px; text-align: center; padding: 0 0 5px; position: relative; top: 5px; margin-bottom: 5px;">
<img style="width: 16px; height: 16px; position: relative; top: 4px;" src="http://images.proboards.com/v5/badges/small_icons/designer.png">
<a href="http://support.proboards.com/thread/491036/results-mini-profile-design-contest">MP Design Contest Winner</a>
</div>

...at the bottom of my mini-profile template without your css and it is at the bottom just like Kami's. Although adding it like that will not be specific to a user but be on all the mini-profiles.

It is, but I am putting it into Brian's Custom Mini-Profile Template and, for some reason, it's not behaving that way.

[Tumbleweed]

Jan 5, 2016 21:46:17 GMT -8 Alan Vende said:

Jan 5, 2016 21:34:41 GMT -8 Tumbleweed said:

Alan Vende ,

Is that all you have in your mini-profile because I put this....


<div class="content-box" style="font-size: 9px; text-align: center; padding: 0 0 5px; position: relative; top: 5px; margin-bottom: 5px;">
<img style="width: 16px; height: 16px; position: relative; top: 4px;" src="http://images.proboards.com/v5/badges/small_icons/designer.png">
<a href="http://support.proboards.com/thread/491036/results-mini-profile-design-contest">MP Design Contest Winner</a>
</div>

...at the bottom of my mini-profile template without your css and it is at the bottom just like Kami's. Although adding it like that will not be specific to a user but be on all the mini-profiles.

It is, but I am putting it into Brian's Custom Mini-Profile Template and, for some reason, it's not behaving that way.

Awww, o.k. When I read your first post I read it like you were guessing it was Brian's but didn't realize you were actually using it. Is this a plug in or a template because my previous comment about it showing on all profiles stands if it is a template. Is that template/plugin in the library? I'm also thinking if there would be an easier way but is this custom message something you/just staff will add because the way you said, " giving them an area where they can have a custom message" sounds like they will have control over what is the custom message.

[Alan Vende]

Jan 5, 2016 22:04:00 GMT -8 Tumbleweed said:

Jan 5, 2016 21:46:17 GMT -8 Alan Vende said:

It is, but I am putting it into Brian's Custom Mini-Profile Template and, for some reason, it's not behaving that way.

Awww, o.k. When I read your first post I read it like you were guessing it was Brian's but didn't realize you were actually using it. Is this a plug in or a template because my previous comment about it showing on all profiles stands if it is a template. Is that template/plugin in the library? I'm also thinking if there would be an easier way but is this custom message something you/just staff will add because the way you said, " giving them an area where they can have a custom message" sounds like they will have control over what is the custom message.

Sorry about that. I had really no idea how to explain it, so I tried to explain it the best that I could. A while back, I asked how the boxes for the members who won the Custom MP Design Contest were done, and (I think) it was Brian that told me that it was an HTML div inside the Custom Mini-Profile Creator Plugin, which is why I knew that I could do it, I just can't seem to get it to work - and I've tried everything I could think of - which is why I have come here for help. I've put it at the bottom of the template before the closing div, I put it at the bottom below the closing div. I'm not really sure what else there is to try.

His Plugin is in the library, yes. I'm not sure if there is an easier way or not. I said, "giving them an area where they can have a custom message", but I forgot to say that they won't be able to edit that custom message - that we will edit it and it will go under their MPs.

If it helps, Luv kind of achieved what I want to do on my forum on hers, but she put it at the top of her mini-profile. I know the she's probably using the regular theme template, but yeah.

I guess I don't know how, if it is in the regular theme template, how to make it so it shows in the Custom Mini-Profile Creator. I mean, you wouldn't use <link rel="stylesheet"...> and all that, would you? I mean, normally, yes, you would, but I doubt that that's how you do it for Brian's plugin. I don't know where to search on the web, either, as I don't know what to put in to get what I want for it. It's hard for me to explain, I guess.