UBB.Developers Forums UBB.threads 6 V6 Modifications Forum Design Integration Attention Dave!!

Okay I don't know if this is the proper forum to ask.

Remember I asked how ya did the changed to your forum that displays the graphics in the categories? You thought about writing up how ya did that. I think its a cool thing and would love to associate graphics in my forums.

Yep I remember. []/forum/images/icons/smile.gif[/]

I'll see what I can put together for a "how to" instruction block. You will have to use phpmyadmin or just enter the sql commands from the admin section of UBBT to create and fill the field needed. I called it Bo_Topicon. The graphic sizes are not stored (they should be though, at some point) so that's hard coded in the ubbthreads.php script. They must all be the same size or just don't specify one in the image tag.

With some luck I'll put the instructions in a text file tomorrow or maybe friday night. []/forum/images/icons/smile.gif[/]

Cool can't wait to see.

Why not just name the images after the board keyword and use that to get the image source? Then the only thing needed would be a image tag in the template looking something like this:

code:
<img src="{$config['images']}/{$forum[$c][$f]['Keyword']}.gif" alt="{$forum[$c][$f]['Title']}" align="left">

---

And just put it in the ubbthreads.tmpl right before the line with the forum description:

code:
{$forum[$c][$f]['Description']}

---

Then just create the pictures, put them in the image directory and name them after the board keyword and with the correct image extension.

In this way there is no need to change the database, it's just a matter of changing the template.

LoL I was just thinking this exact same thing a momment ago. But, then I also thought what if a particular forum didn't have an associated image? That wouldn't look to good. One could probably look to see if the file existed or not before adding the image tag. Your idea is a good one though. Less impact on the database too. []/forum/images/icons/smile.gif[/]

whatever would work I guess cant wait to see the proper instructions for such a hack.

Seems I didn't think it through. My suggestion was basicly a version of another hack I have where a include file is inserted on the first page of a forum (with some extra forum info) and I thought that since I didn't do a php include I wouldn't need to check if the file existed. But of course there would be a broken link if it isn't there. It is of course possible to have an image of size 1x1 with transparent background as well, but checking for it is probably better.
The following php code might work, though it hasn't been tested:

code:
if (is_readable("{$config['images']}/{$forum[$c][$f]['Keyword']}.gif")) { 
$forumimagesize = getimagesize("$config['images']}/{$forum[$c][$f]['Keyword']}.gif"); 
print "<img src="{$config['images']}/{$forum[$c][$f]['Keyword']}.gif" alt="{$forum[$c][$f]['Title']}" align="left" {$forumimagesize[3]}>"; 
}

---

In the template it should be enclosed with html comments like this: <!-- code here //UBBTREMARK -->
Possibly on every line, not sure about that since I haven't done so much template editing yet.

In the "default" directory of your "templates" directory find the ubbthreads.tmpl file.

Change these lines:

<font class="forumtitle">
<a href="{$config['phpurl']}/postlist.php?Cat=$Cat&Board={$forum[$c][$f]['Keyword']}">
{$forum[$c][$f]['Title']}
</a>
</font>


To this:

<img src="{$config['images']}/{$forum[$c][$f]['Keyword']}.gif" alt="{$forum[$c][$f]['Title']}" />
<font class="forumtitle">
<a href="{$config['phpurl']}/postlist.php?Cat=$Cat&Board={$forum[$c][$f]['Keyword']}">
{$forum[$c][$f]['Title']}
</a>
</font>



And then upload your board related images to your image directory. The board related images need to be named with the board's keyword. If you don't have a specific graphic to use with a board I sugges creating a 1 pixel transparent gif to be used so that there are no blanks displayed. []/forum/images/icons/smile.gif[/]

This is the easiest way of doing this hack. Hope this makes it easier to understand.

PS I used the .gif extention in this example. You can change that to .jpg or what ever but it will need to remain the same for all boards.

Ack... I forgot the align="left"

Is getimagesize() ment for physical size or dimentions(sp?)?

But you have filled in most of the blanks. []/forum/images/icons/smile.gif[/]

The getimagesize() is just to get the width and the height of the picture, it is not really necessary. But since I don't like how browsers behave when loading pictures that don't have the width and height set I like to have it set.

Oops, seems I messed up with the paths to the image directory. Here is the working code:

code:
if (is_readable("{$config['imagepath']}/{$forum[$c][$f]['Keyword']}.gif")) { 
$forumimagesize = getimagesize("{$config['imagepath']}/{$forum[$c][$f]['Keyword']}.gif"); 
$forumimage = "<img src="{$config['images']}/{$forum[$c][$f]['Keyword']}.gif" alt="{$forum[$c][$f]['Title']}" align="left" {$forumimagesize[3]}>"; 
} else { 
$forumimage = ""; 
}

---

I wasn't sure if this returned the entire width="" height="" string. Guess it does. []/forum/images/icons/smile.gif[/] My php book mentions nothing of this function. Maybe it's time I bought a new book. LoL

