PLEASE do NOT strip my credits out of your code. They are harmless. Unlike most sites, My credits do NOT show up on your visible page, there is no reason to remove them. If you make a derivative of my work, you may add your own credits, but leave mine in tact.

I apologize for being less attentive to people's questions than in the past. I hope to return to doing this at some time. But for now I need to think about what I want to do. This doesn't mean I am completely ignoring all questions, if I suspect there might be a bug in my code, or myspace has made some change effecting it, I will still dig in and research.

Tuesday, April 03, 2007

myspace center single column profile

Center Profile Into One Single Column

This is the only source I know of, which offers solutions for a one column profile, which does NOT require that one hide a significant chunk of the default myspace page.
I have a few different solutions.
The one which works best for you, depends on what content you want to keep.

Before writing my own solutions, I played with multiple strategies, and evaluated each one for its strengths and weaknesses.
Choosing a MySpace Profile Centering Strategy

Strategy 1) Place Code in the Networking Box.
This effects fewer page elements than strategies 2 or 3
[This was my favorite, however I removed this strategy due to the lack of consistency in myspace, related to converting code entered in this space.]

Strategy 2) Place Code in Heroes Section
[This concept exists in cyberspace already. However after testing the various solutions available, to see if I would just point to an existing solution instead of writing one, I realized that the exiting solutions all had major flaws. I tested each one on a profile with no other customizations. This doesn't mean there is not a better solution out there, but I did not find one. ]

Conceptually, this is the same as Strategy 1, however it requires that a lot more content be placed absolutely within our div (or rendered display:none).

It is the best solution if you do NOT want to display any of the following:
groups
details (or if you have custom details)
schools
companies
networking
However it DOES work even if you want to display some or all of the above. In this case you want to use the 2nd Example, where I return these items to the profile.

Example 1 (using Strategy 2).
Place the below code block at the END of either the Heroes OR the last field, in the interests, where you have data.
<i class=i><a href="http://www.msplinks.com/MDFodHRwOi8veGlpaS51cy9tcy9jZW50ZXItc2luZ2xlLWNvbHVtbg==">
Center Profile into Single Column MySpace Code
Author:Eileen</i>
<i class=i>!- START code BLOCK 1 make page one centered column-!</i>

<i class="off">!-Close tables out to level 1-!</i>
</td></tr></table>
</td></tr></table>
</td></tr></table>

<i class="off">!-Create a Div to be used to more accurately position the stuff below this point, that we want to display-!</i>
<div class="myDleftBottom" style="position:relative; top:-20px; left:0px; right:0px;" >

<i class="off">!-Open same number of tables we closed-!</i>
<table><tr><td>
<table class="off"><tr><td>
<table><tr><td>

<style>
.i {display:none;}
{!-remove clear gifs to improve centering-!}
table img {display:none;}
td {width:auto}
table table table img {display:block;}
table table table.profileInfo img {display:inline;}
table table table.profileInfo td.text img {display:block;}

{!-Positioning and display of all left side elements which were below the Interests section-!}

{!-If you do not want to show interests-!}
.interestsAndDetails {display:none;}

{!-The below elements from the left column must either be rendered display:none; or placed using absolute positioning.
The absolute positioning is relative to the outer div not the entire page-!}

.userProfileDetail {display:none}
.userProfileSchool {display:none;}
.userProfileCompany {display:none;}
.userProfileNetworking {display:none;}

</style>
<i class="off">!-End make page ONE centered Column-!</i>


Example 2 (strategy 2)
In the below example I return the rest of the left column (the stuff that normally comes after the interests) to the profile.
The Below solution has TWO code blocks, you need both of them
Put this code in either the heroes section (after your heroes data and any data you have there to create custom tables below this section). Block 1:
<i class=i><a href="http://www.msplinks.com/MDFodHRwOi8veGlpaS51cy9tcy9jZW50ZXItc2luZ2xlLWNvbHVtbg==">
Center Profile into Single Column MySpace Code
Author:Eileen</i>

<span class="off">!- START code BLOCK 1 make page one centered column-!</span>

<span class="off">!-Close tables out to level 1-!</span>
</td></tr></table>
</td></tr></table>
</td></tr></table>

<span class="off">!-Create a Div to be used to more accurately position the stuff below this point, that we want to display-!</span>
<div class="myDleftBottom" style="position:relative; top:0px; left:0px; right:0px;" >

<span class="off">!-Open same number of tables we closed-!</span>
<table><tr><td>
<table class="off"><tr><td>
<table><tr><td>

<span class="off">!-End BLOCK 1 to make page ONE centered Column-!</span>
The next block can go anywhere (except nested between other style tags since it contains style tags).
The stuff in bold is stuff you probably want to edit. For each left column element, which was initially below the interests section, you will need to either render it display:none OR position it absolutely within the outer containing div.
If you want it gone, set it like I have set the schools (.userProfileSchool).
<style>
.i {display:none;}
{!-remove clear gifs to get better centering-!}
table img {display:none;}
td {width:auto}
table table table img {display:block;}
table table table.profileInfo img {display:inline;}
table table table.profileInfo td.text img {display:block;}

{!-Positioning and display of all left side elements which were below the Interests section-!}

{!-Move down right column stuff. top px value must equal margin-bottom. This is the amount you want to move this down to insert details, schools, companies, networking -}
.extendedNetwork {position:relative; top:400px; margin-bottom:400px;}

{!-The below elements from the left column must either be rendered display:none; or placed using absolute positioning.
The absolute positioning is relative to the outer div not the entire page-!}

.userProfileDetail {position:absolute; top:10px; right:50%; margin-right:-150px}
.userProfileSchool {display:none;}
.userProfileCompany {position:absolute; top:195px; right:50%; margin-right:-150px}
.userProfileNetworking {position:absolute; top:300; right:50%; margin-right:-150px;}

{!-OPTIONAL style stuff-!}
{!-ditch ugly gray behind bottom menu-!}
tr {background-color:transparent;}
{!-restore white to URL-!}
table.userProfileURL table tr {background-color:white !important}
</style>

Strategy 3) put Code in About Me Section
Place this code at the TOP of your about me section, BEFORE you about me content.
<span class="off">!-Start Block To Center Profile in One Column-!</span>

