Photosynthesis

Designer's Comments

Look carefully for specific instructions

Read this before asking questions/commenting!

Comments containing excessively long links that were not renamed in the linking process will break the layout. Images and flash video placed in the comments will be resized properly. Images and videos placed in the interests sections will be resized properly also. Please, do not remove the credits.

The code for the custom online now icon can be found here. The generator for the banner can be located here.

The background image on the screen shot is for aesthetic purposes only. The layout looks different in the preview, but once the code is input on MySpace it will look just like the screen shot depicts. The live preview is not 100% accurate, and there is nothing I can do about that.

Using This Layout

For specific instructions read designer's comments

1. Log into myspace.com
2. Click on Edit Profile (Profile 1.0)
3. Copy (ctrl c) and paste (ctrl v) code to the specified fields

Layout Code

Copy and paste to About Me

Help

{!- make room at bottom of div.profileWidth -!}
div.profileWidth table {margin-bottom:100px !important;}
div.profileWidth table {_margin-right:10px; _margin-left:10px;}
div.profileWidth:first-child {padding-right:10px !important; padding-left:10px !important;}
{! apply banner as bkgd image !}
div.profileWidth{width: 915px !important; height: 101px; background-image:url(http://cbimg9.com/layouts/08/11/32432aa.png)!important; background-position:center bottom !important; background-repeat:no-repeat !important;}
{!- reverse -!}
table.rail, .i, .i i.x {display:none;}

body {background-image:url(http://cbimg9.com/layouts/08/11/32432ab.png); background-position: top center; background-repeat: repeat-y; background-color: 212236; cursor: default;}

a:link, a:active, a:visited {color: 7D916A; font:11px 'trebuchet ms', arial, sans-serif;}
a:hover {color: 3D5E58; font:11px 'trebuchet ms', arial, sans-serif; text-decoration: none;}

.friendSpace {margin-top:15px; margin-bottom:0px; background-image:url(http://cbimg9.com/layouts/08/11/32432ac.png); background-position:bottom left; background-repeat:no-repeat;} 
.friendSpace table span.orangetext15 {display:block; width: 464px; height:37px; margin-top:-16px; background-image:url(http://cbimg9.com/layouts/08/11/32432ad.png); background-position:0 0; background-repeat:no-repeat; text-indent:-9999px;}
.friendSpace table {width: 464px; background-image:url(http://cbimg9.com/layouts/08/11/32432ae.png); 
background-position:top left; background-repeat:repeat-y;}

.friendSpace td.text {padding-bottom:8px}
.friendSpace table table {background-image:none;}
.friendSpace table table td {padding-bottom:10px; padding-top:10px;}

.friendSpace a img {margin-top: -28px;}
.friendSpace td td td a img {border: 3px solid; border-color: 181927;}
.friendSpace td td td a:hover img {border: 3px solid; border-color: 1B1C31;}

.friendSpace a:link, .friendSpace a:active, .friendSpace a:visited {color: 7D916A; font:11px 'trebuchet ms', arial, sans-serif; text-decoration: none; text-transform: uppercase;}
.friendSpace a:hover {color: 3D5E58; font:11px 'trebuchet ms', arial, sans-serif; text-decoration: none;}

table.friendSpace td {padding:0px;}
table.friendSpace td.text div {display:none;}
table.friendSpace .btext {display: none !important;}
table.friendSpace td.text td br {line-height:0px;}
table.friendSpace span.btext {text-align:center;}
table.friendSpace td.text div {text-align:center;}
table.friendSpace td.text td td {line-height:0px;}
table.friendSpace td.text td td a img {visibility:visible;}
.friendspace table {background-color:transparent; border:0px;}
table.friendSpace td.text td td a img {width:80px; height:70px;}
table.friendSpace td.text td td a {visibility:hidden; font-size:0px;}
table.friendSpace span.redbtext {color:FFDD99; font: 10px 'trebuchet ms', arial, sans-serif; font-weight:bold;}
table.friendSpace span.btext {color:C4C389; font: bold 10px 'trebuchet ms', arial, sans-serif; text-transform: uppercase; display:block; margin-bottom: 8px; cursor: default;}

.friendsComments .columnsWidening a {color: 7D916A !important; font: 11px 'trebuchet ms', arial, sans-serif !important; text-decoration: none;}.friendsComments .columnsWidening a:link {color: 7D916A !important; font: 11px 'trebuchet ms', arial, sans-serif !important; text-decoration: none;}
.friendsComments .columnsWidening a:hover {color: 3D5E58 !important; font: 11px 'trebuchet ms', arial, sans-serif !important;}

.friendsComments .commentlinks a:link {color: 7D916A !important; font: 10px 'trebuchet ms', arial, sans-serif !important; text-decoration: none;}
.friendsComments .commentlinks a:hover {color: 3D5E58 !important; font: 10px 'trebuchet ms', arial, sans-serif !important;}
.friendsComments td.text {padding-bottom: 10px}
table.friendsComments td.text td a {color: red;}
table.friendsComments td.text td b {display:none;}

.katamari replace pic generator {http://abrax.us/Katamari/ReplacePicGen.php }
table.friendsComments td.text td a {display:block; margin-top: 5px; margin-bottom: 6px; background-image:url(http://cbimg9.com/layouts/08/11/32432af.png); background-repeat:no-repeat; height:18px; background-position:center center; font-size:0px!important; _color: 212236 !important;}

table.friendsComments td.text td td a, table.friendsComments td.text td b a {display:inline; background-image:none; letter-spacing:0px; font-size:11px!important;}

table.friendsComments td.text td td a {visibility:hidden;}
table.friendsComments td.text td.columnsWidening a {visibility:visible !important;}
table.friendsComments td.text td td a img {visibility:visible;}
table.friendsComments td.text td.columnsWidening embed, table.friendsComments td.text td.columnsWidening object {width:260px; height:213px;}
table.friendsComments td.text td.columnsWidening img {width:260px;}

.friendsComments {width: 464px; margin-top:15px; margin-bottom:-10px; background-image:url(http://cbimg9.com/layouts/08/11/32432ac.png); background-position:bottom left; background-repeat:no-repeat; margin-bottom: 15px;} 
.friendsComments table span.orangetext15 {width: 464px; display:block; height:34px; background-image:url(http://cbimg9.com/layouts/08/11/32432ag.png); background-position:top left; background-repeat:no-repeat; text-indent:-9999px;}
.friendsComments table {width: 460px; background-image:url(http://cbimg9.com/layouts/08/11/32432ae.png); background-position:top left; background-repeat:repeat-y;}
.friendsComments .commentlinks {text-transform: uppercase; font:11px 'trebuchet ms', arial, sans-serif; font:11px 'trebuchet ms',arial,sans-serif;}
.friendsComments .blacktext10 {color: C4C389; display: none; text-align: right; text-transform: uppercase; font:11px 'trebuchet ms',arial,sans-serif;}
.friendsComments td.columnsWidening {color: FFFFFF; font:11px 'trebuchet ms', arial, sans-serif; width: 360px; padding-bottom: 6px !important;}
td.columnsWidening {background-image:url(); width:333px; height:auto; background-position:bottom left; background-repeat:repeat-y;}

.userProfileSchool table td {color:FFFFFF; font:11px 'trebuchet ms', arial, sans-serif;}
.userProfileSchool tbody tr td a {color: 7D916A; font:11px 'trebuchet ms', arial, sans-serif; text-decoration: none;}
.userProfileSchool tbody tr td a:hover {color: 3D5E58; font:11px 'trebuchet ms', arial, sans-serif;}
.userProfileSchool .whitetext12 {background-image:url(http://cbimg9.com/layouts/08/11/32432ah.png)!important; width:313px; height:32px; background-position:top left; background-repeat:no-repeat; font-size:0px; color:01021E; display:block;}
.userProfileSchool table {background-image:url(http://cbimg9.com/layouts/08/11/32432ai.png); height:auto; width:313px!important; background-position:bottom left; background-repeat:repeat-y; margin-bottom:5px;}
.userProfileSchool {background-image:url(http://cbimg9.com/layouts/08/11/32432aj.png); height:8px; background-position:bottom left; background-repeat:no-repeat;}

.userProfileNetworking .text {color:FFFFFF; font:11px 'trebuchet ms', arial, sans-serif;}
.userProfileNetworking tbody tr td a {color: 7D916A; font:11px 'trebuchet ms', arial, sans-serif; text-decoration: none;}
.userProfileNetworking tbody tr td a:hover {color: 3D5E58; font:11px 'trebuchet ms', arial, sans-serif;}
.userProfileNetworking .whitetext12 {background-image:url(http://cbimg9.com/layouts/08/11/32432ak.png)!important; width:313px; height:32px; background-position:top left; background-repeat:no-repeat; font-size:0px; color:01021E; display:block;}

.userProfileNetworking table {background-image:url(http://cbimg9.com/layouts/08/11/32432ai.png); height:auto; width:313px!important; background-position:bottom left; background-repeat:repeat-y; margin-bottom:5px;}
.userProfileNetworking {background-image:url(http://cbimg9.com/layouts/08/11/32432aj.png); height:8px; background-position:bottom left; background-repeat:no-repeat;}

.userProfileCompany .text {color:FFFFFF; font:11px 'trebuchet ms', arial, sans-serif;}
.userProfileCompany table td {color:FFFFFF; font:11px 'trebuchet ms', arial, sans-serif; padding-left:10px; padding-right:10px!important;}
.userProfileCompany .whitetext12 {background-image:url(http://cbimg9.com/layouts/08/11/32432al.png)!important; width:313px; height:32px; background-position:top left; background-repeat:no-repeat; font-size:0px; color:01021E; display:block;}
.userProfileCompany table {background-image:url(http://cbimg9.com/layouts/08/11/32432ai.png); height:auto; width:313px!important; background-position:bottom left; background-repeat:repeat-y; margin-bottom:5px;}
.userProfileCompany {background-image:url(http://cbimg9.com/layouts/08/11/32432aj.png); height:8px; background-position:bottom left; background-repeat:no-repeat;}

.extendedNetwork {width:464px!important; height:68px;background-image:url(http://cbimg9.com/layouts/08/11/32432am.png); background-position:bottom left; background-repeat:no-repeat;} 
.searchMonkey-standardUserStatus {position: relative; top: 22px; left: 5px; text-align: left; display: block;}
.searchMonkey-standardUserStatus {color: FFFFFF !important; font: 11px'trebuchet ms', arial, sans-serif !important;}

.lightbluetext8 {text-align: left; display: block;}
.userProfileDetail tbody tr td {color: FFFFFF; font:11px 'trebuchet ms', arial, sans-serif;}
.userProfileDetail .lightbluetext8 {color: C4C389; font:11px 'trebuchet ms', arial, sans-serif;}
.userProfileDetail .whitetext12 {background-image:url(http://cbimg9.com/layouts/08/11/32432an.png)!important; width:313px; height:34px; background-position:top left; background-repeat:no-repeat; color:ffffff; display:block; font-size:0px; color: 212236; text-indent: -9999px;}
.userProfileDetail table {background-image:url(http://cbimg9.com/layouts/08/11/32432ai.png); height:auto; width:313px!important; background-position:bottom left; background-repeat:repeat-y; margin-bottom:5px; margin-top:0px;}
.userProfileDetail {background-image:url(http://cbimg9.com/layouts/08/11/32432aj.png); height:8px; background-position:bottom left; background-repeat:no-repeat;}

.interestsAndDetails .lightbluetext8 {color: C4C389; font:11px 'trebuchet ms', arial, sans-serif;}
.interestsAndDetails table td {color: FFFFFF; font:11px 'trebuchet ms', arial, sans-serif;}
.interestsAndDetails a:link, .interestsAndDetails a:active, .interestsAndDetails a:visited {color: 7D916A; font:11px 'trebuchet ms', arial, sans-serif;}
.interestsAndDetails a:hover {color: 3D5E58; font:11px 'trebuchet ms', arial, sans-serif; text-decoration: none;}
.interestsAndDetails object, table.interestsAndDetails embed, table.interestsAndDetails img {width:185px; height:149px;} 
.interestsAndDetails .whitetext12 {background-image:url(http://cbimg9.com/layouts/08/11/32432ao.png)!important; width:313px; height:34px; background-position:top left; background-repeat:no-repeat; font-size:0px; color:01021E; text-indent: -9999px; display:block;}
.interestsAndDetails table {background-image:url(http://cbimg9.com/layouts/08/11/32432ai.png); height:auto; width:313px!important; background-position:bottom left; background-repeat:repeat-y; margin-bottom:5px; overflow-x:hidden!important;}
.interestsAndDetails{margin-top: -15px; background-image:url(http://cbimg9.com/layouts/08/11/32432aj.png); height:8px; background-position:bottom left; background-repeat:no-repeat;}

.nametext {display: none;}
.profileInfo a:link, a:active {color: 7D916A; text-decoration: none;}
.profileInfo a:hover {color: 3D5E58;}
.profileInfo td * {color: FFFFFF;}
.profileInfo td {padding-bottom:4px}
.profileInfo td td.text {background-image:none;}
.profileInfo a img {width: 140px; position: relative; left: 7px;}
.profileInfo a img {border: 3px solid; border-color: 181927;}
.profileInfo a:hover img {border: 3px solid; border-color: 1B1C31;}
.profileInfo td.text {font:10px 'trebuchet ms', arial, sans-serif;}
.profileInfo b {color:FFFFFF !important; font:11px 'trebuchet ms', arial, sans-serif;}
.searchMonkey-mood {color:C4C389 !important; font:11px 'trebuchet ms', arial, sans-serif;}
.searchMonkey-lastLogin {color:C4C389 !important; font:10px 'trebuchet ms', arial, sans-serif;}
.profileInfo {margin-top: 15px; background-image:url(http://cbimg9.com/layouts/08/11/32432aj.png); background-position:bottom left; background-repeat:no-repeat;}
.profileInfo td.text {background-image:url("http://cbimg9.com/layouts/08/11/32432ap.png"); background-position: top left; height: 33px !important; background-color:transparent; background-repeat: no-repeat;}
.profileInfo table {width:313px; float:left; background-image:url(http://cbimg9.com/layouts/08/11/32432ai.png); background-repeat:repeat-y; background-position:top left;}

table.blurbs span.text {margin-top: -10px; display: block;}
table.blurbs td.text {font-size: 0px; text-indent: -9999px;}
.blurbs span.text {color:FFFFFF; font:11px 'trebuchet ms', arial, sans-serif;}
.blurbs .orangetext15 {color:C4C389; font:12px 'trebuchet ms', arial, sans-serif; text-transform: capitalize;}
table.blurbs td td span.orangetext15 {color: C4C389; font:12px 'trebuchet ms', arial, sans-serif; display: block; margin-top: -5px !important;}
.blurbs td.text span.orangetext15 {background-image:url(http://cbimg9.com/layouts/08/11/32432aq.png); height:37px!important; width:464px!important; background-repeat:no-repeat; background-position:bottom left; display:block;}
.blurbs table {background-image:url(http://cbimg9.com/layouts/08/11/32432ae.png); height:auto; width:464px!important; margin-bottom:5px; background-position:bottom left; background-repeat:repeat-y;}
.blurbs {margin-top: 15px; background-image:url(http://cbimg9.com/layouts/08/11/32432ac.png); background-position:bottom left; background-repeat:no-repeat; margin-bottom:0px; width:464px!important; display:block;}

.latestBlogEntry {border-collapse:collapse !important; margin-top:15px; background-image:url(http://cbimg9.com/layouts/08/11/32432ar.png); background-position:bottom left; _background-position:1px bottom; background-repeat:no-repeat;}

.latestBlogEntry .btext {display:block; width:464px; height:37px; position:relative; left:-2px; top:-3px; background-image:url(http://cbimg9.com/layouts/08/11/32432as.png); 
background-position:0 0; background-repeat:no-repeat; text-indent:-9999px;}

.latestBlogEntry br {line-height:6px;}
.latestBlogEntry td {height:1px!important;}
.latestBlogEntry span.text {color: C4C389 !important;}
table[class="latestBlogEntry"] .btext {top:0px;left:0px;}
.latestBlogEntry td {padding-bottom:5px; line-height:14px;}
table.latestBlogEntry span.text {color: C4C389; margin-left: 5px;}
.latestBlogEntry br, .latestBlogEntry .text br{display:none!important;}
table.latestBlogEntry span.text, table.latestBlogEntry td {color:212236;}
table.latestBlogEntry span.text {display:block; float:left; width:375px; _width:350px;}

td.text, td.text td.text {background-color:ffffff;}
table table td, table table td.text table td.text table, table table td.text 
table table, table table table table tr , table table table table, td, table 
table table, table table {border:0px solid!important; border-color:000000!important;}
table td, table table {background-color:transparent!important; background-image:none;}
div table{background-color:transparent; border:0px!important; background-image:none!important;}
table {border:0px solid; border-color:ff6fb7; border-bottom:0px; border-top:0px; background-color:transparent;}
body div div table td, div[id="topnav"]{background-color:ff69b4!important;color:ffffff!important;}

.contactTable .whitetext12{color:01021E; font-size:0px; text-indent: -9999px;}
.contactTable {margin-top: 10px; cursor:hand;width:313px !important; height:122px !important; padding:0px!important; background-color:transparent; background-image:url("http://cbimg9.com/layouts/08/11/32432at.png"); background-attachment:scroll; background-position:center center; background-repeat:no-repeat; background-color:transparent;}
.contactTable table, .contactTable td {padding:0px !important; border:0px; background-color:transparent; background-image:none;}
.contactTable img {display:none; background-color:transparent!important;}
.contactTable a {display:block; height:29px; width:139px; background-image:none; background-color:transparent!important; filter:none;}
.contactTable a img {background-color:transparent!important;}

.userProfileURL {display: none;}
.userProfileURL td td td {width:0px;}
table.userProfileURL div {color:FFFFFF;}
table.userProfileURL strong {color:FFFFFF;}
table.userProfileURL td td div {text-align:center;}
table.userProfileURL td td {background-color:white;}

.userProfileApp .whitetext12 {display: none;}

!-Custom OnLine Now Icon
!-Solution Source:  MySpace Code -!
!-Solution Optimized for 80x20 icon. You WILL need to adjust size, clip and margin values for other icon sizes-!
 
{!-apply background image; replace with url of your image -!}
img.ImgOnlineNow {background-image:url(http://cbimg9.com/layouts/08/11/32432au.gif); background-repeat: no-repeat;}
img.ImgOnlineNow {height:0px !important; width:0px !important; padding-top:20px; padding-right:80px; background-position: center center;}
table.friendSpace img.ImgOnlineNow {}
table.friendsComments img.ImgOnlineNow {margin-top:0px !important; _margin-top: 0px !important; margin-left:0px;}

{!-IE solution -!}
{!-All Rights to this Solution Reserved. You may use it. You may NOT publish it.}
* html img.ImgOnlineNow {padding-top:0px; padding-right:0px;}
* html img.ImgOnlineNow {width:105px !important; height:52px !important;}
* html img.ImgOnlineNow {background-position:top right;}

{!-The margin values may need adjustment-!}
* html img.ImgOnlineNow {position:absolute; margin-top: -3px !important; margin-left:-25px!important;}
* html table.friendsComments img.ImgOnlineNow {margin-top: -5px !important; margin-left:-65px !important;}
* html table.friendSpace img.ImgOnlineNow {margin-top: 5px !important; margin-left:-52px !important;}
* html img.ImgOnlineNow {clip: rect(0px, 105px, 21px, 26px)}

.bodyContent td div div {color:FFFFFF;}
.bodyContent td {background-color: 212236;}
.bodyContent table div br {line-height: 5px;}
.bodyContent tr {background-color: transparent;}
.bodyContent td div font {color: FFFFFF; margin-bottom: 10px; display: block; font:11px 'trebuchet ms', arial, sans-serif;}

a:active {outline: none;}
:focus{-moz-outline-style: none;}

img {border: 0; filter:alpha(opacity=95); -moz-opacity: 0.95; opacity: 0.95;}
img:hover {filter:alpha(opacity=95); -moz-opacity: 0.95; opacity: 0.95;}

table table td.text table td.text table table table {background-image:url(); width: 85px; height:95px; background-position:top left; background-repeat:no-repeat!important; display:block;}

.blurbs textarea, .interestsAndDetails textarea {background-color: 212236; border-width: 1px 1px 1px 1px; border-style: dashed; border-color: 01021E; color: FFFFFF; padding: 3px 0px 3px 3px; font:11px 'trebuchet ms', arial, sans-serif; padding: 2px;}

.blurbs input, .interestsAndDetails input {background-color: 212236; border-width: 1px 1px 1px 1px; border-style: dashed; border-color: 01021E; color: FFFFFF; padding: 3px 0px 3px 3px; font:11px 'trebuchet ms', arial, sans-serif; padding: 2px;}

{! color top menu !}
div.profileWidth table td, i i i.x {background-color: 1B1C31 !important;}
{! color search area and behind ad different than top menu !}
div.profileWidth div {background-color: 01021E !important}
{! remove shadow in google search area !}
div.profileWidth div.clearfix, .i i i {background-image: none !important;}
div.profileWidth table td ul small,
div.clearfix i i i {color: 000000 !important}

{!- Browser Hacks -!}
.friendSpace a img {_margin-top: -26px; _left: 10px; position: relative !important; z-index: 9 !important; _margin-left: 5px; display: block;}
.profileInfo {_margin-top: 28px;}
.latestBlogEntry, .contactTable, .blurbs,
.friendSpace, .friendsComments {_margin-top:20px;}

@media screen and (-webkit-min-device-pixel-ratio:0){
.friendSpace a img {margin-top: 0px;}

table.friendsComments td.text td a {font-size:0px!important; color: 212236;}
}

@media all and (min-width: 0px){
table table td.text table td.text table table table {background-image:url(); width: 85px; height:135px; background-position:top left; background-repeat:no-repeat!important; display:block;}
}

</style>

<span class="orangetext15" style="display:inline;">Designed By:</span> <a href="http://www.myspace.com/itsmattadams">Matt</a>

Layout Comments

Showing latest 10 of 11 comments

This layout looks horrible to me. The colors clash- hot pink with blue? But I'm in the minority so don't worry about what I say. Most people seem to like this layout. I will say I like the length of it. It's nice and long. That's nice.

By Butterface89 on Jul 26, 2010 7:42 pm

oohhhh how dark & interesting is this! :D i adore the colors

By koobecaf on Nov 17, 2009 12:01 am

hey there I love this layout - however the friends pics are stretched and the comments have no date or time how can i rectify this? advice gratefully recieved!

By LeenaSowambur on Jun 21, 2009 10:22 am