Recent Topics
  1. b2evolution CMS Support Forums
  2. b2evolution Support
  3. Templates, skins, XHTML and CSS
  4. Need help adding a sidebar ...

Need help adding a sidebar ...

1 Aug 23, 2005 20:37    

Greetings, I'd like to add a new SideBar to the left, which will contain my bloglist (containing 46 weblogs), using the crystalglass skin.

Spent some time on this, also searched the forums to no avail, so once again Im resorting on the good will of b2evo's users to help me in this task. Everytime I tried adding a new sidebar I have broken my skin, so any pointers would be very welcome.

Back to top

3 Aug 23, 2005 22:42

I should be more precise.

Here's the modification I have made to my crystalglass/_main.php file



<meta name="generator" content="b2evolution <?php echo $b2_version ?>" /> <!-- Please leave this for stats -->
<link rel="alternate" type="text/xml" title="RDF" href="<?php $Blog->disp( 'rdf_url', 'raw' ) ?>" />
<link rel="alternate" type="text/xml" title="RSS .92" href="<?php $Blog->disp( 'rss_url', 'raw' ) ?>" />
<link rel="alternate" type="text/xml" title="RSS 2.0" href="<?php $Blog->disp( 'rss2_url', 'raw' ) ?>" />
<link rel="alternate" type="application/atom+xml" title="Atom" href="<?php $Blog->disp( 'atom_url', 'raw' ) ?>" />
<link rel="pingback" href="<?php $Blog->disp( 'pingback_url', 'raw' ) ?>" />
<link rel="stylesheet" type="text/css" media="print" href="print.css" />
<link rel="stylesheet" href="crystalglass.css" type="text/css" />
</head>
<body>

<!-- START OF LEFT SIDEBAR, HERE'S THE CODE I ADDED -->

<?php if( $disp != 'single' ) { ?>
<div id="bSideBar2" align="center">

<?php // BlogListL for aligned left, BlogListC for aligned center, BlogListR for aligned right ?>
<div id="BlogListL" class="bSideItem">
<?php require( dirname(__FILE__).'/_bloglist.php' ); ?>
</div>

<?php	} ?>

<hr />

<!-- END OF LEFT SIDEBAR, HERE'S THE END OF MY ADDED CODE -->


<?php if( $disp != 'single' ) {
	echo '<div id="wrapper">';
	} else {
	echo '<div id="wrapperWide">';
	} ?>

<div id="header">
	<h1><a href="<?php $Blog->disp( 'blogurl', 'raw' ) ?>" title="<?php $Blog->disp( 'longdesc', 'htmlbody' ); ?>"><?php $Blog->disp( 'name', 'htmlbody' ) ?></a></h1>
	<div class="description"><?php $Blog->disp( 'tagline', 'htmlbody' ) ?></div>
</div>

<hr />

<?php if( $disp != 'single' ) {
	echo '<div id="bPosts">';
	} else {
	echo '<div id="bPostsWide">';
	} ?>

<h2 class="pagetitle"><?php
	single_cat_title();
	single_month_title();
	single_post_title();
	arcdir_title();
	last_comments_title();
	stats_title();
	profile_title();
?></h2>

Now there's only one slight problem ... everything is aligned to the left but I'd want everything aligned in the center. I thought using <div id="bSideBar2" align="center"> would do it right but its the same as when I use <div id="bSideBar2" align="left">.

Here's what I changed in my crystalglass.css



/*I have addes this bit of code under the section for #bSideBar*/

#bSideBar2 {
margin-center : 535px;
padding : 20px 0 10px 0;
width : 760px;
font-size : 1em;
font-family : 'Lucida Grande', Verdana, Arial, sans-serif;
}

/*I added this line: line-height: 1.8em; */

ul#bloglist li {
background-color : #2B4A8A;
border : 1px solid #000;
display : inline;
padding : .5ex 1em;
line-height: 1.8em;
}

/*I changed the margin in this part*/

#BlogListL, #BlogListC, #BlogListR {
margin : -1.1em 32px 0 32px;
border : 0px solid #000;
padding : 0;
}

Anyone has any idea whats going wrong with the alignment ?

PS: I realise the way I coded it I didnt really add a "sidebar" ... its more like a header but I'm happy with it this way.

Back to top

4 Aug 23, 2005 22:46

If you want me to help you debug your css, you're going to have to give a link to your blog. I wish I were good enough to take one look at the code and tell you what to change, but I'm not. I'll have to take a look at the site and use Firefox Web Dev Toolbar to tweak it until it works.

Back to top

5 Aug 23, 2005 22:50

Wow I sure took a long time to write the last post, didn't think someone would reply so quickly ... thanks personman ! The support is so good in this community I'll have to donate sometime (I'm not the kind of person to tease with money, I swear on my honor that once I got a paypal account, ie when I have more cash, I will donate to this deserving group of altruist people). You guys deserve the praises ... and the money.

On another note, I finally found out my alignment problem doesnt come from my code, I was using Firefox to test the success of the operation, that was the problem.

When I looked at my site using Internet Explorer, the alignment was all good

Back to top

6 Aug 23, 2005 23:01

catar4 wrote:

... I finally found out my alignment problem doesnt come from my code, I was using Firefox to test the success of the operation, that was the problem.

When I looked at my site using Internet Explorer, the alignment was all good

If that's the case then your code and css are bad. If it doesn't work for all your visitors figure it's broken. Test with multiple browsers, and check your validation (both xhtml and css). Validating both will tell you that your code is properly written, and testing in a couple of browsers will tell you that most visitors will be able to see the page the way you want them to.

Back to top

8 Aug 30, 2005 21:01

My CSS is valid except for the rsc/basic.css and rsc/forms.css files who apparently can't be found, but maybe that's due to my blogs being hosted on intranet so the validator couldn't find the files.

I can't valid XHTML for the same reason, since b2evo is hosted on our intranet the validator can't access the files. I cant give personman a link, can't validate my XHTML and I'm not sure CSS validation is done correctly.

But maybe you guys would have a web site where I could read more about FireFox and CSS ? Don't do a search for this but if you have a well known site about CSS/Firefox in your bookmarks I'd take a look at it.

Back to top


Form is loading...