<span class="off">!-Shameful self promotion <a href="http://xiii.us/v/">MySpace Customization Code, Tutorials and Information</a></span>

<span class="off">!-Close out tables/cells/rows out THROUGH the td.text cell which makes up the right column-!</span>
</td></tr></table></td></tr></table>
</td></tr>

<span class="off">!-Create a new row underneath the cell which makes up the right column-!</span>
<tr><td>
<span class="off">!-Re-Open Blurbs Table, assign our own class (we will hide the old class)-!</span>
<table class="myBlurbs" style="width:435px;" ><tr><td class="myBlurbH">

<span class="off">!-ReCreate Blurbs Header if Desired-!</span>
<span class="orangetext15"> My Blurbs </span>
</td></tr>
<tr><td>
<table class="myBlurbsI"><tr><td class="myAboutMe">

<span class="off">ReCreate About Me Header if Desired</span>
<span class="orangetext15">About Me:<br></span>

<style>
{!- If you do not want to hide blogs this is NOT the best centering strategy -!}
table.latestBlogEntry, table.blurbs {display:none;}

{!- you may replace below with position absolute clause-!}
table.extendedNetwork {display:none;}

{!- size what is left of old right column to 0 width-!}
table table td.text {width:0px !important;}
table table table td.text {width:auto !important}
table.myBlurbs td {width:auto}
{!-Background coloring for cell with blurbs header-!}
td.myBlurbH {background-color:ffcc99}
</style>

<span class="off">!-END Block To Center Profile in One Column-!</span>
Code for Band Profile
Put this code at the bottom of the "Sounds Like":
<span class="off">!-START Code to Center Band Profile in One Single Centered Column-!</span>

</td></tr>

<span class="off">Below is to re-create the record label and signed by, remove this block if you don't want this </span>
<tr >
<td width="100" bgcolor="b1d0f0" NOWRAP>
<span class="lightbluetext8">Record Label</span></td>
<td width="175" bgcolor="d5e8fb" style="WORD-WRAP: break-word">
unsigned
</td>
</tr>
<tr><td width="100" bgcolor="b1d0f0" NOWRAP><span class="lightbluetext8">Type of Label</span></td>
<td width="175" bgcolor="d5e8fb" style="WORD-WRAP: break-word">
None
</td>
</tr>
<span class="off">END block to re-create the record label and signed by </span>