http://www.php.net/documentation is your friend. =] I don't have a PHP book at all, I'm doing fine with the docs on their site.

Yes, getimagesize() returns an array with three elements, the first and second contains the width and the heigt, the third is an integer describing what type of image it is and the fourth is a string with width and height that can be used in the img-tag.

Thanks for the URL []/forum/images/icons/smile.gif[/]

I myself have to have a book sitting next to me when I'm playing. LoL just me. []/forum/images/icons/smile.gif[/]

Dave's code works fine. I did not try your gardner. I simply added the left align and a height and width tag in the img src and things display fine.

Yeah, that should work just fine as long as all images are the same size and the dummyt gifs are in place.

Actually incorrect! []/forum/images/icons/grin.gif[/] The images don't have to be the same size. They do have to be square so as not to be distorted. The image is actually constrained to a size you specify with the height and width tags. Here is the code modified from what Dave posted above with the align and width height tags.

<img src="{$config['images']}/{$forum[$c][$f]['Keyword']}.jpg" height="64" width="64" align="left" alt="{$forum[$c][$f]['Title']}" />
<font class="forumtitle">
<a href="{$config['phpurl']}/postlist.php?Cat=$Cat&Board={$forum[$c][$f]['Keyword']}">
{$forum[$c][$f]['Title']}
</a>
</font>

Now what would be really nice since I do not know how to create a transparent image would be that if no gif existed that it would default to board normal.

Yeah, well, of course it will work with a hard coded width and height, but it won't work fine which was what I commented. IMHO it won't look good having a stretched and distorted image, as well as I don't like having no width and height attributes, but it still works without them.

If you want to have a transparent gif you can download this one.

Making it default to a board normal if no image esits requires some PHP-code, but it is easy to change my code example for that. The only thing you need to do is to insert the img tag for the image in the line:
$forumimage = "";

code:
 
if(is_readable("{$config['imagepath']}/{$forum[$c][$f]['Keyword']}.gif")) { 
$forumimagesize = getimagesize("{$config['imagepath']}/{$forum[$c][$f]['Keyword']}.gif"); 
$forumimage = "<imgsrc="{$config['images']}/{$forum[$c][$f]['Keyword']}.gif" alt="{$forum[$c][$f]['Title']}" align="left" {$forumimagesize[3]}>"; 
} else { 
$forumimage = "<img src="{$config['images']}/board.gif"  alt="{$forum[$c][$f]['Title']}" align="left" width="35" height="35">"; 
} 

---

In the example above I've named the default board image board.gif.

where would your code go in place of?

Just put the PHP code right below the line that looks like this:

