Go Back   vb.org Archive > vBulletin Article Depository > Read An Article > Programming Articles
FAQ Community Calendar Today's Posts Search

Reply
 
Thread Tools
How To Place Profile Info In Fieldset Style Boxes In postbit_legacy
peterska2
Join Date: Oct 2003
Posts: 6,504

 

Manchester, UK
Show Printable Version Email this Page Subscription
peterska2 peterska2 is offline 06-22-2006, 10:00 PM

This tutorial explains how to box profile information into individual fieldsets using two different methods in postbit_legacy.

I recommend using either one or the other of these effects as using them together will have a negative impact on the resulting postbit_legacy layout.

While this tutorial deals soley with the posts and join date part of the template, it gives easy to follow steps to use this on all your postbit information.


Fieldsets With Legends (no conditionals)

In your postbit_legacy template find
Code:
<div>
$vbphrase[posts]: $post[posts]
</div>
and replace with
Code:
<div>
<fieldset>
<legend>$vbphrase[posts]</legend>
<table border="0" cellspacing="0" cellpadding="0" width="100%">
<tr>
<td class="smallfont" align="center">$post[posts]</td>
</tr>
</table>
</fieldset>
</div>
There are a number of important details in this replacement code, so now we will look at each of them in turn.

Firstly, we have retained the
Code:
<div>
as this is used to place each piece of information on a new line. If this is omitted, then the layout will be compromised.

Next we have the
Code:
<fieldset>
This tells us that we are creating a fieldset box and everything until this is exited will be included within the box.

This is followed by
Code:
<legend>$vbphrase[posts]</legend>
This creates the title for the box which is emedded into the box border. You can place anything that you wish to use as the title for the box between the legend tags.

Now we move onto the content. In order to populate the box, we must first create a table to place the contents in. To do this we use the following code:
Code:
<table border="0" cellspacing="0" cellpadding="0" width="100%">
<tr>
<td class="smallfont" align="center">
This tells us that we are creating a content table to fill the width of the fieldset box, with no border, no cellspacing and no cellpadding. We do not need to use cellspacing or cellpadding as the fieldset has padding included automatically. You will also notice that there is no class specified apart from smallfont. This is because we want it to use the same class as that section of the postbit (usually alt2). The smallfont class is used to ensure that the text remains a set style throughout the template. Finally in this section is the alignment for the content (in this case center). If you wish to have the content left aligned, then just remove this part of the code.

The next thing to be added is the actual content for the cell we have created. In this case we are using
Code:
$post[posts]
to display the postcount.

Finally, we need to close everything that we have opened, otherwise the rest of the page will attempt to nest itself within the first fieldset of the first post on the page. To do this, add
Code:
</td>
</tr>
</table>
</fieldset>
</div>
to the end of your content.

You will now have a box in your postbit that looks like this:





Fieldsets With Legends (using conditionals)

These are done in exactly the same manner, but the conditional must remain around the outside of the code.

An example of this is the join date information included in the above image.

The code used to generate this is
Code:
<if condition="$post['joindate']">
<div>
<fieldset>
<legend>$vbphrase[join_date]</legend>
<table border="0" width="100%" cellspacing="0" cellpadding="0">
<tr>
<td align="center" class="smallfont">
$post[joindate]
</td>
</tr>
</table>
</fieldset>
</div>
</if>
You will notice that the rest of the code is identical to that used for ths post count, apart from the conditional, the phrase to use in the legend, and the actual content.



Fieldsets Without Legends

If you like this effect, but don't want the labels to be separated from the information, then you can use the exact same methods used in the above examples apart from a couple of changes. This then provides a solid border around the information.

Looking at the post count code again, the replacement code would be
Code:
<div>
<fieldset>
<table border="0" width="100%" cellspacing="0" cellpadding="0">
<tr>
<td align="center" class="smallfont">
$vbphrase[posts]: $post[posts]
</td>
</tr>
</table>
</fieldset>
</div>
You will notice that this time we have not included a legend and have left the label next to the details to be posted.

Again, using the items that have conditionals simply involves placing this code within the if code.

The resulting effect using this method is:




I hope that you find this technique useful. If you use it and would like to be added as a live demo for this effect please post the URL to a page on your site where this is in action.
Reply With Quote
  #2  
Old 06-23-2006, 09:49 PM
Mark.B Mark.B is offline
Senior Member
 
Join Date: Feb 2004
Posts: 1,354
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Fieldset boxes are the spawn of satan.....

I think inset/outset boxes look ok, or just proper boxes that match the style colours.

I don't know why I hate fieldsets but I just do.

Nice tutorial though...I know most people like fieldsets.
Reply With Quote
  #3  
Old 08-21-2006, 01:14 AM
patrickstar patrickstar is offline
 
Join Date: May 2006
Posts: 135
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

hello peterska2, ive added fieldsets to my postbit and now i wanna add a fieldset for the skyp, aim, yahoo, and msn info.

but the problem i have is if the user does not have that info filled out then that user still has the fieldset but its blank and doesnt look good.

is that what you mean by using the conditional method?

thanks.
Reply With Quote
  #4  
Old 08-21-2006, 01:19 AM
peterska2 peterska2 is offline
 
Join Date: Oct 2003
Location: Manchester, UK
Posts: 6,504
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Yes, try putting
Code:
<if condition="$post[skypeicon] || $post[msnicon] || $post[icqicon] || $post[aimicon] || $post[yahooicon]">
before the fieldset and
Code:
</if>
after
Code:
</fieldset>
Reply With Quote
  #5  
