SSI_NavBar (BETA) left $board nav buttons w/ Custom Pages (BETA) - SMF 2.0

[ElectricSquid]

I can never just leave it alone, LOL

I have a vision for the new custom theme I am working on that requires me to create buttons for each board. These buttons will make up a navbar on the left of the page, along with the standard [home] [search] and [logout] buttons.

Partitioning the page is easy, I have that done.
The part I am stuck on is getting the foreach to work for each board['id'] to create each button the same way the boards are created on the board index. The catch is I need this small amount of code to work on index.template.php, since this navbar will be on each page.

I've tried to simply copy the code over from board.index.php, to index.templete.php, with some custom hacking, but I can't seem to get it to work.

Any bright ideas?
All I need is a simple foreach that will work in index.template.php, that will create a simple text button for each board.

Thanks!!

[Antechinus]

Not sure about this one but what code do you currently have anyway?

[Arantor]

The problem is that you need to actually be loading the board list at some point prior to the index.template.php loading.

On the board index, this is done via BoardIndex.template.php, and subsequently loading Subs-BoardIndex.php. You'd have to transfer the query from Subs-BoardIndex.php, which loads the board data, perhaps into Load.php or index.php (or more hackishly, or worse index.template.php itself)

[ElectricSquid]

The structure of how all these files load baffles me a bit, so I thank you for explaining the order.

Last night, I posted this way after my bedtime, so I had to make it quick.
Now that I have time, I'll give a fuller explanation...

First, I'll state the obvious, please bear with me.
Most forums look the same.
Board index is the front page, giving a full list of;

• Category
• Collapse Category Function
• Board Icon
• Board Name
• Board Description
• Post & Topic Count
• Last Post
• New Post Icon
• Mark As Read
• Basic Stats
• Basic Who's Online
• Newest Member
• Basic Calendar Info

Did I miss something in there?

Now here's what I want to do.
Simply put, I want to eliminate 95% of the above because I believe I could create the site without it on the "Board Index". This would completely clear out the board index template and I can then re-use it to code up a nice homepage with my own styling, coding and the use of some SSI if need be.