code:
<!-- for($f=0;$f<$forumsize[$c];$f++) { //UBBTREMARK -->

---

so that it looks like this:

code:
<!-- for($f=0;$f<$forumsize[$c];$f++) { //UBBTREMARK --> 
if(is_readable("{$config['imagepath']}/{$forum[$c][$f]['Keyword']}.gif")){ 
  $forumimagesize =getimagesize("{$config['imagepath']}/{$forum[$c][$f]['Keyword 
']}.gif"); 
  $forumimage = "<img src="{$config['images']}/{$forum[$c][$f]['Keyword']}.gif\ 
"alt="{$forum[$c][$f]['Title']}" align="left"{$forumimagesize[3]}>"; 
} else { 
  $forumimage = "<img src="{$config['images']}/board.gif" alt="{$forum[$c][$f 
]['Title']}" align="left" width="35"height="35">"; 
} 

---

And then put {$forumimage} where you put the image tag before, before the forum description.

Gardener's code is much better though. []/forum/images/icons/smile.gif[/]

There is more to it but that's because it is doing what I would want it to do in that it checks to see if the image exists before displaying it. It also adds the correct width/height sizes too.

This eliminates the need for a transparrent .gif for boards with none and the graphic sizes can very.

It's a great hack. []/forum/images/icons/smile.gif[/]

Gardners code might be better if it worked []/forum/images/icons/wink.gif[/]

I get parse errors when doing exactly what he says to do in the template.

Your code works fine []/forum/images/icons/wink.gif[/]

I'll take a look at the code to see why when I get a chance. Any thoughts Gardener? []/forum/images/icons/smile.gif[/]

Or at least I hope so. =] Seems that I screwed up the lines in my last post, so here comes a new and improved version that should work.

In ubbthreads.tmpl, after this line:

code:
<!-- for($f=0;$f<$forumsize[$c];$f++) { //UBBTREMARK -->

---

Add the following:

code:
 
$fimage = "{$forum[$c][$f]['Keyword']}.gif"; 
if (!is_readable("{$config['imagepath']}/$fimage")) { 
  if (is_readable("{$config['imagepath']}/board.gif")) { 
    $fimage = "board.gif"; 
  } else { 
    $fimage = ""; 
  } 
} 
if ($fimage) { 
  $forumimagesize = getimagesize ("{$config['imagepath']}/$fimage"); 
  $forumimage = "<img src="{$config['images']}/{$fimage}" alt="{$forum[$c][$f]['Title']}" align="left" {$forumimagesize[3]} />"; 
} else { 
  $forumimage = ""; 
} 

---

And change this line:

code:
{$forum[$c][$f]['Description']}

---

to this:

code:
{$forumimage}{$forum[$c][$f]['Description']}

---

This new version also checks for the size of the default picture board.gif and if neither the forum specific gif or the default one exists, no image tag is printed.

Now this one works well []/forum/images/icons/wink.gif[/]

Phew, I can't screw it up every time... =] I actually followed my instructions after I had posted it to check that everything went OK and nothing got messed up when posting either.

Too bad I won't be using the hack myself though... There are so many boards on my forum that I think it will be too many pictures on the front page. I'll check with our designer to see what he thinks though.

Does anyone have an example of this?

Ian

yes, an example would be nice []/forum/images/icons/smile.gif[/]

This adds an image in the forum title/description area and not the category title area?

And does the image have to be the same for all forums? Can it be different based on keyword? And can it be a background image instead of an icon type image? []/forum/images/icons/smile.gif[/]

The image is inserted to the left of the forum description, even though it can be placed anywhere on the row of that forum if you want. It is just a matter of placing the "{$forumimage}" where the picture should go.

You can have a different image for every board, you just have to name them after the boards Keyword. This board would have an image called "integration.gif". If no image for the forum exists a default image "board.gif" is inserted instead, if it exists. This way you can have the same for all boards if you want to, as well.
If you want it to be a background image instead you could use the variable {$fimage} instead and place it in the background attribute of the table where you want it to show up.

I can't show you a working version of the hack right now, since my server has a little too much load at the moment. Maybe in an hour or two. In the meantime you can look at how it could look like at JustDaves test board: http://www.chattersonline.com/test/ubbthreads.php?Cat=
It's not the same hack, but it looks the same. =]

Maybe the default image could be based on the category name, to have a different default for each category? It's a quite easy fix for those who want's it I guess, just add another line setting the name of the default image right below the category loop.

aaahhh... ok, so it's pretty versatile then, thanks. []/forum/images/icons/smile.gif[/]

I have a use for it I believe, works on a limited number of forums, but looks cool when done right []/forum/images/icons/smile.gif[/]

here is another example

http://www.reeftalk.com/beta/ubbthreads.php

This is good hack!!

What needs to be altered in IIP 4.2 to get it to happen there? Like at chattersonline.

also if you put

code:
{$forumimage} 
in front of  {$forum[$c][$f]['Title']} 
instaed of  {$forum[$c][$f]['Description']} 
 

---

the image becomes a link and picks up alt text

I'll post the how to on adding this to IIP later today when I get home. Or, perhaps Gardener could get to it before then? []/forum/images/icons/smile.gif[/]

Insert the following code at line 177:

code:
 
$fimage = "{$palKeyword}.gif"; 
if (!is_readable("{$config['imagepath']}/$fimage")) { 
  if (is_readable("{$config['imagepath']}/board.gif")) { 
    $fimage = "board.gif"; 
  } else { 
    $fimage = ""; 
  } 
} 
if ($fimage) { 
  $forumimagesize = getimagesize ("{$config['imagepath']}/$fimage"); 
  $forumimage = "<img src="{$config['images']}/{$fimage}" alt="{$palTitle}" align="right" {$forumimagesize[3]}/>"; 
} else { 
  $forumimage = ""; 
} 

---

Then change line 181 to this:

code:
echo " 
<TR> 
<TD ALIGN=LEFT VALIGN=TOP CLASS="$phclass[$i]" COLSPAN=2>$anchor 
<a href="{$config[phpurl]}/postlist.php?Board=$palKeyword">$palTitle</a></TD> 
</TR> 
<TR> 
<TD ALIGN=LEFT VALIGN=TOP CLASS="$ptclass[$i]"> 
<TABLE WIDTH=100% BORDER=0 CELLSPACING=0 CELLPADDING=2> 
<TR> 
<TD ALIGN=LEFT VALIGN=TOP WIDTH="100%" CLASS="$ptclass[$i]">{$forumimage}$userPic 
<a href="{$config[phpurl]}/showflat.php?Board=$palKeyword&Number=$palNumber"><B>$palSubject</B></A> 
$palStar$date$palUsername$attachment 
<BR><BR> 
$palBody$palPollInform 
<P ALIGN=RIGHT>$NumReplies$readMore$makeReply$mailPost$printPost</P> 
</TD> 
</TR> 
</TABLE> 
"; 

---

It is the same as before, but with the $forumimage variable inserted and some added line breaks so that it won't get messed up in this post.

Thanks for showing how to add it to IIP []/forum/images/icons/smile.gif[/]

P.S. Don't forget to mention that the file you are editing is the newspal.php.

Just so no one gets confused []/forum/images/icons/wink.gif[/]

Oops, sorry about that, it must have got lost when I edited the post, along with some comments in the beginning.

Is it easy to implement this mod to IIP 5.3 ?

It works. Nothing has changed that much

Thanks . I'll give it a try