X-Threads Garage?

[RateU]

The example is a basic function, RocketFoot. There are some modification we can do to it. Like adding more custom thread fields for car information like Year, Engine and etc, so, we can have a different information in our Details tabs. If we have other filter fields, we can use it in XThreads inline search. For example, if we specified the year by listbox, and make it as filter threads, then apply it in Xthreads inline search, our user can search a car by year.

The "main" part for this garage is gf_showthread and gf_forumdisplay_thread template. So, if we want to edit or change something, maybe we need to look at those templates. I think Leefish already tell it in the #14 post.

And, because we didn't force postbit layout here. if we change or edit the gf_postbit_first template, we need to change or edit the gf_postbit_first_classic too. Maybe you already know this. But if you don't want to deal with two postbit template, set the force postbit layout in XThreads Option to one of the postbit layout.

For the gf_forumdisplay_thread template, basically, the template contains two layout:

The first layout, for Garage Home:

HTML Code

1 2 3 4 5 6 7 8 9 10

<div class="float_left" style="width: 49%;{$filters_set['__all']['hiddencss']}"> <div style="text-align: center; width: 80%; margin: auto auto;"> <div style="height: 100px; vertical align: middle;"> <a href="{$threadurl}"><img src="{$GLOBALS['threadfields']['gfvimg']['url']}/thumb120x90" alt="View {$thread['subject']}" title="View {$thread['subject']}" /></a> </div> <span><a href="{$thread['threadlink']}">{$thread['subject']}</a>{$thread['multipage']}</span> <div class="author smalltext">Owner: {$thread['profilelink']}</div> <div class="author smalltext">Added: {$thread['threaddate']} - {$thread['threadtime']}</div> </div> </div>

---

There are no much fields in this layout. If we want to change how many thread per row, try to play with the width in the first line (line #1). Example: using 33% maybe will get three threads/garages per row. Just be careful with visitor/user with a small screen resolution if we want to play with it. The main thing for us to set the width is the thumbnail width we use for the image. For example, if we use 120x90 image thumbnail, and have 5 thread/garages per row, it already takes minimum 600px at the right side, not included the navigation at the left side and other properties of our template, like padding to the container and etc. Maybe in this condition, the layout will break/overlap for a user/visitor with a small screen resolution. Because I only have a max resolution 1024x768 (15" CRT monitor, yeah, a veeeeeery old computer ), that's why I set it to two threads/garages per row.

The second layout, for the Vehicles Details:

HTML Code

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34

<div style="{$filters_set['__all']['visiblecss']}"> <table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder" style="border: 0px;"> <tr> {$rating} <td class="tcat smalltext" align="center" colspan="{$colspan}"> <strong><a href="{$thread['threadlink']}" class="{$inline_edit_class} {$new_class}" id="tid_{$inline_edit_tid}">{$thread['subject']}</a></strong> </td> {$modbit} </tr> <tr> <td class="{$bgcolor} smalltext" rowspan="2" width="1" align="center" valign="middle"> <a href="{$threadurl}"><img src="{$GLOBALS['threadfields']['gfvimg']['url']}/thumb120x90" alt="View {$thread['subject']}" title="View {$thread['subject']}" /></a> </td> <td class="{$bgcolor}" colspan="4"> <div>Owner: {$thread['profilelink']}</div> <div>Added: {$thread['threaddate']} - {$thread['threadtime']}</div> </td> </tr> <tr> <td class="{$bgcolor} smalltext" align="center" height="25"> Comments: <a href="javascript:MyBB.whoPosted({$thread['tid']});">{$thread['replies']}</a>{$unapproved_posts} </td> <td class="{$bgcolor} smalltext" align="center" width="25%"> Odometer: {$GLOBALS['threadfields']['gfodometer']} </td> <td class="{$bgcolor} smalltext" align="center" width="15%"> Views: {$thread['views']} </td> <td class="{$bgcolor} smalltext" align="center" width="15%"> Price: {$GLOBALS['threadfields']['gfprice']} </td> </tr> </table> </div>

---

We can see that this layout has more information than the first layout. Pay attention to this layout if we change/edit our custom thread fields.

I hope this make it clearer, RocketFoot

BTW, may I add your garage forum as one of the live demo in the example post?