The extra features that normally show up (who's online, stats, calendar) have their own pages which I will build buttons for.

The boards themselves have their own pages which are handled by Message Index. All I need to do is build button links for the individual boards. This would completely bypass the need to even show the normal Board Index as it is coded now.

Categories? I this is the one thing Board Index shows to the end user that the other templates do not. Showing categories, in my opinion, is the only reason to leave Board Index as it is. But the end user doesn't really need to see "categories" or know they are there (at least on my site).
On the backend they are cool to have for permissions purposes, but that can be handled per board if need be. I personally don't find any need for categories. I could put all the boards in one category and be perfectly happy.

Sum it Up
Create board link buttons for index.template that are created dynamically (the way they are on board index)
Create matching buttons for existing navbar links
Wipe out existing board index coding
Recode board index with custom homepage

The problem is that you need to actually be loading the board list at some point prior to the index.template.php loading.

On the board index, this is done via BoardIndex.template.php, and subsequently loading Subs-BoardIndex.php. You'd have to transfer the query from Subs-BoardIndex.php, which loads the board data, perhaps into Load.php or index.php (or more hackishly, or worse index.template.php itself)

I'm hosted from this server sitting right here in front of me, so editing files is about as easy as it can get.
Um, which file do you suggest the most, to move the Sub-Boards query to. My guess would be Load.php, but I'm not a expert, so what do I know?

I would not move the Sub-Boards query to index.template.php. That just sounds like a hacking waiting to happen.

[Arantor]

If you need the board index loaded every page, this is what I personally would do to make it happen.

I'd simply include Subs-BoardIndex.php from index.php, then invoke the function to load the boards, prior to determining the action necessary (i.e. checking against actions)

To simply the workload in terms of editing, at this point I'd either simply gut BoardIndex.template.php and BoardIndex.php for my custom homepage content (ugly but workable), or create a new action for the homepage, add the relevant source and template file, then have the default action revert to that, if that makes sense. Looking at index.php will probably explain some of what I'm on about.

[ElectricSquid]

Where's that {think} smilie when I need it?

Interesting workaround (include Sub-Boards from index.php)
This would retain the actual board index page, that way if a user clicked the category in the linktree on any given message index or display index page, the actual board index would still be there to show, instead of having to somehow prevent them from clicking that category link, or redirecting them elsewhere if they did.

Thanks, that's a very easy solution indeed.

add the relevant source and template file, then have the default action revert to that

I'll have to figure that one out next.
I have TinyPortal on the "live" site which runs 1.1.10, and there is some coding in there that could guide me in how to achieve that.

Oh, I almost forgot, the version of SMF 2.0 I'm developing this board index edit to is RC1.2
It's housed on my DevBox. I originally did the Large Upgrade. That left the files for all the mods and extra stuff accumulated in the root folder from 2 years of not knowing what the hell I was doing. I wanted to start fresh, so I did a fresh install in a new root folder, and over the existing database files that were updated from the Large Upgrade.

It worked!!
The Large Upgrade updated the database, then fresh install over it retained the data.

Very nice indeed!!

[Kays]

Just a thought on this. Wouldn't it be easier to uses the jumpmenu array ($context['jump_to']) since it has all of the info required.

I just don't know if it's available when viewing the board index. But it looks like it's created with loadJumpTo() So you might be able to use it anywhere.

[ElectricSquid]

If I had half a clue how to create an SSI for this, I would go that route.

JumpTo you say?
That's an interesting idea, but I must admit, I've been in the habit of removing that from every page since it messed with my layouts (in 1.1.x) and no-one ever used it anyway, LOL

[Kays]

LOL, no wonder you want something like this.

The one problem I can see wiith using the boardIndex code is that it only shows the first level child boards. Not the child boards of a child board.

I'm a bit curious about this so let me see if I can put something together. It might take a little while since I've got a few things to do yet.

[ElectricSquid]

I don't use child boards or children of children.
(well, at least I won't be when I do the final live upgrade to 2.0)

Anyway, the board button would lead to the message index, which will show the child boards. So I don't see much problem with not having them shown on the board index or through the use of board buttons.

My content fits well enough into about 7 different boards.
Then add the "other" buttons, for a total of about 10-11 buttons.

Some features like stats, messages (inbox), recent posts, profile, search, login, register, etc can be handled in the user info area, so no navbar button is needed for them.

edit - Now that I think about it, most, if not all existing navbar links besides the [home] button can be put in the user info area, so the actual navbar would consist of [home] and the 7 board buttons.

[Kays]

Here's a couple of examples. The first just displays the board names on a line. The second as a row which is what I thought you were looking for in the first place. I did it on a test page and included SSI.php. Change to path to it if you are to do the same.

Code Select Expand

<?php

require_once('boards/SSI.php');

echo 'Hello ', $context['user']['name'], '<hr />';

loadJumpTo();

foreach($context['jump_to'] as $cat)
{
foreach($cat['boards'] as $board)
{
if($board['child_level'] == 0)
echo '<a href="', $scripturl, '?board=', $board['id'], '.0">', $board['name'], '</a> ';
}
}

echo '<hr />';

foreach($context['jump_to'] as $cat)
{
// Display each category.
echo '<div style="background-color: #CBCCE9; width:200px; padding:3px; margin: 4px 0px 4px 0px; border: 1px solid blue;"><a href="', $scripturl, '#c', $cat['id'], '">', $cat['name'], '</a></div>';

// Loop through the boards for each category
foreach($cat['boards'] as $board)
{
// This is a first level board, style it different than the categories
if($board['child_level'] == 0)
echo '<div style="background-color: #D7D5D5; width: 200px; padding:3px; margin-bottom: 2px; border: 1px solid black;"><a href="', $scripturl, '?board=', $board['id'], '.0">', $board['name'], '</a></div>';
else // These are the child boards, style them differently again
echo '<div style="background-color: #E8E6E6; width: 200px; padding:3px; margin-bottom: 2px; border: 1px dashed black;"><a href="', $scripturl, '?board=', $board['id'], '.0"> ', str_repeat('- ', $board['child_level']) , $board['name'], '</a></div>';
}
}

?>

One thing to consider when you upgrade to 2.0 The menu buttons are handled differently.

[ElectricSquid]

That code didn't work for me.
I think it might be because SMF 2.0 RC 1.2 doesn't have any JumpTo function in SSI.php at this time.

EDIT - I checked the function database [LINK] for that jumpto function and found that up to SMF 1.1.10, it was called loadjumpto() located in Load.php
SMF 2.0 has a jumpto feature, but it no longer has the word jump in it's name, at least in the function list (link above).
END EDIT



BUT... I figured out a way to make it happen.
When what you need doesn't exist, build it yourself

I'm still working on this, but I figured I would post my progress since the hard drive on this DEV BOX is old and might freeze, thus loosing my work. So here it is...
Without further ado, I proudly present to you
Function SSI_NavBar() ^beta

This modification will add a 160px column to the left side of all forum pages that will contain a site navigation menu consisting of button links to each primary board on the forum. User permissions are in effect, so guests cannot see admin boards.

Note:
Lower parts of this 160px column can be used for ads or whatever other features you'd like to put there. Kindof like the TinyPortal left side bar, just without the admin configuration interface (yet)


Warning, this mod is in early BETA
  and is being developed on SMF 2.0 RC1.2 
Use at your own risk!!


Add to SSI.php
Find

Code Select Expand



// Show boards by activity.
function ssi_topBoards




Add before

Code Select Expand




// ==============
// NAVBAR - start
// ==============

// Custom NAVBAR by ElectricSquid
function ssi_navbar($override_permissions = false, $output_method = 'echo')
{
global $context, $settings, $db_prefix, $txt, $scripturl, $user_info, $modSettings, $smcFunc;

// Find boards
$request = $smcFunc['db_query']('', '
SELECT b.name, b.id_board, b.child_level, b.description,' . (!$user_info['is_guest'] ? ' 1 AS is_read' : '
(IFNULL(lb.id_msg, 0) >= b.id_last_msg) AS is_read') . '
FROM {db_prefix}boards AS b
LEFT JOIN {db_prefix}log_boards AS lb ON (lb.id_board = b.id_board AND lb.id_member = {int:current_member})
WHERE {query_wanna_see_board}
ORDER BY b.board_order ASC',
array(
'current_member' => $user_info['id'],
'recycle_board' => (int) $modSettings['recycle_board'],
)
);
$boards = array();
while ($row = $smcFunc['db_fetch_assoc']($request))
$boards[] = array(
'id' => $row['id_board'],
'name' => $row['name'],
'child_level' => $row['child_level'],
                  'description' => $row['description'],
'new' => empty($row['is_read']),
'href' => $scripturl . '?board=' . $row['id_board'] . '.0',
'link' => '<a href="' . $scripturl . '?board=' . $row['id_board'] . '.0">' . $row['name'] . '</a>'
);
$smcFunc['db_free_result']($request);

// If we shouldn't output or have nothing to output, just jump out.
if ($output_method != 'echo' || empty($boards))
return $boards;

echo '
<table class="navbar">';

foreach ($boards as $board)
     

            if($board['child_level'] == 0)
echo '
<tr>
<td>', $board['link'], $board['new'] ? ' <a href="' . $board['href'] . '"><img src="' . $settings['lang_images_url'] . '/new.gif" alt="' . $txt['new'] . '" border="0" /></a>' : '', '</td>
</tr>';
     

echo '
</table>';
}


// ============
// NAVBAR - end
// ============








Add to index.template.php
Find

Code Select Expand



// The main content should go here.
echo '
<div id="bodyarea">';
}




Replace with

Code Select Expand



// The main content should go here.
echo '
<div id="bodyarea">';

// ======================================
// lets build the left side navbar column
// we need to start with an outer table
// and do the navbar in the left td
// and the rest of the forum in the right td
// ======================================

echo '<table id="bodyarea_table">
  <tr>
  <td id="bodyarea_left" valign="top">';

// =============================
// Heres where the magic happens


require_once('SSI.php');

ssi_navbar();


// Heres where the magic ends
// ===========================

echo '
  </td>
  <td id="bodyarea_right" valign="top">';
}





