About me? [Archive] - vb.org Archive

Tasking Mickey

11-14-2010, 11:00 AM

On this site, In the "About Me" tab. I see boxes surrounding the profile field.

http://iaza.com/work/101115C/iaza1305052759500.jpg

How can it be created? And if it's a modification. Does anyone know what the modification is called? So I can download it?

Or even if it's a template edit. I need to know what it is. :)

Tasking Mickey

11-16-2010, 10:56 AM

Bumping this. :)

Tasking Mickey

11-21-2010, 07:28 PM

Bumping this. Hopefully someone can help me.

BirdOPrey5

11-21-2010, 07:42 PM

Likely done by custom edits to the template and the boxes are probably <legend> tags... you can view source to confirm but here is more info on using <legend>: http://www.htmlcodetutorial.com/forms/_LEGEND.html

Tasking Mickey

01-29-2011, 02:47 PM

Would you happen to know what custom edit I should do to arrange them like that?

Lynne

01-29-2011, 02:51 PM

As Joe said, go take a look at the page source on that site to see what they did. It's probably a <legend> tag.

Tasking Mickey

01-29-2011, 02:55 PM

Well, when I take a look at the page source, anything I really see with the profile legends is

<fieldset class="fieldset"><legend>

Then the profile fields begin. But I see nothing that arranges it into 2 boxes like in the picture.

Lynne

01-29-2011, 04:05 PM

I have no idea what those boxes contain, but I'm guessing the CSS is written such that each takes up 50% of the width. It is impossible to figure out CSS from an image. You will need to use something like firebug to see what they are doing there.

BirdOPrey5

01-29-2011, 04:18 PM

Look for fieldset in the CSS code, that will likely have the code they used to create what they did.

Tasking Mickey

01-29-2011, 05:26 PM

OK, so I did view the source, and I did find the "About me Tab" in the CSS and got this.

* About Me Tab
*/
#aboutme li.profilefield_category {
font-weight:bold;
margin-top:6px;
}
#aboutme dl.profilefield_list {
font-weight:normal;
margin:6px 16px 0px 16px;
}
#aboutme dl.profilefield_list dd {
margin-bottom:6px;
margin-left:0px;
}
#aboutme #signature {
width:100%;
overflow:auto;
}
#aboutme #simple_aboutme_link {
text-align: right;
display: block;
}

That being said, how can I edit my css code? For the About Me tab?

BirdOPrey5

01-29-2011, 11:51 PM

This is my css of about me and it's basically the same so this isn't the code you need. I suggest again to search for fieldset.

/**

* About Me Tab

*/

#aboutme li.profilefield_category {

font-weight:bold;

margin-top:6px;

}

#aboutme dl.profilefield_list {

font-weight:normal;

margin:6px 16px 0px 16px;

}

#aboutme dl.profilefield_list dd {

margin-bottom:6px;

margin-left:0px;

}

#aboutme #signature {

width:100%;

overflow:auto;

}

#aboutme #simple_aboutme_link {

text-align: right;

display: block;

}

Tasking Mickey

01-30-2011, 09:53 AM

OK, so I do search again, yes but the only thing I get is,


<div id="aboutme" class="tborder content_block">
<h4 class="thead block_title">
<a href="LINK TO PROFILE /></a>
<a name="aboutme"></a>

About Me
</h4>
<div class="block_content" id="collapseobj_aboutme" style=""><div class="alt1 block_row">

<div id="simple_aboutme_link"><a rel="nofollow" class="smallfont" href="LINK TO PROFILE">View your "About Me" as seen by everyone else</a></div>

<ul class="list_no_decoration">




<table width="100%" border="0" cellspacing="4" cellpadding="4">
<tr>
<td>

<fieldset class="fieldset"><legend>

Note, that is in the MEMBERINFO template. But It doesnt look like anything that arranges my "About Me" tab to look like the one in the photo.

BirdOPrey5

01-30-2011, 12:13 PM

I'd imagine it starts with the HTML comment 
and it looks like it might simply be a table now... or a combo of a table and legend tags, the rest of the code would continue after where you cut it off.

Tasking Mickey

01-30-2011, 12:17 PM

