myspace 2.0 adding a custom section

Adding a Custom Section (Div) to myspace 2.0

The cleanest way to do this is to create an App, for your section. However, since this takes more skill then the average myspace user has, I will skip this method and present another method.

This is not that different from how it was done in myspace 1.0, conceptually it is very much the same, and in many ways easier.

First create your desired section inside either your interests OR blurbs section.
Do not add any style into this section, just html (and no inline style inside the tags).

Your open and close tags must map up (this is a new edit rule introduced with myspace 2.0).

First I create my custom Div in my Blurbs (or Interests) section

<i class=i>START CODE to to create custom div
Code Author:Eileen; for terms of use see page:
<a href="http://xiii.us/v/">MySpace 2.0 Code by Eileen</a>
<a href="http://xiii.us/eGen/mpSkin.php"> Music Player Skins</a>
</i> 
<div class="myidiv1">

Custom Div Content Here

</div>
<i class=i>END Custom Div</i> 

I place this code at the end of my meet. This code could go anywhere in my blurbs.
If you save at this point, my links and comments will show. We will hide those in our next step.

Next we add in the needed style to style and position our custom div
This code must go into the css area, in the customize profile section.

{! style to position custom div myidiv1 !}
.i {display:none;}
{! change the 400 to the height of your div !}
div.column1 {position:relative; 
padding-top:400px;}
div.myidiv1 {position:absolute; 
top:0px; left:0px; 
height:400px; width:100%;
font-size:13px; 
color:magenta;
font-weight:bold;
font-family:comic sans ms;}
{! alter above style values as desired !}
{! end style for div myidiv1 !}

Of course you can alter the values as desired.
You may also have elements within your div that need style. That style will also go into this section.

If you wanted to put this section at the bottom of the right column, you could instead use this style block:

{! style to position custom div myidiv1 !}
.i {display:none;}
{! change the 400 to the height of your div !}
div.column1 {position:relative; 
padding-bottom:400px;}
div.myidiv1 {position:absolute; 
bottom:0px; left:0px; 
height:400px; width:100%;
font-size:13px; 
color:magenta;
font-weight:bold;
font-family:comic sans ms;}
{! alter above style values as desired !}
{! end style for div myidiv1 !}

If I wanted to put the section between two other sections, within the right column it is slightly more complicated, unless you want the section directly above or under the blurbs. In this case you could isolate the outer most div of the blurbs, and use that as your positioning reference.

When deciding where to put the code for your custom div; if possible, choose a section which is in the same column as the area where you want to place this custom section.

If you are going to place the section somewhere other, then the top or bottom of the same column as the interests or blurbs; accurate positioning is tricky (and subject to easily breaking).

My example will assume that we want to place the content in the same column as my blurbs.

I am using the layout that has two columns.
The right column is in class column1 (it has other class names as well, but column1 addresses it uniquely.)
If you are not using the same layout, your column may have a different class.

I may add more examples later, you can request a specific scenario if you want.