What you're talking about is already built into b2evolution. It's called bloglists. You define in the backoffice whethere a blog should be shown on the bloglist and whether the blog should display the bloglist. It looks like the leaf skin has this built in. Maybe one of your customizations broke it.

When I first unzipped the 'leaf' skin it had the bloglist, centered, at the very top of the screen, sort of like this:

| Blog A | Blog B | Blog C

Then, inside the header area were a series of tabs, each of which had a null pointer in them by default (i.e. href=#).

Indeed, if you look at the skins gallery, you'll see what I'm referring to:
http://skins.b2evolution.net/a.php?skin=leaf

And this is what I've done with my own blog:
http://blog.thedarksighed.com/main?skin=leaf
(I commented out the bloglist at the top, and hardcoded the href=# in each of the tabs to point to href=stubfile.)

So I don't think it's any of the customizations I did.. The leaf skin uses a different css class for each of the tabs (i.e. class=tab1 class=tab2). That's where the problem arises, because by default the bloglist is a programmatically generated unordered list and isn't directly translatable for use with the tabs...

Ok, I see what you're saying now. If you had given a link in your first post I might have understood sooner. Yes, I think this can be done. I'll see what I can come up with.

Open bloglist.php and add the red bits :-

if( $curr_blog_ID == $blog )
	{ // This is the blog being displayed on this page:
		echo '<a href="';
		blog_list_iteminfo('blogurl', 'raw');
		echo '" class="', $blog_selected_link_class, ' blog',$curr_blog_ID,'" title="';
		blog_list_iteminfo($blog_title_param, 'htmlattr');
		echo '">';
		echo $blog_selected_name_before;
		blog_list_iteminfo($blog_name_param, 'htmlbody');
		echo $blog_selected_name_after;
		echo '</a>';
	}
	else
	{ // This is another blog:
		echo '<a href="';
		blog_list_iteminfo('blogurl', 'raw');
		echo '" class="', $blog_other_link_class, ' blog',$curr_blog_ID,'" title="';
		blog_list_iteminfo($blog_title_param, 'htmlattr');
		echo '">';
		echo $blog_other_name_before;
		blog_list_iteminfo($blog_name_param, 'htmlbody');
		echo $blog_other_name_after;
		echo '</a>';
	} // End of testing which blog is being displayed

Now each button will have class blog# where # is the blog id

¥

Does that do what you want, jibberjab? The main problem I'm seeing is that if you created a blog with id 5 and set it to not be displayed in the bloglist, then created a blog with id 6 and set it to be displayed, you would have an empty tab. My solution was going to be to edit the _bloglist.php file so that as it loops through the links to be displayed, it just increments a variable something like this:
$x = 1
while (looping through links) {
<a href='the url' class="nav$x">blah blah</a>
$x++
}

This would mean some serious digging around in the php. It might be easier to just rewrite the css so that it doesn't absolutely position each tab. Then you can just use class="nav" for each li in the bloglist.

You wouldn't have an empty tag, you'd have a missing number in the class id's because none of the html associated with that blog tab would be output.

The end result would be, every time you added a blog you'd have to add class blog# where # = new blogs id, and then do the rest of your css stuff for that tab. If you deleted a blog, you'd have to amend all blogs with id > deleted blog to amend their positions.

¥

Agreed. And if you didn't edit the CSS, then you'd have a gab where the undisplayed blog's tab would have been. What about you, YaBBa, do you think it would be easier to just rework the CSS so no more editing would be required?

I haven't had a chance to test out those code bits yet, but will hopefully be able to do so this evening.

I agree, the easiest way to do this may be to remove the number from the class=tab# and use css to position the list horizontally. If I have a chance to work on that tonight also, I will. I'm very comfortable with css but not very much so with php. I'm not looking at the code at the moment, but I seem to remember the css styles for the "active" tab might also pose a problem if the class=tab# is removed. I'll have to check into that when I have a chance.

Thanks for the input, and if anyone sees any other possibilities/options, please feel free to post them here.

jj.

I'm off out so I haven't had time to think about this properly, and the following is untested, but.

at the top of bloglist.php put
$myButtonCount=0;

then, everywhere I've put $curr_blog_ID in the above code, replace it with $myButtonCount++ and you should always end up with incrementing numbers with no gaps.

When I get chance I'll take a look at the css for the skin because I'm fairly sure you can do this a better way with pure css.

¥

The active tab won't be a problem. _bloglist.php lets you set what code you want to display before the active blog in the bloglist.

Ok, this will give you almost the same button effect without id#, replace this section of your css :-

/*THIS PART IS FOR THE NAVIGATION LINKS*/
.nav1 a:link, .nav1 a:visited, .nav2 a:link, .nav2 a:visited, .nav3 a:link, .nav3 a:visited, .nav4 a:link, .nav4 a:visited, .nav5 a:link, .nav5 a:visited{
	color: #4E4E4E;
	width: 80px;
	height: 20px;
	line-height: 20px;
	background: url(images/01_linkbg2.gif) top repeat-y;
/*	padding: 0;	*/
	padding-right: 4px;
	padding-left: 4px;
}
.nav1 a:link, .nav1 a:visited{
	position: absolute;
	top: 2px;
	left: 14px;
}
.nav2 a:link, .nav2 a:visited{
	position: absolute;
	top: 2px;
	left: 96px;
}
.nav3 a:link, .nav3 a:visited{
	position: absolute;
	top: 2px;
	left: 178px;
}
.nav4 a:link, .nav4 a:visited{
	position: absolute;
	top: 2px;
	left: 260px;
}
.nav5 a:link, .nav5 a:visited{
	position: absolute;
	top: 2px;
	left: 342px;
}
/*HOVER EFFECTS*/
.nav1 a:hover, .nav1 a:active, .nav2 a:hover, .nav2 a:active, .nav3 a:hover, .nav3 a:active, .nav4 a:hover, .nav4 a:active, .nav5 a:hover, .nav5 a:active{
	background: url(images/01_linkbg1.gif) top repeat-y;
	margin: 1px 0 0 0;
}

with this :-

/*THIS PART IS FOR THE NAVIGATION LINKS*/
#navigation li a{
	color: #4E4E4E;
	width: 80px;
	height: 20px;
	line-height: 20px;
	background: url(images/01_linkbg2.gif) top repeat-y;
/*	padding: 0;	*/
	padding-right: 4px;
	padding-left: 4px;
   float:left;
}

/*HOVER EFFECTS*/
#navigation a:hover,#navigation a:active{
	background: url(images/01_linkbg1.gif) top repeat-y;
	margin: 1px 0 0 0;
}

¥