Actually, your right. It does start with 

Heres the full code in the MEMBERINFO template.


<div id="aboutme" class="tborder content_block">
<h4 class="thead block_title">
<a href="http://www.toontowncentral.com/forums/members/tate.html#top" class="collapse_gadget" onclick="return toggle_collapse('aboutme')"><img id="collapseimg_aboutme" src="http://www.toontowncentral.com/forums/images/buttons/collapse_generic.gif" alt="" border="0" /></a>
<a name="aboutme"></a>

About Me
</h4>
<div class="block_content" id="collapseobj_aboutme" style=""><div class="alt1 block_row">

<div id="simple_aboutme_link"><a rel="nofollow" class="smallfont" href="http://www.toontowncentral.com/forums/member.php?u=127856&tab=aboutme&simple=1">View your "About Me" as seen by everyone else</a></div>

<ul class="list_no_decoration">




<table width="100%" border="0" cellspacing="4" cellpadding="4">
<tr>
<td>

<fieldset class="fieldset"><legend>Profile Fields start here

Is that what I can put into my MEMBERINFO template?

BirdOPrey5

01-30-2011, 01:36 PM

No you can't copy and paste the code from an HTML source into a template- you would hard code things that need to be variable.

Why do you say this is the full code of MEMBERINFO- you don't have access to MEMBERINFO just the output from some other site, right? A full MEMBERINFO template looks nothing like that, look at your own...

And once again you cut off what is probably the relevant code below:

<fieldset class="fieldset"><legend>Profile Fields start here

Tasking Mickey

01-30-2011, 01:57 PM

Yeah, I got that from a source, the pages source.

Would you happen to know the "hard code" that I can do that will arrange my "About me" page to look like that?

Here is the full full code.


<div id="aboutme" class="tborder content_block">
<h4 class="thead block_title">
<a href="http://www.toontowncentral.com/forums/members/tate.html#top" class="collapse_gadget" onclick="return toggle_collapse('aboutme')"><img id="collapseimg_aboutme" src="http://www.toontowncentral.com/forums/images/buttons/collapse_generic.gif" alt="" border="0" /></a>
<a name="aboutme"></a>

About Me
</h4>
<div class="block_content" id="collapseobj_aboutme" style=""><div class="alt1 block_row">

<div id="simple_aboutme_link"><a rel="nofollow" class="smallfont" href="http://www.toontowncentral.com/forums/member.php?u=127856&tab=aboutme&simple=1">View your "About Me" as seen by everyone else</a></div>

<ul class="list_no_decoration">




<table width="100%" border="0" cellspacing="4" cellpadding="4">
<tr>
<td>

<fieldset class="fieldset"><legend>First Toon: Crazy Beaniegrooven (Open)</legend>
Toon Name: Crazy Beaniegrooven 
Toon Type: Dog 

Toon laff points: 126 
Working Task Area: Bossbot HQ 
Gag Tracks: 





<img src="/forums/images/profile/gags/trap7.jpg" width="18" height="18">



<img src="/forums/images/profile/gags/lure7.jpg" width="18" height="18">



<img src="/forums/images/profile/gags/sound7.jpg" width="18" height="18">



<img src="/forums/images/profile/gags/throw7.jpg" width="18" height="18">



<img src="/forums/images/profile/gags/squirt7.jpg" width="18" height="18">



<img src="/forums/images/profile/gags/drop7.jpg" width="18" height="18">

 
Sellbot Cog Suit: Mr. Hollywood (Maxed) 
Cashbot Cog Suit: Robber Baron (Maxed) 

Lawbot Cog Suit: Bigwig (Maxed) 
Bossbot Cog Suit: Big Cheese 
Fish Species Caught: 57 
Current Rod: Gold 

Doodle Name: N/A 
Kart Type: Roadster 
Flower Varieties Collected: 35 
Shovel Type: Gold Shovel 

Watering Can Size: Huge Watering Can 
Racing Trophies Won: 22 
Golf Trophies Won: 13 
</fieldset> </td>
<td>

<fieldset class="fieldset"><legend>Second Toon: Crazy Beaniegrooven (Test)</legend>