Find

Code Select Expand



function template_body_below()
{
global $context, $settings, $options, $scripturl, $txt;

echo '
</div>';



Replace with

Code Select Expand



function template_body_below()
{
global $context, $settings, $options, $scripturl, $txt;

echo '

  </td>
</tr>
</table>
</div>';





Themes\default\css\index.css
Find

Code Select Expand



/* the main content area */
#bodyarea
{
}



Replace with

Code Select Expand



/* the main content area */
#bodyarea
{
}

/* the added table to form the navbar left and forum right tds */
#bodyarea_table
{
}

/* the left outer td containing the navbar */
#bodyarea_left
{
width:160px;
}

/* the right outer td containing the normal forum stuff */
#bodyarea_right
{
}



[ElectricSquid]

The above code has just been updated to exclude child boards (since they'll be reachable through the parent board that has it's link on the NavBar)
I also added valign="top" to the main content table cell (the right td).

Next on the list...

• create the actual button image
• add it's code
• use the board description as it's alt tag
• create links and/or extra buttons for [home] [admin] [login], etc
• test, a lot
• delete the existing default navbar tabs

Any suggestions on how I can make this code better?
Post up

I'd like to hear what you think.

[ElectricSquid]

Just updated the above code again...

Eliminated a minor error (8: Undefined index: new)
and made the "NEW" images show up again.

I plan to do something a little neater with the "new" feature when I get the button images coded up. Maybe something like a small red dot on the button to show there are new posts in that board, or possibly something through CSS if I can figure out how to get it to work that way.

[ElectricSquid]

Here's a screenshot of progress so far, so you can get an idea of the direction I'm going with this function.

[Arantor]

Looks good

Anything you would like support on?

[ElectricSquid]

Looks good

Anything you would like support on?

Actually, yes.
The SSI_navbar is working well, but I do need to create a custom homepage to replace the board_index page. Here's where I'm a bit lost when it comes to the template system that creates a page in SMF.

My basic question is what templates/sub-templates are involved in creating a page, and in what order?
My complicated question is just like the above, but I need to know what code is involved in each template, in what order, and why?

Any info, or link to info on this subject would be very helpful.
Especially since I need to build more pages than a home page.
I know pages can be built off to the side of SMF, and SSI can handle a lot of the forum add-ons on these non-SMF pages. But I would like to learn the more complicated way of building custom pages within the SMF coding, in order to take full advantage of the existing SMF template system.

[Arantor]

The order involved depends on what you're doing and where. You may find it simpler to just not use SMF's template quite so much for the home page.

OK, quick run through.

index.php
-> loads dependencies, e.g. general loader, permissions, etc etc
-> identifies action in the action= parameter and that provides a callback in smf_main()

Defaults to 'BoardIndex' in the event of nothing.
-> loads the Sources/ file and calls the function specified.

Then index.template.php is called, with template_header() and template_main_above().

Then the main page content loads, driven by the relevant Sources file, then template_main_below and template_footer from index.template.php.

As for sub templates,  it really, really depends on the page you're on inside SMF.

[ElectricSquid]

So index.php is where the action= is defined.
But what do you mean when you say "provides a callback in smf_main()"?

[ElectricSquid]

Thanks Arantor for helping me out and getting me started.
I have a ton of questions which I was sure were covered on this site somewhere.
I finally found the extensive documentation on SMF that answers a lot of those questions.

From what I can tell, you are correct, SSI is the best way to go when it comes to coding in custom pages, and a lot of thought and work went into making it possible (and fairly easy) to code pages that use the SMF core features like the permission system.

The permission system is the MAIN reason I was considering adding my pages directly to the SMF core, but after reviewing the info in the DOC section of this site, I found that this need had been provided for already with the use of SSI.

Because I like to make it easy on myself, and anyone following my footsteps, here is the linktree from the DOC section that pertains to what I am talking about.

SMF Online Manual > Into the Depths of SMF > Information on Developing Mods and Themes  > Modifications and Understanding SMF's source > Coding with SMF

• How to use the SMF user system outside of SMF
• How to Check Permissions
• Using SMF language system in your mods
• Site Intergration - Boards
• Adding custom permissions

You will also need to review Using SSI.php
Another useful bit of info is the Function Database
(which is god-awful to locate, so there is the direct link for you)