So -- a couple of people have asked me to make a guide for them on how they can get a two column effect for child boards on various templates.
I'll be using version 1.1.5 in this guide with the default template which comes with SMF.
Alright, lets get our hands dirty in this mess, quick and easy. All our changes will be conducted in the BoardIndex.template.php file. So let's make a backup of that first in case you screw up.
cp /home/<username>/public_html/forum/Themes/default/BoardIndex.template.php /home/<username>/public_html/forum/Themes/default/BoardIndex.template.php.bak
You know the drill in Windows... ^^
Good, backup done. Time to modify it. Fire it up in your favourite editor and let's get cooking.
Replace lines 172-176 which contain the following code:
foreach ($board['children'] as $child)
{
$child['link'] = '<a href="' . $child['href'] . '" title="' . ($child['new'] ? $txt[333] : $txt[334]) . ' (' . $txt[330] . ': ' . $child['topics'] . ', ' . $txt[21] . ': ' . $child['posts'] . ')">' . $child['name'] . '</a>';
$children[] = $child['new'] ? '<b>' . $child['link'] . '</b>' : $child['link'];
}
With the following code:
foreach ($board['children'] as $child)
{
$child['link'] = '<a href="' . $child['href'] . '" title="' . ($child['new'] ? $txt[333] : $txt[334]) . ' (' . $txt[330] . ': ' . $child['topics'] . ', ' . $txt[21] . ': ' . $child['posts'] . ')">' . $child['name'] . '</a>';
$children[] = $child['new'] ? '<img style="margin-right:5px;" src="' . $settings['images_url'] . '/onk.gif" alt="' . $txt[333] . '"/><b>' . $child['link'] . '</b>' : '<img style="margin-right:5px;" src="' . $settings['images_url'] . '/offk.gif" alt="' . $txt[334] . '"/>' . $child['link'];
}
Note the images onk.gif and offk.gif -- Please change them to represent New Posts and No New Posts.
OK, that's done too -- good, let's move along...
Replace lines 178-183 which contain the following code:
echo '
<tr>
<td colspan="3" class="windowbg', !empty($settings['seperate_sticky_lock']) ? '3' : '', '">
<span class="smalltext"><b>', $txt['parent_boards'], '</b>: ', implode(', ', $children), '</span>
</td>
</tr>';
With the following code:
echo '
<table class="bordercolor" style="width:100%; border:0 none" cellspacing="1" cellpadding="3">
<tr>
<td align="center" valign="middle" style="width:7%">';
$child_counter = 0;
if(empty($settings['child_boards_rows']))
{
echo '
</td>
<td style="vertical-align:top; width: 30%;">';
for(; $child_counter < ceil(count($children)/2); $child_counter++)
echo $children[$child_counter], '<br/>';
}
echo '
</td>
<td style="vertical-align:top">';
for(; $child_counter < count($children); $child_counter++)
echo $children[$child_counter], '<br/>';
echo '
</td>
</tr>';
echo '
</table>';
Save the file and re-upload it to the correct place, to the folder of the template.
That's all there is to it, you're done and now have a nice two column layout which would make those guy/girls over the 4th Avenue Street jealous of you!
Do you happen to have a screenshot so I can see what it does before I attempt it? Thanks. :)
You can see a vB demo which uses a mod for this type of effect. Here (http://www.bihforum.com/)
Can this be expanded to include more than 2 columns?
Yes it can. I've just been playing with this for somebody who wanted to have up to four columns of child boards with a maximum of three child boards per column. After messing with it I found this works wonderfully well,
$child_counter = 0;
if(empty($settings['child_boards_rows']))
{
echo '
</td></tr><tr>
<td class="middletext" valign="top">';
for(; $child_counter < ceil(3); $child_counter++)
echo $children[$child_counter], '<br/>';
}
echo '
</td>
<td class="middletext" valign="top">';
for(; $child_counter < ceil(6); $child_counter++)
echo $children[$child_counter], '<br/>';
echo '
</td>
<td class="middletext" valign="top">';
for(; $child_counter < ceil(9); $child_counter++)
echo $children[$child_counter], '<br/>';
echo '
</td>
<td class="middletext" valign="top">';
for(; $child_counter < ceil(12); $child_counter++)
echo $children[$child_counter], '<br/>';
echo '
</td>
ETA: Why bother with little bits of code? I might as well attach the BoardIndex.template and be done with it. :)
QuoteETA: Why bother with little bits of code? I might as well attach the BoardIndex.template and be done with it.
are you trying to say i just need to put your attachment in my page and thats all?
does this modification works on a smf 2.04?
sorry for my dumb questions im newbie at all this but trying to learn from you guys
I'm sure the template changes with 2.0 will not allow you to just use the attached file, or even the code snippet.
so i cant be done in 2.04?
Oh it can be done alright. It just can't be done without some modifications to the 1.1.6 code. I haven't looked at this for 2b4 yet. If you're used to template edits you could probably sort it yourself. If you aren't then it'll probably drive you nuts.
Does the theme you're using have its own copy of BoardIndex.template.php or does it call the file from the default theme?
i think it dosent have one im using darkbreak theme
and i dont know how to edit last time i tried had to delet all the forum and install again hahaha
heres the one i found it was the default one didint find non on darkbreak
Yup, I know Darkbreak. I'll have a look at it over the weekend if nobody else sorts it first. How many columns of child boards do you want? I did a version of Mystic Jade that had four columns with three child boards in each one, so it makes no difference to me.
Also if you want drop menus for Darkbreak I've done those too.
i really dont know :( your talking about lines if you make it of tree if i only use 2 can it make a wrong efect?
if not make it of 3 to go sure hehe and thanks for the help
Well it wont mess anything up. It'll just leave empty spaces. Tell you what: I'll sort it in two columns. If you want three or whatever later on that's an easy thing to change. No big deal.
ok and again thanks
The $txt[] strings in 1.1.x are different in 2.x so you'll have to make sure you alter those where applicable if you're going to use the base 1.1.x file in 2.x
Yes I'm aware of that. I'll just rip the required lines of code and adapt them to the 2b4 template rather than attempting to use the entire 1.1.x template. Shouldn't be a big drama. I was planning on looking at this for 2b4 anyway so this is an incentive to sort it out.
Ok, all sorted. This will give child boards in two columns. Screenshot is attached.
For SMF 2 beta 4, open BoardIndex.template.php.
Find this:
// Has it posts awaiting approval?
if ($child['can_approve_posts'] && ($child['unapproved_posts'] | $child['unapproved_topics']))
$child['link'] .= ' <a href="' . $scripturl . '?action=moderate;area=postmod;sa=' . ($child['unapproved_topics'] ? 'topics' : 'posts') . ';brd=' . $child['id'] . ';sesc=' . $context['session_id'] . '" title="' . sprintf($txt['unapproved_posts'], $child['unapproved_topics'], $child['unapproved_posts']) . '" class="moderation_link">(!)</a>';
$children[] = $child['new'] ? '<strong>' . $child['link'] . '</strong>' : $child['link'];
}
echo '
<tr>
<td class="windowbg3 smalltext largepadding"><strong>', $txt['parent_boards'], '</strong>: ', implode(', ', $children), '</td>
</tr>';
Replace it with this:
// Has it posts awaiting approval?
if ($child['can_approve_posts'] && ($child['unapproved_posts'] | $child['unapproved_topics']))
$child['link'] .= ' <a href="' . $scripturl . '?action=moderate;area=postmod;sa=' . ($child['unapproved_topics'] ? 'topics' : 'posts') . ';brd=' . $child['id'] . ';sesc=' . $context['session_id'] . '" title="' . sprintf($txt['unapproved_posts'], $child['unapproved_topics'], $child['unapproved_posts']) . '" class="moderation_link">(!)</a>';
$children[] = $child['new'] ? '<strong>' . $child['link'] . '</strong>' : $child['link'].'<br />';
}
echo '
<tr>
<td class="windowbg3 smalltext" valign="top"><table><tr><td valign="top"><strong>', $txt['parent_boards'], ': </strong>';
$child_counter = 0;
if(empty($settings['child_boards_rows']))
{
echo '
</td>
<td valign="top">';
for(; $child_counter < ceil(count($children)/2); $child_counter++)
echo $children[$child_counter], ' ';
}
echo '
</td>
<td valign="top">';
for(; $child_counter < count($children); $child_counter++)
echo' ' ,$children[$child_counter], '';
echo '
</td></tr></table></td>
</tr>';
thanks for the fix now i have a cuestion i was looking if it can look like this
http://i38.tinypic.com/2hwf9s0.jpg
you can see it look organiced
now mines looks like this
http://i33.tinypic.com/2ch50l2.jpg
http://i38.tinypic.com/2ewmqgy.jpg
its suposed to look like this?
some of them have bold letter and some dont did i made ir wrong?
You wanted it in two columns. It's in two columns. You only have three child boards so obviously you'll get one in one column and two in the other column. What did you expect if you have three child boards?
ETA: And in your third screenshot you only have two child boards. Split them into two columns and you'll have one in each, which will just look like two child boards in one row, which is what you have.
If you want it to look like the first shot then make eight child boards and they will stack up in two columns. Isn't this common sense?
ok i will chek this out and tahnks for the fast reply other thing
and the bold letters and the nice chekmark on the first pic on every chield board how can i do somthing like that
made the test and here it is
http://i38.tinypic.com/2chn9z7.jpg
http://i36.tinypic.com/992kg9.jpg
theres one thats in the midle and dosent get align
and for how much lines did you do it?
and why is there ones with bold letters and other dont have it
The "Child Boards" text is already in bold, just like in your first pic. It's the same arrangement.
If you want icons in front of each child board you can do that too but it's more messing around and you'll need to make your own images.
Do this bit:
$children[] = $child['new'] ? '<strong>' . $child['link'] . '</strong>' : $child['link'];
Like this:
$children[] = $child['new'] ? '<img style="margin-right:5px;" src="' . $settings['images_url'] . '/onk.gif" alt=""/><b>' . $child['link'] . '</b>' : '<img style="margin-right:5px;" src="' . $settings['images_url'] . '/offk.gif" alt=""/>' . $child['link'];
Load two images (call them onk.gif and offk.gif) into the themes images folder and they will act like your normal on and off gifs for main boards.
The ones in bold are child boards that have new posts in them. That is a standard feature of SMF. ::)
I didn't set any limit on lines at all. All it does is split whatever child boards you have into two columns.
If you don't want the child board links to turn bold when there are new posts in the child boards that is easy to do, but seriously have you ever used child boards before and not noticed that SMF does that by default? Every SMF theme does that for every child board.
The last code I gave you has them set to stay not-bold because the images do the job of indicating when there are new posts.
Give me a link to the theme.
im new in this of webs and more on smf
im just looking for somthing so it can be more noticible or divided the subboards and that make them look nice and easy to lokate what can you recomend me?
and sorry for my bad english
and thanks for all the help
http://todoilegal.net/index.php?action=collapse;c=2;sa=collapse;#c2
and note i wont be using so much sub boards hehe
Here's a screenshot from my localhost with eight child boards. As you can see they stack into two even columns. If you have one child board out of line that means you have somehow bollixed the code. Take another look at it and make sure you have copied it correctly.
Quote from: sombra on November 26, 2008, 10:10:25 PM
im new in this of webs and more on smf
im just looking for somthing so it can be more noticible or divided the subboards and that make them look nice and easy to lokate what can you recomend me?
and sorry for my bad english
and thanks for all the help
http://todoilegal.net/index.php?action=collapse;c=2;sa=collapse;#c2
and note i wont be using so much sub boards hehe
What exactly do you want? You asked for the child boards in two columns so I gave you the code for that. It works. If you want images in front of each one I gave you the code for that too. It works as well.
The board you said was out of line (the MP3 child board) looks fine to me. It's in line with the others.
So what is the problem now? Decide what you want and I'll give you the code for it.
ok nvm seems like you dont understand what i want thanks for the help
I have already given you code that will make the child boards look like that first screenshot you posted. If that is what you still want then you have the code for it already. If you want something else then you'll have to explain what you want or nobody is going to be able to help you.
Quoteim just looking for somthing so it can be more noticible or divided the subboards and that make them look nice and easy to lokate what can you recomend me?
i was trying to tell you that meybe this wont do me well couse i dont have so much boards that what woud you recomend for me
Make a picture (cut and paste bits) and get it how you like it, then start another thread and ask how to get that result. That's the best way of dealing with it. If you don't know what you want nobody else has any chance.
antechinus, is it possible to give the entire front page 3 colums? I have attached a boardindex.template that I've been playing with, no where near complete, will you see if you think it would be possible to have...
Cat
B-1
B-1
B-1
X6
to become
Cat1 | Cat3 | Cat5
B-1a | B-3a | B-5a
B-1b | B-3b | B-5b
B-1c | B-3c | B-5c
Cat2 | Cat4 | Cat6
B-2a | B-4a | B-6a
B-2b | B-4b | B-6b
B-2c | B-4c | B-6c
Oh it's possible alright. Virtually anything is possible. Have you thought about how that would look on a standard 1024 monitor?
I won't be using the standard layout fpr board info.
I didn't think you would be. It would be totally impractical. I assume you're planning on arranging it more or less like portal front page blocks do with recent topics. Jade has already done a two column theme and three isn't all that different.
This isn't something that really interests me at the moment as I can see it tying up quite a bit of time which I'd rather spend on other things. I'm rather busy at the moment. Also it's quite off topic for this thread. You'd be better off starting a separate thread about it since this one has been ticked off as solved anyway, which means people aren't likely to pay much attention to it.
Gotcha. I'll check out the two column theme.
From memory she didn't release it. She just did it as a mod of Shadow People for one of her forums.
can some one make mine V (2.0 RC1) WITH 2 COLUMS... ;/
this is my boardindex...
this code doenst work for this mode: http://custom.simplemachines.org/themes/index.php?lemma=118 (Black Rain). Anyone?
Okay I need to know if this will work on smf 2.0rc2 curve and if so is it possible Antechinus that you can
edit my BoardIndex.template.php please.. But I would like 3 columns . I'm new at this and I'm frighten
that i may stuff it up..
I am using the default core theme for smf 2.0rc2 curve
Arantor is about to release a mod which does this, so I would advise waiting for the mod. ;)
Quote from: Antechinus on December 03, 2009, 05:25:24 AM
Arantor is about to release a mod which does this, so I would advise waiting for the mod. ;)
thanks for the heads up on this Antechinus much appreciate the feedback
Aranatos, has pubished the mod.
Is avaiable here
http://custom.simplemachines.org/mods/index.php?mod=2294