Toon Name: Crazy Beaniegrooven 
Toon Type: Dog 
Toon laff points: 15 
Working Task Area: Toontown Central 

Gag Tracks: 


<img src="/forums/images/profile/gags/blank_gag.jpg" width="18" height="18">


<img src="/forums/images/profile/gags/blank_gag.jpg" width="18" height="18">


<img src="/forums/images/profile/gags/blank_gag.jpg" width="18" height="18">



<img src="/forums/images/profile/gags/blank_gag.jpg" width="18" height="18">


<img src="/forums/images/profile/gags/throw1.jpg" width="18" height="18">


<img src="/forums/images/profile/gags/squirt1.jpg" width="18" height="18">


<img src="/forums/images/profile/gags/blank_gag.jpg" width="18" height="18">

 
Sellbot Cog Suit: None 

Cashbot Cog Suit: None 
Lawbot Cog Suit: None 
Bossbot Cog Suit: None 
Fish Species Caught: 0 

Current Rod: None 
Doodle Name: N/A 
Kart Type: Cruiser 
Flower Varieties Collected: 

Shovel Type: Tin Shovel 
Watering Can Size: Small Watering Can 
Racing Trophies Won: 
Golf Trophies Won: 

</fieldset> </td>
</tr>
</table>
<dt class="shade">Additional Toons:</dt>
<dd></dd>

<dl class="list_no_decoration profilefield_list">
<dt class="shade">Favorite ToonTown Activity:</dt>
<dd>Training my Doodles</dd>
<dt class="shade">Favorite Forum Activity:</dt>
<dd>Being involved with my clan</dd>

<dt class="shade">Location:</dt>
<dd>The Estate</dd>
</dl>
</li>

<li class="profilefield_category">
Signature
<dl class="list_no_decoration profilefield_list"><dd id="signature"><div align="center"><img src="http://iaza.com/work/110102C/iaza19844469378000.png" border="0" alt="" /><img src="http://iaza.com/work/110102C/iaza19844417875300.png" border="0" alt="" /></div><div align="center"><a href="http://www.toontowncentral.com/forums/doodle-improvements-guild/" target="_blank">Doodle Improvements Guild</a>│<a href="http://www.toontowncentral.com/forums/payments.php" target="_blank">Donate to TTC│</a><a rel="nofollow" href="http://www.toontowncentral.com/forums/private.php?do=newpm" target="_blank">PM ME</a> 
</div></dd></dl>
</li>


</ul>
</div></div>
</div>


Well, at least when I get it from the source.

BirdOPrey5

01-30-2011, 03:32 PM

OK, I can see this code is in a table, with 2 cells, next to each other... the basic HTML of the table is:

<table>
<tr>
<td>
CELL 1 STUFF
</td>
<td>
CELL 2 STUFF
</td>
</tr>
</table>

And the code they are using for CELL 1 in your example is:

<fieldset class="fieldset"><legend>First Toon: Crazy Beaniegrooven (Open)</legend>
Toon Name: Crazy Beaniegrooven 
Toon Type: Dog 

Toon laff points: 126 
Working Task Area: Bossbot HQ 
Gag Tracks: 





<img src="/forums/images/profile/gags/trap7.jpg" width="18" height="18">



<img src="/forums/images/profile/gags/lure7.jpg" width="18" height="18">



<img src="/forums/images/profile/gags/sound7.jpg" width="18" height="18">



<img src="/forums/images/profile/gags/throw7.jpg" width="18" height="18">



<img src="/forums/images/profile/gags/squirt7.jpg" width="18" height="18">



<img src="/forums/images/profile/gags/drop7.jpg" width="18" height="18">

 
Sellbot Cog Suit: Mr. Hollywood (Maxed) 
Cashbot Cog Suit: Robber Baron (Maxed) 

Lawbot Cog Suit: Bigwig (Maxed) 
Bossbot Cog Suit: Big Cheese 
Fish Species Caught: 57 
Current Rod: Gold 

Doodle Name: N/A 
Kart Type: Roadster 
Flower Varieties Collected: 35 
Shovel Type: Gold Shovel 

Watering Can Size: Huge Watering Can 
Racing Trophies Won: 22 
Golf Trophies Won: 13 
</fieldset> </td>
<td>