Old 08-21-2006, 01:30 AM
patrickstar patrickstar is offline
 
Join Date: May 2006
Posts: 135
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

this is what i had:
Code:
<div>$post[icqicon] $post[aimicon] $post[msnicon] $post[yahooicon] $post[skypeicon]</div> </div></td>
and this is what i tried, using the yahoo as an example:
Code:
<if condition="$show['yahooicon']"><div>
<fieldset class="fieldset"><legend><b>Contact:</b></legend>
<div>$post[icqicon] $post[aimicon] $post[msnicon] $post[yahooicon] $post[skypeicon]</div> 
</div></td>  
</fieldset></div> </if>
Reply With Quote
  #6  
Old 08-21-2006, 01:38 AM
peterska2 peterska2 is offline
 
Join Date: Oct 2003
Location: Manchester, UK
Posts: 6,504
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Code:
<if condition="$post[skypeicon] || $post[msnicon] || $post[icqicon] || $post[aimicon] || $post[yahooicon]"><div>
<fieldset class="fieldset"><legend><b>Contact:</b></legend>
<div>$post[icqicon] $post[aimicon] $post[msnicon] $post[yahooicon] $post[skypeicon]</div> 
</div></td>  
</fieldset></div> </if>
That should work
Reply With Quote
  #7  
Old 08-21-2006, 01:40 AM
patrickstar patrickstar is offline
 
Join Date: May 2006
Posts: 135
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Quote:
Originally Posted by peterska2
Yes, try putting
Code:
<if condition="$post[skypeicon] || $post[msnicon] || $post[icqicon] || $post[aimicon] || $post[yahooicon]">
before the fieldset and
Code:
</if>
after
Code:
</fieldset>
work great! thanks alot, i might have had it if i kept playing with it, but im sure you saved me a lot of time, thanks!!

and one more question, i added a fieldset for the 'status', and what happens is it puts the word status twice.


<fieldset class="fieldset"><legend><b>Status:</b></legend>
$post[onlinestatus] </fieldset>

im thinking this might be a phrase change fix?? or can i edit this?
Reply With Quote
  #8  
Old 08-21-2006, 01:55 AM
peterska2 peterska2 is offline
 
Join Date: Oct 2003
Location: Manchester, UK
Posts: 6,504
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

You might need to change your template postbit_onlinestatus
Reply With Quote
  #9  
Old 08-21-2006, 05:57 PM
patrickstar patrickstar is offline
 
Join Date: May 2006
Posts: 135
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

yep, just edited out 'status:' in the template postbit_onlinestatus

thanks for all the help.
Reply With Quote
  #10  
Old 09-04-2006, 12:47 AM
Ohiosweetheart Ohiosweetheart is offline
 
Join Date: Dec 2005
Location: N.E. Ohio
Posts: 2,291
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

is there a way to wrap the entire left side of postbit_legacy... enclose everything... in a fieldset (without legend of course)?
Reply With Quote
Reply


Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 07:08 AM.


Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2025, vBulletin Solutions Inc.
X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.04804 seconds
  • Memory Usage 2,306KB
  • Queries Executed 23 (?)
More Information
Template Usage:
  • (1)SHOWTHREAD
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (1)ad_showthread_beforeqr
  • (19)bbcode_code
  • (1)bbcode_quote
  • (1)footer
  • (1)forumjump
  • (1)forumrules
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (1)modsystem_article
  • (1)navbar
  • (4)navbar_link
  • (120)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (2)pagenav_pagelink
  • (10)post_thanks_box
  • (10)post_thanks_button
  • (1)post_thanks_javascript
  • (1)post_thanks_navbar_search
  • (10)post_thanks_postbit_info
  • (9)postbit
  • (10)postbit_onlinestatus
  • (10)postbit_wrapper
  • (1)spacer_close
  • (1)spacer_open
  • (1)tagbit_wrapper 

Phrase Groups Available:
  • global
  • inlinemod
  • postbit
  • posting
  • reputationlevel
  • showthread
Included Files:
  • ./showthread.php
  • ./global.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/class_hook.php
  • ./includes/modsystem_functions.php
  • ./includes/functions_bigthree.php
  • ./includes/class_postbit.php
  • ./includes/class_bbcode.php
  • ./includes/functions_reputation.php
  • ./includes/functions_post_thanks.php 

Hooks Called:
  • init_startup
  • init_startup_session_setup_start
  • init_startup_session_setup_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • style_fetch
  • cache_templates
  • global_start
  • parse_templates
  • global_setup_complete
  • showthread_start
  • showthread_getinfo
  • forumjump
  • showthread_post_start
  • showthread_query_postids
  • showthread_query
  • bbcode_fetch_tags
  • bbcode_create
  • showthread_postbit_create
  • postbit_factory
  • postbit_display_start
  • post_thanks_function_post_thanks_off_start
  • post_thanks_function_post_thanks_off_end
  • post_thanks_function_fetch_thanks_start
  • post_thanks_function_fetch_thanks_end
  • post_thanks_function_thanked_already_start
  • post_thanks_function_thanked_already_end
  • fetch_musername
  • postbit_imicons
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • postbit_display_complete
  • post_thanks_function_can_thank_this_post_start
  • pagenav_page
  • pagenav_complete
  • tag_fetchbit_complete
  • forumrules
  • navbits
  • navbits_complete
  • showthread_complete