</table>
</td></tr></table>
</td></tr></table>
<table class="myTclassR"><tr><td class="off">

<table class="off"><tr><td>
<table><tr><td>

<style>
{!- remove cell used to make space between right and left columns-!}
table.myTclassR td {width:0px;}
table.myTclassR td img {display:none}
{!-remove effect on other content}
table.myTclassR td.text img {display:block;}
table.myTclassR td.text, table.myTclassR td.text td {width:auto !important}
</style>

<span class="off">!-END Code to Center Band Profile in One Single Centered Column-!</span>



For another solution, with less code (not as accurate with the centering, and hides everything left below the heroes) which may meet many needs, you can try this:
Katamari Centered Profile

Thank you for Visiting; Have a Nice Day :-)

Google often sends people to one of my pages, but not the one with the information. This is an experiment to see if I can help direct traffic to the correct page:
Queries which should be hitting this page:
If you are looking for myspace center profile codes OR one column profile code or you want to know how to make your myspace profile one column, you have come to the correct place.
If you want to create a center down profile for myspace OR a one column layout this page shows a few ways to do this. It also covers how to make my myspace profile one column. You can Create a 1 column myspace with only 1 column.
I show how to, In myspace, move everything so each element is under the other elements.
The code moves everything in the profil into one column
center whole profile in one column myspace
centered profile

Labels:

6 Comments:

Anonymous Anthony said...

Eileen, Anthony again, lol. I am learning so much from your tutorials its unbelievable. I've implemented your:

masterhead banner, hiding music nav bar, hiding top left text info, replacing the general info band table with that 60px table, the one column band page which was SO helpful!!! the music player absolute move....

and now i have just one question (which i imagine/hope is a quick fix)

in regards to the one column profile that is centered. i'm trying to have everything left aligned so that i can have my profile image and music player on the same "line". internet explorer seems to do this by default, by firefox is centering everything. i've played around with the one column code with table align=left in various areas of the code with minimal success.

my profile is www.myspace.com/gnarkilllabs

if that gives you a better idea.

thanks thanks thanks! I LOVE YOU!

Anthony

5/12/07 11:01  
Anonymous Anthony said...

and you know what, if possible i'd like to just move the profile image and contact table to the left. that way i could keep the top friends and comments centered, if that's not possible no big deal.

sorry for all the posts lately. i hope you know how much i appreciate the plethora of information and quick responses. seriously...i love you.

5/12/07 11:22  
Blogger Cesar Chavez said...

Hey I really like your help with the codes, they have been very helpful thus far.

I have a question about a banner under the music bar. Is there a way to put it below the music nav bar not under?

I used the following code on mine and it works, but its directly under the nav bar and the high does not show completely.

the size of my banner is 260x800 and the site url is: www.myspace.com/machinent

this code is the follwoing:
{!-shameful self promotion MySpace Code Stuff-!}{!-Place Image Under MusicNav Bar-!}div div {height:auto !important; background:none !important; background-image: url(http://www.latinurbanmedia.com/myspace/banner_260x800.gif) !important; background-repeat: no-repeat !important;background-position: bottom bottom !important; }div table div, table div div {height:auto !important; background-image:none !important;}{!-End block to place banner image under musicnav bar-!}

Any help would be great appreciated.

Thanks
Cesar

19/6/08 15:02  
Anonymous António said...

Hello,
I'm really messed up with all these center page codes lately. The thing is I do want to center my profile but without messing the previous codes. For example, I've tried some codes that actually did center my page but always made the hidden About Me, Who I'd like to meet, and the friends sections show up. So, my question is whether you know any code that would only center my myspace profile?
Thank you so much

António

19/7/08 15:29  
Blogger help me said...

on a band profile how do you create a new section under type of label instead under about me section

14/8/08 16:40  
Blogger Sholto said...

Hi eileen, you are my hero :)

just wondering is there a way to center your profile but from only halfway down.

I want to create a new section just above the friends space that is centered. is it possible? i cannot find anything.

thanks so much :)

30/8/08 06:26  

Post a Comment

Links to this post:

Create a Link

<< Home