So basically it looks like they have some special code to add a series of images, if those images are set somewhere for this user.

Under that it looks like pretty basic HTML...

But back to the original question, it looks like you can do this by adding <legend> html tags around your profile fields, maybe use the table to break them into two cells.

Tasking Mickey

01-30-2011, 03:36 PM

And where can I access the profile fields? In the MEMBERINFO template? In the memberinfo_aboutme template? Or in some other template,

So I can add the <legend> tag. Of course, I will be doing this on my TEST site.

BirdOPrey5

01-30-2011, 04:14 PM

The template to edit should be: memberinfo_block_aboutme.

Tasking Mickey

01-30-2011, 05:39 PM

OK, so here is my coding so far in the memberinfo_block_aboutme template.

<div class="alt1 block_row">
<if condition="$show['simple_link']">
<div id="simple_aboutme_link"><a class="smallfont" href="member.php?$session[sessionurl]u=$bbuserinfo[userid]&tab=aboutme&simple=1">$vbphrase[view_your_about_me]</a></div>
</if>
<if condition="$show['edit_link']">
<div id="simple_aboutme_link"><a class="smallfont" href="member.php?$session[sessionurl]u=$bbuserinfo[userid]&tab=aboutme">$vbphrase[edit_your_about_me]</a></div>
</if>
<ul class="list_no_decoration">


<table width="100%" border="0" cellspacing="4" cellpadding="4">
<tr>
<td>

<fieldset class="fieldset"><legend>$block_data[fields]</td>
</tr>
</table>
<if condition="$prepared['signature']">
<li class="profilefield_category">
$vbphrase[signature]
<dl class="list_no_decoration profilefield_list"><dd id="signature">$prepared[signature]</dd></dl>
</li>
</if>
</ul>
</div>

The most to look at is where it says < -- CUSTOM -->

Do I remove the $block_data[fields]? Here is my screenshot of the AboutMe page on my TEST site.

http://iaza.com/work/110131C/iaza11138261428800.png

BirdOPrey5

01-30-2011, 06:24 PM

If you're not interested in the Bio/Interests/Location/etc... then yes remove $block_data[fields].

Lynne

01-30-2011, 06:42 PM

It would probably help if you posted an image of what you have now (you posted that above) and what you want it to look like.

Tasking Mickey

01-30-2011, 07:38 PM

I want my "About Me" tab to look like the image I posted on the OP.

@Bird0Prey, I removed the $block_data[fields] and it showed no profile fields. I want one table to show "Toon 1" and all the stuff below that, and another table to show "Toon 2" and all the info under toon 2.

Lynne

01-30-2011, 08:47 PM

And where do these First Toon and Second Toon items come from? what is your code to spit them out?

Tasking Mickey

01-30-2011, 09:32 PM

That was my question all along, How can I make them split into 2 tables?

Lynne

01-30-2011, 09:43 PM

That's not what I am asking. Where are you getting the information to *fill* those two tables? What are they? Oh wait, I think I was confused cuz I didn't see Toon 2 in your image, but I'll assume it is under there already.

Tasking Mickey

01-30-2011, 09:47 PM

Yes, it's under there,

Would you happen to kow a code to split toon 1 and toon 2 into tables like the image on the OP?

BirdOPrey5

01-30-2011, 11:05 PM

Are those really 36 separate profile fields though or does the info come from a mod?

Tasking Mickey

01-30-2011, 11:07 PM

36... separate... profile... fields...

BirdOPrey5

01-31-2011, 02:32 PM

Wow that's crazy... I really don't know how exactly you'd do it, my guess would be some plugins are needed on one or more of the member_profileblock_ hooks and template edits as well.

Tasking Mickey

01-31-2011, 07:51 PM

Nevermind. I got it, had alot of coding in the memberinfo_block_aboutme template.

Thanks for the help! :)

This may be closed.

JustAskJulie

02-23-2011, 10:05 PM

This might be what you are looking for: http://www.vbulletin.com/forum/showthread.php/224639-How-To-Place-Profile-Info-In-Fieldset-Style-Boxes-In-postbit_legacy