myspace custom content above blurbs (about me)

This solution addresses the following:
- Putting custom Content above the blurb (about me) area
- Hiding the "about me" header without hiding the "to meet" header (or the opposite)
- Different color borders around "about me" and "to meet" areas

When combined with hiding the blog area; This becomes an alternative solution to such things as:
- Replacing Blog area with Text
- Replacing Blog area with anything containing a Link
- Replacing Blog area with a Video
And if the blog area has been replaced with static sized content (or removed); we can hide the extended network area, and this becomes an alternative solution to such things as:
- Replacing extended network area with Text
- Replacing extended area with anything containing a Link
- Replacing extended area with a Video
[note:If you are keeping your blogs, in their default location, and you want to put something above them, this is NOT the best strategy to use. In this case I recommend absolute placement measuring down from the top of the page. Getting right-left alignment correct across multiple platforms is difficult, but it is more accurate than trying to use relative movement over the blog area.]

I recommend this for ANY use of the blog area, other than either the actual blogs or a simple picture (which can be set as a background). For all other uses, I highly recommend just removing the area and using this strategy to put something else in the location. This is the best strategy to insure that your left/right (horizontal) alignment lines up with the blurbs table.

IF the blogs are removed (or replaced) I then recommend this strategy for ALL extended network replacements except a simple background picture or a video slider.

This strategy is more reliable than any strategy involving relative or absolute placement to attempt to place something where the blogs and/or extended network boxes reside. [Unless you are keeping your blogs, see above note.]

To create a custom space above the Blurbs/About me:
1) Insert Code at the very top of the section to close off a few layers of tables, so that you are at the point the blurb table is created.
2) Create Your custom Table with its own class
3) Re-open the Blurbs table and give it a unique custom class.
4) Re-Create the blurbs header and give it a unique custom class.
5) Re-open the table which contains the about me and meet cells. Give it a unique custom class.
6) Re-Open the about me cell, give it a unique custom class. This will also allow us to address it independently of the "To Meet" cell, without adding more additional code either at the end of the "about me" or the top of the "to meet"
7) HIDE the residue from the original blurbs/about me area.

In addition if we want to replace the blogs
8) Remove the blog and the Space it occupied
In addition if we want to replace the extended network
9) Remove the Extended Network and the Space it occupied.

Place this code at the TOP of your about me section:

<style>
{!-eliminate residue blurb headers!-}
.blurbs {display:none}
{!-Use below line ONLY if you want to eliminate Blog area-!}
.latestBlogEntry {display:none;}
{!-Use below line ONLY if you want to eliminate Extended Network area-!}
.extendedNetwork {display:none;}

{!-If we removed blogs and extended network we still have space due to carriage returns.  We move up our custom table to take care of this.  If we set the BR line-height we can control how much space it is. -!}
br {line-height:10px;}
.myT1 {position:relative; top:-20px; margin-bottom:-20px; }

</style>

</td></tr></table>
</td></tr></table>
<span class="off">Create Custom Table</span>
<table class="myT1" style="width:435px;">
<tr><td>My Own Content In My Table 1</td></tr>
</table>
<span class="off">END Create Custom Table</span>
<br>
<span class="off">Create Custom Table 2</span>
<table class="myT2" style="width:435px;">
<tr><td>My Own Content In My Table 2</td></tr>
</table>
<span class="off">END Create Custom Table 2</span>
<br>
<span class="off">Re-Open Blurbs Table give it our own Class </span>
<table class="myBlurbs" style="width:435px;"><tr>
<td class="myBlurbHead" valign="center" align="left" width="435" bgcolor="ffcc99" height="17">  &nbsp;&nbsp;&nbsp;<span class="orangetext15"> My Blurbs
</span>  </td></tr>
<td>
<table class="myBlurbsInner" ><tr><td class="myAboutMe" >
<span class="orangetext15">  About me:
</span><br>
<span class="off">YOUR about me Content goes Below</span>

The code will give us this Structure (without all the borders, those are there for demonstration purposes. You can add your own borders if you like).

Element to Address	How To Address	diagram
1)custom table 1	table.myT1	pink solid
2)custom table 2	table.myT2	orange solid
3)Blurbs Section	table.myBlurbs	black solid
4)Blurb Header	table.myBlurbs td.myBlurbHead	blue dashed
5)About Me Section	table.myBlurbs td.myAboutMe	green dashed
6)About Me Header	table.myBlurbs td.myAboutMe .orangetext15	green dashed
7)Meet Section	table.myBlurbs table td [must undo effect on (5)]	light green dashed
8)Meet Header	table.myBlurbs table td .orangetext15 [must Undo effect on (6) above]	light green dashed

Not only have we structured the code so that we can put our own tables above the blurbs, and have them line up correctly; we have created additional levels of classification in the blurbs area. More elements can now be addressed independently for hiding or other styling.

Here is a page which has utilized the above to achieve maximum classification of this area:
MySpace Page Using Above Code with Additional Style Added

The below Code block will place a Video in Place of the Extended Network and Blogs.
Place this code block at the TOP of the about me (before any other code or content).
Replace the video with your own video.

<span class="off"><a href="http://spiff-myspace.blogspot.com/">MySpace Hints and Codes</a></span>
<style>
{!-eliminate residue blurb headers!-}
.blurbs {display:none}
{!-Use below line ONLY if you want to eliminate Blog area-!}
.latestBlogEntry {display:none;}
{!-Use below line ONLY if you want to eliminate Extended Network area-!}
.extendedNetwork {display:none;}

{!-If we removed blogs and extended network we still have space due to carriage returns.  We move up our custom table to take care of this.  If we set the BR line-height we can control how much space it is. -!}
br {line-height:10px;}
.myT1 {position:relative; top:-20px; margin-bottom:-20px; }

</style>

</td></tr></table>
</td></tr></table>

<span class="off">Create Custom Table</span>
<table class="myT1" style="width:435px;height:auto; border:2px hotpink solid;">
<tr><td>

<span class="off">!-REPLACE BELOW BLOCK WITH CODE FOR YOUR VIDEO</span>
<object type="application/x-shockwave-flash" allowScriptAccess="never" allowNetworking="internal" height="350" width="435" data="http://www.dailymotion.com/swf/2Vfh94CKBjTl1YAa">
  <param name="allowScriptAccess" value="never" />
  <param name="allowNetworking" value="internal" />
  <param name="movie" value="http://www.dailymotion.com/swf/2Vfh94CKBjTl1YAa" />
</object>
<span class="off">!^^END OF VIDEO BLOCK^^!</span>

</td></tr>
</table>
<span class="off">END Create Custom Table</span>
<br>

<span class="off">Re-Open Blurbs Table give it our own Class </span>
<table class="myBlurbs" style="width:435px;"><tr>
<td class="myBlurbHead" valign="center" align="left" width="435" bgcolor="ffcc99" height="17">  &nbsp;&nbsp;&nbsp;<span class="orangetext15"> My Blurbs
</span>  </td></tr>
<td>
<table class="myBlurbsInner" ><tr><td class="myAboutMe" >
<span class="orangetext15">  About me:
</span><br>
<span class="off">YOUR about me Content goes Below</span>

If you need help determining the code to use, for the video you want to use, see Video Posting Guide MySpace and Blogger