If we fail to anticipate the unforeseen or expect the unexpected in a universe of infinite possibilities, we may find ourselves at the mercy of anyone or anything that cannot be programmed, categorized or easily referenced.

March 21, 2008

Adding Fourth Column in *EboNeo *Template


Hi, i just wonder whether you can help me modify your script so i can have a 4 columns neo instead of 3 columns ?? I'm still trying to modify the script but still not working.

Thanks

I figured responding to this via comments was going to be too long so i decided to make it a post.

First of all you need to define the properties of the new column:

First give the new column a unique name here I have called it xtrasidebar

#xtrasidebar-wrapper {
width: 100px;
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
margin-right: 10px;
}

Next you have to decide how wide (width) it should be, always note, with regards to width:

outer-wrapper
= main-wrapper + sidebar-wrapper + newsidebar-wrapper + extrasidebar-wrapper

So what ever you decide this equation should balance. Most likely the space for the new column will come of the main column space as it has the larger real estate

Place the above code just below :

#newsidebar-wrapper {
width: 220px;
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
margin-right: 10px;
}


After this you need to set up the template id for the extra/ new/ fourth column

insert this code. This code will contain the widgets for the new column. It is initially blank. You can cut and paste widgets from other columns and insert them blank space or you can move them more easily via page element function.

<div id='xtrasidebar-wrapper'>
<b:section class='sidebar' id='xtrasidebar' preferred='yes'>

</b:section>
</div>


Change the names appropriately and then save the template.

Go to your page element and you will find a new column as you defined.


No comments yet