Recent Topics
  1. b2evolution CMS Support Forums
  2. b2evolution Support
  3. Templates, skins, XHTML and CSS
  4. [2.x] Skinning V2, adding sidebar

[2.x] Skinning V2, adding sidebar

1 Aug 19, 2008 19:08    

My b2evolution Version: v 2.4.2

I upgraded to version 2. In my backend under widgets I had sidebar [NOT INCLUDED IN SELECTED SKIN!] which contained several widgets I used in my old blog version. Therefore, I decided to add the container for this sidebar. I created _sidebar.inc.php with the following code.


<?php
/**
 * This is the sidebar include template.
 *
 * For a quick explanation of b2evo 2.0 skins, please start here:
 * {@link http://manual.b2evolution.net/Skins_2.0}
 *
 * This is meant to be included in a page template.
 *
  */
if( !defined('EVO_MAIN_INIT') ) die( 'Please, do not access this page directly.' );

?>

				<!-- Start of Sidebar -->
				<div class="sidebar_left">
					<div class="bSideItem">
						<?php
							// ------------------------- "Sidebar" CONTAINER EMBEDDED HERE --------------------------
							// Display container contents:
							skin_container( NT_('Sidebar'), array(
// The following (optional) params will be used as defaults for widgets included in this container:
// This will enclose each widget in a block:
'block_start' => '<div class="evo_side_item $wi_class$">',
'block_end' => '</div>',
// This will enclose the title of each widget:
'block_title_start' => '<h3>',
'block_title_end' => '</h3>',
// If a widget displays a list, this will enclose that list:
'list_start' => '<ul>',
'list_end' => '</ul>',
// This will enclose each item in a list:
'item_start' => '<li>',
'item_end' => '</li>',
// This will enclose sub-lists in a list:
'group_start' => '<ul>',
'group_end' => '</ul>',
) );
							// ----------------------------- END OF "Sidebar" CONTAINER -----------------------------
						?>
						</div>
						</div>
						<div style="clear: both;">&nbsp;</div>

In index.main.php and single.main.php and in page.main.php I added the following code:


	
	<?php
	// ------------------------- Sidebar INCLUDED HERE --------------------------
	skin_include( '_sidebar.inc.php' );
	// Note: Normal practice, sidebars are on a separate file
	// for easy managing the sidebar areas.
	// ----------------------------- END OF sidebar -----------------------------
	?>

I went into the back end and reloaded the containers. the [NOT INCLUDED IN SELECTED SKIN!] was removed, so the container is recognised by the backend.

in my CSS I have the following:


/* Left sidebar */
.sidebar_left 
{
  width: 23ex;
   float: left;
   overflow: hidden;
   margin-left: 3ex;
}

The container does not show up on my website. I am completely new to writing skins for version 2 and would appreciate some help with understanding why my code is not working.

Thanks in advance,
Kimberly.

Back to top

2 Aug 19, 2008 19:10

I selected version 2.x from the drop down list, but it put My b2evolution Version: 1.10.x My b2evolution Version is the latest version, b2evo v 2.4.2

Back to top

3 Aug 19, 2008 19:26

a slight chance, you only previewed in home page, and not other pages ?
cause in addition to 'index.main.php and single.main.php and in page.main.php' sidebar must be included in 'posts.main.php' too

Back to top

4 Aug 21, 2008 03:15

Have a look at the HOWTO I wrote some time ago: [url=http://forums.b2evolution.net/viewtopic.php?t=14515]HOWTO edit / copy / add containers to skins
[/url]. It is based on an example with the Asevo skin but I tried to write it as 'general' as I could.

I would like to add to tilqicoms reply that using the _posts.main.php file is only needed if you start with the 'basic' skin and derivatives. Other skins are managed through _index.main.php. If your container (Sidebar) is recognized you are fine with editing the _index.main.php file.

That leaves the CSS as cause for your Sidebar not showing. Have a look at the article I mentioned and return to this topic with subsequent questions.

Good luck

Back to top

5 Aug 21, 2008 04:41

tilqicom wrote:

a slight chance, you only previewed in home page, and not other pages ?
cause in addition to 'index.main.php and single.main.php and in page.main.php' sidebar must be included in 'posts.main.php' too

OK, I added the code to posts.main.php and it is now showing in my blog, so I guess that was the error. First, I have read the Docs, but I am having a bit of trouble fully understanding the new skins thingy. What is the purpose for each, index.main.php, single.main.php, page.main.php and posts.main.php? Why does a container have to be included in each of these to write a skin?

Kimberly.

Back to top

6 Aug 21, 2008 04:48

Afwas wrote:

Have a look at the HOWTO I wrote some time ago: [url=http://forums.b2evolution.net/viewtopic.php?t=14515]HOWTO edit / copy / add containers to skins
[/url]. It is based on an example with the Asevo skin but I tried to write it as 'general' as I could.

I would like to add to tilqicoms reply that using the _posts.main.php file is only needed if you start with the 'basic' skin and derivatives. Other skins are managed through _index.main.php. If your container (Sidebar) is recognized you are fine with editing the _index.main.php file.

That leaves the CSS as cause for your Sidebar not showing. Have a look at the article I mentioned and return to this topic with subsequent questions.

Good luck

Thanks. I did read your article, but it appeared to me you were hard-coding your container in the _index.main.php instead of doing an include. For flexibility, I thought the container was suppose to be external and included in the _index.main.php file.

So, why did I need to include my container in _posts.main.php? Why so many files where we have to insert the same container?

Oh, to learn I started with a skin that I downloaded that was close to what I wanted since I can not really follow the Docs on skinning. I tried to do a google on b2evloution v2 skinning tutorial without any luck. Are there some good tuts on learning how to skin v2? Eventually I would like to learn how to write a skin from start.

Back to top

7 Aug 21, 2008 05:35

The different files are for different views. Single is for single mode post view when you click a post you go to that view. That was just an example.
There are other skins you can start with that have only one file to manage. I think it's a better place to start.
Include a file with the sidebar code is the same as putting the code at that place. It's simply a preference. You may like to master a huge single file or you like to work with several smaller files.

At the moment there isn't such a thing as a good tutorial on skins. You can visit the Docs that have several articles somewhat shattered around. I plan a tutorial, but that will take at least a month and probably longer to do.

Good luck

Back to top

8 Aug 21, 2008 15:56

I understand. Thanks so much everyone for your help.

I look forward to your tutorial, I can imagine that it will take some time to compile. It is nice when a community comes together to help each other without thinking about compensation.

-Kimberly.

Back to top


Form is loading...