Board remodel help, continued!

[Relic]

My website: ti-rpg.boards.net/
Original post: support.proboards.com/thread/458058/board-remodel-help

So I've been trying to get my boards to look like the following example that I created just to show you:



So far, I've gotten it to look exactly how I want! However, the board isn't actually clickable... as in, you can't access the board now :/
The kind CheatAreZee told me to post here so that a coder may be able to help me fix it so that you can actually click the board to go into it (like how you can click the board name on the default set up to go into the board). So, here I am!

Thank you in advance for any help you can offer me. I really appreciate it!

[pawl]

Would you be able to post up the code you're currently using for the Board List template, so that we can have a look? =]

[Relic]

Oh, I'm sorry! I didn't add anything to the template, I mainly just used a bunch of the <!-- and --> tags and moved the Last Post information to a different section. Here you go:

<table class="list" role="grid">
<!-- <thead>
<tr>
<th class="icon"></th>
<th class="main">Board</th>
<th class="threads">Threads</th>
<th class="posts">Posts</th>
<th class="latest last">Last Post</th>
</tr>
</thead> -->
<tbody>
{foreach $[board]}
{if !$[board.is_redirect]}
<tr id="$[board.content_id]" class="$[board.content_class]">
<!-- <td class="icon">$[board.icon]</td> -->
<td class="main clickable">
<!-- <span class="link">$[board]</span> {if $[board.num_viewing]}<span class="viewing"> - $[board.num_viewing] Viewing</span>{/if} -->
<center><p class="description">$[board.description]</p>
                       {if $[board.posts] > 0}
{if $[board.last_thread]}
$[board.last_thread.recent_link]<br />
by $[board.last_thread.last_post.created_by_user]<br />
<span class="date">$[board.last_thread.last_post.date]</span>
{/if}
{else}
No posts have been made on this board.
                       {/if}</center>
<!-- {if $[board.num_mods]}
<p class="moderators">
Moderator{if $[board.num_mods] != 1}s{/if}:
{foreach $[board.moderator_group]}$[board.moderator_group.comma_before] $[board.moderator_group]{/foreach}{if $[board.moderator]}{if $[board.moderator_group]}, {/if}{/if}
{foreach $[board.moderator]}$[board.moderator]$[board.moderator.comma] {/foreach}
</p>
{/if}
{if $[board.sub_board]}
<p class="sub-boards">
Sub-board{if $[board.sub_board] != 1}s{/if}:
{foreach $[board.sub_board]}<a href="$[board.sub_board.href]">$[board.sub_board.name]</a>$[board.sub_board.comma] {/foreach}
</p>
{/if} -->
</td>
<!-- <td class="threads">{if $[board.threads] == -1}N/A{else}$[board.threads]{/if}</td>
<td class="posts">{if $[board.posts] == -1}N/A{else}$[board.posts]{/if}</td> -->
<!-- <td class="latest last">
{if $[board.posts] > 0}
{if $[board.last_thread]}
$[board.last_thread.recent_link]<br />
by $[board.last_thread.last_post.created_by_user]<br />
<span class="date">$[board.last_thread.last_post.date]</span>
{/if}
{else}
No posts have been made on this board.
{/if}
</td> -->
</tr>
{else}
<tr id="$[board.content_id]" class="$[board.content_class]">
<td class="icon">$[board.icon]</td>
<td class="main clickable redirect last" colspan="4">
<span class="link">$[board]</span><br />
<p class="description">$[board.description]</p>
</td>
</tr>
{/if}
{/foreach}
{if !$[board]}
<tr class="last"><td class="last center" colspan="5">No boards were found.</td></tr>
{/if}
</tbody>
</table>

[pawl]

Okay, just had a quick play around with some stuff.
I've yet to have a look at your code to see how I can get it to work, but take a look here.

The dancing Pikachu is actually the board name.

It looks to me like you're putting your images in the board description, which may be the problem (again, I've yet to look properly =P).
I instead changed the $[board] (which displays the board name, definitely clickable) to the following;

<a href="$[board.href]"><img src="$[board.description]" /></a>


The <a href="$[board.href]"></a> will make sure that the image is linked to the board.
The <img src="$[board.description]" /> makes an image using the board descriptions as the URL, which we have to change (read below).

For each board, you want to change the description to the URL of it's relevant image - in my case it's simply http://paul-shepherd.com/images/personal/pikachu.gif


I'll check back once I've had a look around the rest of PBS, and take another look at the code you posted, see if I can modify it for you. =]

[Relic]

It worked! I was quite confused reading your post at first, but I tried my hand at it anyway, and here's what I did:

- Removed the <!-- and --> surrounding the $[board]
- Changed the $[board] <a href="$[board.href]"><img src="$[board.description]" /></a>
- Edited my Etiquette board so that the description was simply the URL to the image, and not an image tag
- That worked out well, but then I had the description showing still, so...
- Added <!-- and --> around the $[board.description]

Thank you so much pawl!

[pawl]

Sorry, got distracted by my family coming home. =P

That's basically the steps that I took on my test forum, and what I would have done with yours, too. Glad that you gave it a go though - always better to try something yourself (regardless of whether it works or not) than just be told to copy and paste. =]