Myspace Profile 2.0

2009-07-23T16:18:00.000-07:00

Content/Scroll Boxes Next To Each Other:

Box 1
Content Here / Inhalt Hier

Box 2
Content Here / Inhalt Hier

Add this to your Field:

.K {Boxes Next To Each Other}
.KhAk {MainBox 3}
div.KhAkScrBox3 {
height:120px; width:450px;
padding:10px;
border:2px solid green;
}

.KhAk {LeftScrollBox 1}
div.KhAkScrBox1 {
height:100px; width:200px;
float:left; padding:10px;
overflow:auto;
border:2px solid red;
}

.KhAk {RightScrollBox 2}
div.KhAkScrBox2 {
height:100px; width:200px;
float:right; padding:10px;
overflow:auto;
border:2px solid yellow;
}

Add this to your About Me/Meet/Interests:

<div class="KhAkScrBox1">
Content 1 Here / Inhalt 1 Hier
</div>

<div class="KhAkScrBox2">
Content 2 Here / Inhalt 2 Hier
</div>

</div>

Instruction:

☼- Adjust the height and width of all Containers (Boxes) to suit your own needs.
But, set the width of Box 3 to the:
width of Box1 + width of Box2 + 50px or more.
And, set the height of Box 3 to the:
height of Box1 OR Box2 + 20px.

☼- overflow:auto; makes containers to the "Scrollable Content Boxes".

☼- If you do not wish to define a border surrounding the boxes,
delete this line of the codes:
border:2px solid COLOR;

*** Note:

☼- If you want to add "the same" scroll boxes with the same properties at the multiple
places on your profile:
Just add the second part of the code into the section you wish.

☼- If you want to add "different" scroll boxes with other properties at the multiple
places on your profile:
Add the entire code BUT change:
the class numbers 1, 2 and 3 to 4, 5 and 6

Nice Trick:

☼- To flip the "Scrollbar" to the left side of your "Box",
add the below line to the CSS code before "}" :
direction: rtl;

2009-07-22T21:46:00.000-07:00

Adding NEW MODULEs To Your Profile 2.0: Create New Sections

If you plan to add One or Multiple NEW MODULEs to your profile 2.0,
just follow the below Instruction:

Wenn du vorhast Ein oder Mehrere MODULe zu deinem Profil 2.0
hinzuzufügen, folge einfach die folgende Instruktion:

Instruction:

Add the below "HTML Table" code in your "About Me/Meet/Interests":

<div class="moduleMid"><div class="moduleMid1"><div class="moduleMid2">
<h3 class="moduleHead"><span><span> NEW MODULE'S TITLE </span></span></h3>

<div class="moduleBody">

Content Here / Inhalt Hier (Image, Text, Video etc.)

<div class="moduleBodyEnd"></div></div></div></div></div>
<div class="moduleBottom"><div><div></div></div></div>
</div>

Positioning The New Module On Your Profile:

Add the below code in your Field:

.KhAk {Position The Contact Table Module}
div.KhAkNewModule1 {width:310px;
position:absolute; left:50%;
margin-left:-460px; top:500px;
_margin-left:-460px; _top:470px;
z-index:9;}

Note:

Replace "NEW MODULE'S TITLE" with your own "Module Title".
☼- Change the number "1" to 2, 3, 4 etc., if you want to add multiple Modules on your profile.
You must also do the same change in the HTML code [⇑].

☼- "310" Changes the width of the new module.
☼- "-460" Moves the module to the left/right. You can also use a positive number.
☼- "500" Moves the module up/down.
☼- Adjust _margin-left and _top numbers to fix the position on "Internet Explorer" (6,7 !).

Ersetze "NEW MODULE'S TITLE" mit deinem eigenen "Modultitel".
☼- Ändere die Zahl "1" in 2, 3, 4 etc., wenn du vorhast multiple Module auf deinem profil einzufügen.
Dieselbe Änderung musst du dann aber auch in den HTML code vornehmen[⇑].

☼- "310" ändert die Breite des neuen Moduls.
☼- "-460" verschiebt das Modul nach links/rechts. Du kannst auch eine positive zahl benutzen.
☼- "500" verschiebt das Modul nach oben/unten.
☼- Passe _margin-left und _top Zahlen um die position in "Internet Explorer" (6,7 !) zu korrigieren.

Create Space Above/Below One Of Your Modules To Position The New Module There:

Adjust the number "200", and add the code of your choice into the Field:

.KhAk {Free Space Above Basic Info}
div.basicInfoModule {margin-top:200px;}

.KhAk {Free Space Below Basic Info}
div.basicInfoModule {margin-bottom:200px;}

.KhAk {Free Space Above Post Comment Module}
div.postCommentModule {margin-top:200px;}

.KhAk {Free Space Below Post Comment Module}
div.postCommentModule {margin-bottom:200px;}

.KhAk {Free Space Above Music Player}
div.musicPlayerModule {margin-top:200px;}

.KhAk {Free Space Below Music Player}
div.musicPlayerModule {margin-bottom:200px;}

.KhAk {Free Space Above Groups Module}
div.groupsModule {margin-top:200px;}

.KhAk {Free Space Below Groups Module}
div.groupsModule {margin-bottom:200px;}

.KhAk {Free Space Above Interests}
div.interestsModule {margin-top:200px;}

.KhAk {Free Space Below Details}
div.interestsModule {margin-bottom:200px;}

.KhAk {Free Space Above Details}
div.detailsModule {margin-top:200px;}

.KhAk {Free Space Below Details}
div.detailsModule {margin-bottom:200px;}

.KhAk {Free Space Above Blogs}
div.blogsModule {margin-top:200px;}

.KhAk {Free Space Below Blogs}
div.blogsModule {margin-bottom:200px;}

.KhAk {Free Space Above Friends}
div.friendSpaceModule {margin-top:200px;}

.KhAk {Free Space Below Friends}
div.friendSpaceModule {margin-bottom:200px;}

2009-07-22T18:37:00.000-07:00

Add A Contact Table MODULE To Your Profile 2.0: CODE 3 CODE 1 CODE 2 Image Nav

If you plan to add a myspace 1.0 contact table as a MODULE on your profile 2.0,
just follow the below Instruction:

Wenn du vorhast eine Myspace 1.0 Kontakttabelle als ein MODUL zu deinem Profil 2.0
hinzuzufüge, folge einfach die folgende Instruktion:

Instruction:

First, we hide the Myspace "Contact Links", and we do specific adjustment of our new contact table components.

zunächst verstecken wir Myspace "Kontakt-Links" und nehmen bestimmte Anpassungen der neuen Kontakttabellen-komponenten vor.

Add the below code in your Field:

.KhAk {Hide Myspace Contact Links}
div.basicInfoModule ul.contactLinks {display:none;}

.KhAk {Add Bg Image To Contact Table}
div.KhAkCTM table {width:300px; height:150px; padding:0;
background-color:transparent;
background-image:url("YOUR IMAGE URL");
background-attachment:scroll;
background-position:center center;
background-repeat:no-repeat;}

div.KhAkCTM td {width:148px; height:38px; padding:0;}
div.KhAkCT td a img {width:125px; height:32px; margin:0; padding:0;}

div.KhAkCTM {width:300px; background-color:transparent;}
div.KhAkCTM table {margin-top:2px;}

.KhAk {The Width Of The New Module}
div.KhAkNewModule {width:310px;}

Replace it with your own contact table image.
- You can find HERE a Collection of design contact tables.
- Copy/paste the "Code" of your selected image into a simple text editor.
Then, grab the "Image URL", and insert it into the above code.

☼- Use a "Negative Number" like '-20', if you have a gap between module title and the contact table.
☼- Adjust Width of your "New Module".

Add the below "HTML Table" code in your "About Me/Meet/Interests":

<div class="moduleMid"><div class="moduleMid1"><div class="moduleMid2">
<h3 class="moduleHead"><span><span> Contacting KhAk's Design </span></span></h3>

</table>
</div>

Replace "Contacting KhAk's Design" with your own "Profile Name".

☼- Replace "URL For..."s with the "URL"s to the related pages.
You can find HERE a list of contact table URLs, and a help how-to about "FriendID".

Ersetze "Contacting KhAk's Design" mit deinem eigenen "ProfilNamen".

☼- Ersetze die "URL For..."s mit den "URL"s zu den entsprechenden Seiten.
Eine Liste der Kontakt-tabellen-URLs und was ein "FriendID" ist, findest du HERE.

Positioning The (New) Contact Table Module:

Add the below code in your Field:

.KhAk {Position The Contact Table Module}
div.KhAkCTM {position:absolute; left:50%;
margin-left:-460px; top:500px;
_margin-left:-460px; _top:470px;
z-index:9;}

"-460" Moves the table left/right. You can also use a positive number.
☼- "500" Moves the table up/down.
☼- Adjust _margin-left and _top numbers to fix the position on "Internet Explorer" (6,7).

Make A Space Above/Below One Of Your Modules To Position The New Contact Table There:

Adjust the number "200", and add the code of your choice into the Field:

2009-07-21T15:16:00.001-07:00

Add A Classic 1.0 Contact Table To Your Profile 2.0: CODE 2 CODE 1 Contact Module Image Nav

If you plan to add a myspace 1.0 contact table on your profile 2.0,
just follow the below Instruction:

Wenn du vorhast eine Myspace 1.0 Kontakttabelle zu deinem Profil 2.0
hinzuzufüge, folge einfach die folgende Instruktion:

Instruction:

First, we hide the Myspace "Contact Links", and format the headline, cells etc. of the new contact table.

zunächst werden Myspace "Kontakt-Links" versteckt und die Überschrift und Zellen etc. der neuen Kontakttabellen formatiert.

Add the below code in your Field:

.KhAk {Hide Myspace Contact Links}
div.basicInfoModule ul.contactLinks {display:none;}

.KhAk {Add Bg Image To Contact Table}
div.KhAkCT table {width:300px; height:150px; padding:0;
background-color:transparent;
background-image:url("YOUR IMAGE URL");
background-attachment:scroll;
background-position:center center;
background-repeat:no-repeat;}

div.KhAkCT td {width:150px; height:38px; text-align:left; padding:0;}
div.KhAkCT td a img {width:130px; height:32px; margin:0; padding:0;}

div.KhAkCT {width:300px; background-color:black; text-align:center;}
div.KhAkCT table {margin-top:7px;}

.KhAk {Formating The Title - Contacting XX}
div.KhAkCT p.title { color:white; font-family:tahoma; font-size:12px; font-weight:bold;}

.KhAk {Add Borders To The New Contact Table}
div.KhAkCT {border:1px solid Gray;}
div.KhAkCT table {border-top:1px solid Gray;}

☼- Replace it with your own contact table image.
- You can find HERE a Collection of design contact tables.
- Copy/paste the "Code" of your selected image into a simple text editor.
Then, grab the "Image URL", and insert it into the above code.

☼- Change background color of the headline area.
☼- Format the headline "Contacting XX".
☼- Adjust the Border around your new contact table.

Add the below "HTML Table" code in your "About Me/Meet/Interests":

<div class="KhAkCT">
<p class="title"> Contacting KhAk's Design </p>

<table>

</table>
</div>

Replace "Contacting KhAk's Design" with your own "Profile Name".

☼- Replace "URL For..."s with the "URL"s to the related pages.
You can find HERE a list of contact table URLs, and a help how-to about "FriendID".

Ersetze "Contacting KhAk's Design" mit deinem eigenen "ProfilNamen".

☼- Ersetze die "URL For..."s mit den "URL"s zu den entsprechenden Seiten.
Eine Liste der Kontakt-tabellen-URLs und was ein "FriendID" ist, findest du HERE.

Positioning The New Contact Table:

Add the below code in your Field:

.KhAk {Position The New Contact Table}
div.KhAkCT {position:absolute; left:50%;
margin-left:-460px; top:500px;
_margin-left:-460px; _top:470px;
z-index:9;}

☼- "-460" Moves the table left/right. You can also use a positive number.
☼- "500" Moves the table up/down.
☼- Adjust _margin-left and _top numbers to fix the position on "Internet Explorer" (6,7).

Make A Space Above/Below One Of Your Modules To Position The New Contact Table There:

Adjust the number "200", and add the code of your choice into the Field:

2009-07-20T19:47:00.000-07:00

Create A Contact Table With Your Own Icons For Profile 2.0: CODE 2 Contact Module Image Nav

If you plan to add a myspace 1.0 contact table on your profile 2.0,
just follow the below Instruction:

Wenn du vorhast eine Myspace 1.0 Kontakttabelle zu deinem Profil 2.0
hinzuzufüge, folge einfach die folgende Instruktion:

Instruction:

First, we hide the Myspace "Contact Links", and format the headline, cells etc. of the new contact table.

zunächst werden Myspace "Kontakt-Links" versteckt und die Überschrift und Zellen etc. der neuen Kontakttabellen formatiert.

Add the below code in your Field:

.KhAk {Hide Myspace Contact Links}
div.basicInfoModule ul.contactLinks {display:none;}

.KhAk {Formatting Table Cells etc.}
div.KhAkCT, div.KhAkCT table {width:300px; background-color:black;}
div.KhAkCT th {background-color:black; padding:5px; text-align:center;
color:white; font-family:tahoma; font-size:12px; font-weight:bold;}
div.KhAkCT td a img {width:150px;}

.KhAk {Add Borders To The New Contact Table}
div.KhAkCT {border:1px solid Gray;}
div.KhAkCT th {border-bottom:1px solid Gray;}

Change it to the same color as your images.
Format the headline "Contacting XX".

Adjust the Border around your new contact table.

Add the below "HTML Table" code in your "About Me/Meet/Interests":

<tr>
<th colspan="2">Contacting KhAk's Design</th>
</tr>

<tr>
<td colspan="1">Mail Me</td>
<td colspan="1">Forward</td>
</tr>

<tr>
<td colspan="1">Add Me</td>
<td colspan="1">Favorites</td>
</tr>

<tr>
<td colspan="1">My HomeP.</td>
<td colspan="1">Block Me</td>
</tr>

<tr>
<td colspan="1">Invite Me</td>
<td colspan="1">Rank Me</td>
</tr>

</table>
</div>

Replace "Contacting KhAk's Design" with your own "Profile Name".
- Make sure you have "Eight Inscribed Images" with exactly the "Same Size" (150 x 30px), like:

Ersetze "Contacting KhAk's Design" mit deinem eigenen "ProfilNamen".
- Vergewissere dich, du hast "Acht Beschriftete Bilder" mit exakt "Derselben Größe" (150 x 30px), wie z.B.:

Myspace Original Icons
Click to grab the URL of each Image

Insert the Image Links with the below "HTML Code" in your "Table Cells" where it says Mail Me/Add Me etc.,
and replace the URLs with your own.
- You can find HERE a list of contact table URLs, and a help how-to about "FriendID".

Füge die Link Bilder mit dem folgenden "HTML Code" in die "Tabellen-Zellen", wo es Mail Me/Add Me etc. steht,
ein und ersetze die URLs mit deinen eigenen..
- Eine Liste der Kontakt-tabellen-URLs und was ein "FriendID" ist, findest du HERE.

Positioning The New Contact Table:

Add the below code in your Field:

.KhAk {Position The New Contact Table}
div.KhAkCT {position:absolute; left:50%;
margin-left:-460px; top:500px;
_margin-left:-460px; _top:470px;
z-index:9;}

Make A Space Above/Below One Of Your Modules To Position The New Contact Table There:

Adjust the number "200", and add the code of your choice into the Field:

2009-07-18T19:15:00.000-07:00

Groups Module

Groups Module: NEW Module

Myspave: Groups Home

.K {Hide Groups Module}
div.groupsModule {display:none;}

Groups Module Header:

.K {Hide Groups Header}
div.groupsModule h3.moduleHead {display:none;}

.K {Center Groups Header}
div.groupsModule h3.moduleHead {text-align:center;}

.K {Hide Groups Main Title}
div.groupsModule h3.moduleHead span span {display:none;}

.K {Change Color Of Groups Header}
div.groupsModule h3.moduleHead span span {color:red;}

.K {Transparent Background Of Groups Header}
div.groupsModule h3.moduleHead {background-color:transparent;}

.K {Change Background Color Of Groups Header}
div.groupsModule h3.moduleHead {background-color:yellow;}

.K {Add Background Image To Groups Header}
div.groupsModule h3.moduleHead {background-image:url(Your Image URL);}

Groups Module Links, Images:

Groups Module - LINKS:

.K {Hide Groups Names}
div.groupsModule div.moduleBody ul li span.pilDisplayName {display:none;}

.K {Change Color Of Group Names}
div.groupsModule div.moduleBody ul li span a {color:Red;}
div.groupsModule div.moduleBody ul li span a:hover {color:Yellow;}

.K {Hide Groups Module View All Link}
div.groupsModule div.moduleBody div.toolbar ul li a {display:none;}

.K {Change Color Of Groups View All Link}
div.groupsModule div.moduleBody div.toolbar ul li a {color:Green;}
div.groupsModule div.moduleBody div.toolbar ul li a:hover {color:Olive;}

Groups Module - IMAGES:

.K {Hide Groups Images}
div.groupsModule div.moduleBody ul li span a img {display:none;}

.K {Resize Groups Images}
div.groupsModule div.moduleBody ul li span a img {width:60px;}

.K {Add Border To Groups Images}
div.groupsModule div.moduleBody ul li span a img {border:3px solid red;}
div.groupsModule div.moduleBody ul li span a:hover img {border:3px solid yellow;}

Groups Module - Background:

.K {Change Background Color Of Groups}
div.groupsModule div.moduleBody {background-color:red;} {background-color:red;}

.K {Add Background Image To Groups}
div.groupsModule div.moduleBody {background-image:url(Your Image URL);}

Groups Module Borders:

.K {Hide Groups Top And Bottom Borders}
div.groupsModule div.moduleTop, div.groupsModule div.moduleBottom {display:none;}

.K {Hide Groups Left And Right Borders}
div.groupsModule div {border:0px;}

.K {Groups Borders}
div.groupsModule {border:3px solid red;}

Rounded Groups Borders - FF & SA:

.K {Rounded Groups Borders}
div.groupsModule {border:3px solid red;
-moz-border-radius:10px; -webkit-border-radius:10px;}

Scrollable Groups:

.K {Scrollable Activities}
div.groupsModule div.moduleBody {overflow:auto; height:100px;}

2009-04-10T19:54:00.000-07:00

Profile Post Comment

Post Comment Module Header:

.K {Hide Post Comment Header}
div.postCommentModule h3.moduleHead {display:none;}

.K {Change The Title Of Post Comment Module}

.K {Center Post Comment Header}
div.postCommentModule h3.moduleHead {text-align:center;}

.K {Change Color of Post Comment Header}
div.postCommentModule h3.moduleHead span span {color:red;}

.K {Transparent Background Of Post Comment Header}
div.postCommentModule h3.moduleHead {background-color:transparent;}

.K {Change Background Color Of Post Comment Header}
div.postCommentModule h3.moduleHead {background-color:yellow;}

.K {Add Background Image To Post Comment Header}
div.postCommentModule h3.moduleHead {background-image:url(Your Image URL);}

Post Comment Module:

.K {Hide Post Comment Module}
div.postCommentModule {display:none;}

.K {Change Background Color Of Post Comment Module}
div.postCommentModule {background-color:red;}

.K {Add Background Image To Post Comment Module}
div.postCommentModule {background-image:url(Your Image URL);}

.K {Hide Comments Count}
div.postCommentModule div.toolbar ul li a {display:none;}

.K {Hide Just Comments Number}
div.postCommentModule div.toolbar ul li a span {display:none;}

.K {Change Color Of Comments Link}
div.postCommentModule div.toolbar ul li a {color:red;}
div.postCommentModule div.toolbar ul li a:hover {yellow;}

.K {Change Color Of Comments Number}
div.postCommentModule div.toolbar ul li a span {color:yellow;}

.K {Change Background Color Of Comments Area}
div.postCommentModule div.percentWidth textarea {background-color:yellow;}

.K {Change Color Of The Text Shown In The Box}
div.postCommentModule div.percentWidth textarea {color:red;}

.K {Change Background Color Of Submit Button}
div.postCommentModule button {background-color:red;}

.K {Change Text Color Of Submit Button}
div.postCommentModule button {color:yellow;}

Post Comment Module Borders:

.K {Hide Applications Top And Bottom Borders}
div.postCommentModule div.moduleTop, div.postCommentModule div.moduleBottom {display:none;}

.K {Hide Applications Left And Right Borders}
div.postCommentModule div {border:0px;}

.K {Add Borders To Post Comment Module}
div.postCommentModule {border:3px solid red;}

Rounded Post Comment Module Borders - FF & SA:

.K {Rounded Post Comment Module Borders}
div.postCommentModule {border:3px solid red;
-moz-border-radius:10px; -webkit-border-radius:10px;}

2009-04-01T00:03:00.000-07:00

Activities Module

Activities Module: NEW Module

Tom's Blog - New Module: Activities

.K {Hide Activities Module}
div.activityMiniFeedModule {display:none;}

Activities Module Header:

.K {Hide Activities Header}
div.activityMiniFeedModule h3.moduleHead {display:none;}

.K {Center Activities Header}
div.activityMiniFeedModule h3.moduleHead {text-align:center;}

.K {Hide Activities Main Title}
div.activityMiniFeedModule h3.moduleHead span span {display:none;}

.K {Change Color Of Activities Header}
div.activityMiniFeedModule h3.moduleHead span span {color:red;}

.K {Transparent Background Of Activities Header}
div.activityMiniFeedModule h3.moduleHead {background-color:transparent;}

.K {Change Background Color Of Activities Header}
div.activityMiniFeedModule h3.moduleHead {background-color:yellow;}

.K {Add Background Image To Activities Header}
div.activityMiniFeedModule h3.moduleHead {background-image:url(Your Image URL);}

Activities Module Links, Text/Font:

Activities Module - LINKS:

.K {Activities Module All Links}
div.activityMiniFeedModule div.moduleBody ul.activities li a {color:Red;}
div.activityMiniFeedModule div.moduleBody ul.activities li a:hover {color:Yellow;}

.K {Activities Blog - Name And Links}
div.activityMiniFeedModule div.moduleBody ul.activities li.activityItem.BlogAdd a {color:LightSlateGray;}
div.activityMiniFeedModule div.moduleBody ul.activities li.activityItem.BlogAdd a:hover {color:LightSteelBlue;}

.K {Activities Musik - Name And Links}
div.activityMiniFeedModule div.moduleBody ul.activities li.activityItem.ProfileSongAdd a {color:Green;}
div.activityMiniFeedModule div.moduleBody ul.activities li.activityItem.ProfileSongAdd a:hover {color:Olive;}

.K {Activities Video - Name And Links}
div.activityMiniFeedModule div.moduleBody ul.activities li.activityItem.ProfileVideoUpdate a {color:Gold;}
div.activityMiniFeedModule div.moduleBody ul.activities li.activityItem.ProfileVideoUpdate a:hover {color:Goldenrod;}

Activities Module - TEXT:

.K {Activities Dates}
div.activityMiniFeedModule div.moduleBody ul.activitiesContainer li h4.dateHeader {color:Chocolate;}

.K {Activities Musik - by}
div.activityMiniFeedModule div.moduleBody ul.activities h5.activityFooter {color:LightSalmon;}

.K {Activities Text}
div.activityMiniFeedModule div.moduleBody ul.activities li h5.activityHeader {color:BurlyWood;}

Activities Module - Background:

.K {Change Background Color Of Activities}
div.activityMiniFeedModule div.moduleBody {background-color:red;} {background-color:red;}

.K {Add Background Image To Activities}
div.activityMiniFeedModule div.moduleBody {background-image:url(Your Image URL);}

.K {Change Background Color Of Activities Date}
div.activityMiniFeedModule div.moduleBody ul.activitiesContainer li h4.dateHeader {background-color:SlateBlue;}

.K {Three-Color Activities Module}
div.activityMiniFeedModule div.moduleBody {background-color:SteelBlue;}
div.activityMiniFeedModule div.moduleBody ul.activitiesContainer li.odd {background-color:SlateGray;}
div.activityMiniFeedModule div.moduleBody ul.activitiesContainer li.even {background-color:Silver;}

Activities Module Borders:

.K {Hide Activities Top And Bottom Borders}
div.activityMiniFeedModule div.moduleTop, div.activityMiniFeedModule div.moduleBottom {display:none;}

.K {Hide Activities Left And Right Borders}
div.activityMiniFeedModule div {border:0px;}

.K {Activities Borders}
div.activityMiniFeedModule {border:3px solid red;}

Rounded Activities Borders - FF & SA:

.K {Rounded Activities Borders}
div.activityMiniFeedModule {border:3px solid red;
-moz-border-radius:10px; -webkit-border-radius:10px;}

Scrollable Activities:

.K {Scrollable Activities}
div.activityMiniFeedModule div.moduleBody {overflow:auto; height:100px;}

2009-03-26T10:46:00.000-07:00

Status & Mood Module

Status And Mood Module: NEW Module

Tom's Blog - New Module: Status/Mood

.K {Hide Status And Mood}
div.statusMoodModule {display:none;}

Custom Image/Button For View More:

Image For View More Status

Status And Mood Module Header:

.K {Hide Status And Mood Header}
div.statusMoodModule h3.moduleHead {display:none;}

.K {Center Status And Mood Header}
div.statusMoodModule h3.moduleHead {text-align:center;}

.K {Hide Status And Mood Main Title}
div.statusMoodModule h3.moduleHead span span {display:none;}

.K {Change Color Of Status And Mood Header}
div.statusMoodModule h3.moduleHead span span {color:red;}

.K {Transparent Background Of Status And Mood Header}
div.statusMoodModule h3.moduleHead {background-color:transparent;}

.K {Change Background Color Of Status And Mood Header}
div.statusMoodModule h3.moduleHead {background-color:yellow;}

.K {Add Background Image To Status And Mood Header}
div.statusMoodModule h3.moduleHead {background-image:url(Your Image URL);}

Status And Mood Module Text/Font:

.K {Change Color Of Names}
div.statusMoodModule div.moduleBody ul.statusMood li h5.activityHeader a {color:yellow;}

.K {Change Color Of Status}
div.statusMoodModule div.moduleBody ul.statusMood li h5.activityHeader {color:red;}

.K {Change Color Of Moods}
div.statusMoodModule div.moduleBody ul.statusMood li h5.activityFooter span.moodLabel {color:green;}

.K {Change Color Of Moods Text}
div.statusMoodModule div.moduleBody ul.statusMood li h5.activityFooter {color:pink;}

.K {Change Color Of Times And Dates}
div.statusMoodModule div.moduleBody ul.statusMood li span.date {color:purple;}

.K {Hide Just Names}
div.statusMoodModule div.moduleBody ul.statusMood li h5.activityHeader a {display:none;}

.K {Hide Just Moods}
div.statusMoodModule div.moduleBody ul.statusMood li h5.activityFooter span.moodLabel {display:none;}

.K {Hide Just Mood Images}
div.statusMoodModule div.moduleBody ul.statusMood li img {display:none;}

.K {Hide Just Times And Dates}
div.statusMoodModule div.moduleBody ul.statusMood li span.date {display:none;}

.K {Center Align Status And Mood Sections Text}
div.statusMoodModule div.moduleBody ul.statusMood li {text-align:center;}

.K {Center Align Just Names And Status}
div.statusMoodModule div.moduleBody ul.statusMood li h5.activityHeader {text-align:center;}

Status And Mood Module - Background:

.K {Transparent Status And Mood Sections}
div.statusMoodModule div.moduleBody ul.statusMood li {background-color:transparent;}

.K {Change Background Color Of Status And Mood Sections}
div.statusMoodModule div.moduleBody ul.statusMood li {background-color:red;}

.K {Add Background Image To Status And Mood Sections}
div.statusMoodModule div.moduleBody ul.statusMood li {background-color: transparent;}
div.statusMoodModule div.moduleBody {background-image:url(Your Image URL);}

.K {Two-Color Status And Mood Module}
div.statusMoodModule div.moduleBody ul.statusMood li {background-color:yellow;}
div.statusMoodModule h5.activityHeader {background-color:red;}

.K {Three-Color Status And Mood Module}
div.statusMoodModule div.moduleBody ul.statusMood li.even {background-color:yellow;}
div.statusMoodModule div.moduleBody ul.statusMood li.odd {background-color:purple;}
div.statusMoodModule h5.activityHeader {background-color:red;}

Status And Mood Module - View More:

.K {Hide View More - Status And Mood}
div.statusMoodModule div.toolbar ul.links li a {display:none;}

.K {Change Color Of View More}
div.statusMoodModule div.toolbar ul.links li a {color:red;}
div.statusMoodModule div.toolbar ul.links li a:hover {color:yellow;}

.K {Change Background Color Of View More}
div.statusMoodModule div.toolbar ul.links {width:96%; background-color:red;}

⇑⇒ OR:

.K {Change Background Color Of View More}
div.statusMoodModule div.toolbar {float:right; background-color:red;}

.K {Add Background Image To View More}
div.statusMoodModule div.toolbar ul.links {width:96%; background-image:url(Your Image URL);}

⇑⇒ OR:

.K {Add Background Image To View More}
div.statusMoodModule div.toolbar {float:right; background-image:url(Your Image URL);}

.K {Add A Background Image Just To View More}
div.statusMoodModule div.toolbar ul.links {width:100px; height:30px;}
div.statusMoodModule div.toolbar ul.links li {width:100px; height:30px;
background-color:transparent; background-image:url(Your Image URL);}

Custom Image/Button For View More

Status And Mood Module Borders:

.K {Hide Status And Mood Top And Bottom Borders}
div.statusMoodModule div.moduleTop, div.statusMoodModule div.moduleBottom {display:none;}

.K {Hide Status And Mood Left And Right Borders}
div.statusMoodModule div {border:0px;}

.K {Status And Mood Borders}
div.statusMoodModule {border:3px solid red;}

Rounded Status And Mood Borders - FF & SA:

.K {Rounded Status And Mood Borders}
div.statusMoodModule {border:3px solid red;
-moz-border-radius:10px; -webkit-border-radius:10px;}

Scrollable Status And Mood:

.K {Scrollable Status And Mood}
div.statusMoodModule div.moduleBody {overflow:auto; height:100px;}

2009-01-20T20:06:00.000-08:00

Create Hover Effect And Text/Image Rollover On Your Profile Name:

Descriptions:

With the following code you can replace your "Profile Name" with a "Link Text" on your profile page,
and when the mouse hovers over it, a hidden "Text and Graphic" will show up.
In addition, your Profile Name will be clickable, and you can link it to your home page or another web site.

Mit dem folgenden Code kannst du deinen "Profil-Namen" durch einen "Link Text" ersetzen, so daß wenn mit
der Maus darüber gerollt wird, ein verborgener "Text und Graphik" erscheint.
Außerdem kannst du den Profil-Namen mit deiner Homepage oder die Seite deiner Wahl verlinken.

Step 1): Inserting The (New!) Profile Name:
Add the below HTML code in your "About Me" section:

<div class="KhAkRoll">
<a href="PAGE URL">KhAk's Help
<span class="KhAk">
Welcome To My Page<br />
<img src="IMAGE URL">
</span>
</a>
</div>

Instruction:

- Replace the "Profile Name and Welcome Message" with your own "Words".
- Replace "URLs" with your own before you click on the "Save Changes" button.

Step 2): Format And Position The Profile Name And Its Rollover Content:
Add the below code in your Field:

.KhAk {Hide Def. Profile Name}
div.basicInfoDetails h2 {visibility:hidden;
margin-bottom:50px;}

.KhAk {Format The New Profile Name}
div.KhAkRoll a {
display:block; padding-left:5px;
position:absolute; left:50%;
top:230px; margin-left:-275px;
height:30px; width:200px;
background-color:Black; color:White;
font-family:Arial Black;
font-size:24px;
line-height:27px;
text-decoration:none;
z-index:9;
}
.KhAk {Profile Name Hover Effect}
div.KhAkRoll a:hover {
background-color:DarkGreen; color:Yellow;
}

.KhAk {Profile Name Rollover Content}
a span.KhAk {display:none;}
a:hover span.KhAk {
display:block; position:absolute; left:50%;
top:40px; margin-left:60px;
width: 220px; height: 150px;
font-family:Arial Black;
font-size:14px;
color: Black;
z-index:9;
}

Instruction:

☼- Change the Numbers "230 And -275" to move your "Name" up/down And left/right.
☼- Adjust the number "200" to the length/width of your "Name".
☼- Change the Values to format your "Name".

☼- Change the Numbers "40 And 60" to move the "Appearing Content" up/down And left/right.
☼- Adjust the numbers "220 And 150" to the width/height of the "Appearing Content".
☼- Change the Values to format "Appearing Text/Welcome Message".

Note: (Firefox 2 User)

You will have a problem in Firefox Version 2 with the stack order of inserted Name and Basic Info
(z-index + position), and the Hover/Rollover won't work.
However, the Code will work perfectly with Firefox 3 and Internet Explorer.

Du wirst in Firefox 2 ein Problem mit der Layer Anordnung des eingefügten Namen und Basic Info haben
(z-index + position) und das Hover/Rollover wird nicht funktionieren.
Der Code wird allerdings in Firefox 3 und Internet Explorer einwandfrei funktionieren.

Enjoy!

2009-01-11T16:29:00.000-08:00

Replace The Myspace Online Now Icon With Your Own:

Basic Info's Online Now Icon:

This Image will appear 'ONLY' on your profile page. The Myspace 'DEFAULT' Icon will be the one that appears furthermore everywhere on Myspace.

Dies Bild wird 'NUR' auf deiner Profil-Seite erscheinen und das Myspace 'STANDARD' -Icon wird weiterhin überall auf Myspace zu sehen sein.

Step 1):

Home >> Account Settings >> Privacy
Mein Myspace >> Account Einstellungen >> Datenschutz

Step 2): Add the below code in your Field:

.KhAk {Custom Basic Info Online Now}
div.basicInfoDetails div.profileDemographics span.msOnlineNow {display:block;
width:70px; height:30px;
background-image: url(Image URL);
background-repeat:no-repeat;
background-position: top left;
}
div.basicInfoDetails div.profileDemographics span.msOnlineNow img {display:none;}
div.basicInfoDetails div.profileDemographics span.msOnlineNow {font-size:0px;
word-spacing:-1000px; letter-spacing:-1000px;}

Instruction:

☼- Change the Numbers 70/30 to the width/height of your icon.
☼- Replace "Image URL" with your own icon URL.

☼- Ändere die Zahlen 70/30 in die Breite/Höhe deines Icons.
☼- Ersetze "Image URL" mit deiner eigenen Icon-URL.

° Tiny Ninja Theme °

2008-12-22T04:56:00.001-08:00

Set The Number Of Friends Shown Per Row

Description:

With the following codes you would be able to set the number of "Friends Pics" per row, less than
default setting (5), and in addition vertically scroll the "Friend's Rows" on your friends module.

The friends pics are center aligned in my codes.
Change the red number to "0" if you wish to left align the pics.
The yellow number sets the height of the vertical scrollbar.

Mit den folgenden Codes kannst du die Anzahl der Freunde pro Reihe weniger als Myspace Standard (5)
setzen, und zusätzlich noch die "Bilderreihen" auf dem Modul vertikal scrollen lassen.

Die Bilder der Freunde sind in meinem code zentriert ausgerichtet.
Ändere die rote zahl in "0" wenn du sie links auszurichten möchtest.
Die gelbe Zahl definiert die Höhe des vertikalen scrollbalkens.

One Friend Pic Per Row:

.KhAk {One Friend Per Row}
div.friendSpaceModule div.moduleBody ol.moduleList.clearfix {
padding-left:240px; width:120px;}
div.friendSpaceModule div.moduleBody ol.moduleList.clearfix li {height:auto;}

Scrollable One Friend Pic Per Row:

.KhAk {Scrollable One Friend Per Row}
div.friendSpaceModule div.moduleBody ol.moduleList.clearfix li {height:auto;}
div.friendSpaceModule div.moduleBody ol.moduleList.clearfix {
padding-left:210px; padding-right:20px;
overflow-y:auto; overflow-x:hidden;
width:120px; height:120px;}

Two Friends Pics Next To Each Other Per Row:

.KhAk {Two Friends Per Row}
div.friendSpaceModule div.moduleBody ol.moduleList.clearfix {
padding-left:160px; width:240px;}
div.friendSpaceModule div.moduleBody ol.moduleList.clearfix li {height:auto;}

Scrollable Two Friends Pics Next To Each Other Per Row:

.KhAk {Scrollable Two Friends Per Row}
div.friendSpaceModule div.moduleBody ol.moduleList.clearfix li {height:auto;}
div.friendSpaceModule div.moduleBody ol.moduleList.clearfix {
padding-left:160px; padding-right:20px;
overflow-y:auto; overflow-x:hidden;
width:240px; height:120px;}

Three Friends Pics Next To Each Other Per Row:

.KhAk {Three Friends Pic Per Row}
div.friendSpaceModule div.moduleBody ol.moduleList.clearfix {
padding-left:120px; width:360px;}
div.friendSpaceModule div.moduleBody ol.moduleList.clearfix li {height:auto;}

Scrollable Three Friends Pics Next To Each Other Per Row:

.KhAk {Scrollable Three Friends Per Row}
div.friendSpaceModule div.moduleBody ol.moduleList.clearfix li {height:auto;}
div.friendSpaceModule div.moduleBody ol.moduleList.clearfix {
padding-left:120px; padding-right:20px;
overflow-y:auto; overflow-x:hidden;
width:360px; height:120px;}

Four Friends Pics Next To Each Other Per Row:

.KhAk {Four Friends Per Row}
div.friendSpaceModule div.moduleBody ol.moduleList.clearfix {
padding-left:60px; width:480px;}
div.friendSpaceModule div.moduleBody ol.moduleList.clearfix li {height:auto;}

Scrollable Four Friends Pics Next To Each Other Per Row:

.KhAk {Scrollable Four Friends Per Row}
div.friendSpaceModule div.moduleBody ol.moduleList.clearfix li {height:auto;}
div.friendSpaceModule div.moduleBody ol.moduleList.clearfix {
padding-left:60px; padding-right:20px;
overflow-y:auto; overflow-x:hidden;
width:480px; height:120px;}

2008-12-21T23:05:00.000-08:00

Blurbs: Create New Sections!

Create And Position New Modules:

Create New Module

Creating Blurbs Sub Headers: [1]

Add this code at the very end of your "About Me" or "Meet" section: You can put it at the end of both sections and do it several times.


   




    

   
   <br /><br />   
   
    <div class="KhAkBlurbs">
   
     <h4>New Title Here:</h4>
   
    New Content Here
   
   </div>

  
    

      







 
   Creating Blurbs Main & Sub Headers:  [2]
  
  
   



    
  
 Add this code at the very end of your "Meet" section:
 
  
   




    


   
   <br /><br />   
   
    <div class="KhAkBlurbs">




     <h3 class="moduleHead" style="display:block;">
   
  <span><span>Blurbs II</span></span></h3>



        <div class="moduleBody">





         <h4 class="blurbAboutMe" style="display:block;">About me II:</h4>
   
        Content Here


    


     <h4 class="blurbLikeToMeet" style="display:block;">Who I'd like to meet II:</h4>
   
    Content Here
        


   </div></div>


   

     

       



 
   Note:

  
     

If you want to modify/replace the Blurbs headers with your own custom headers, put the 

above code at the top of your "About Me" section and the below code in your  field:
   

          

.K {Hide Blurbs Titles}
   
 div.blurbsModule h3.moduleHead {display:none;}
   
div.blurbsModule div.blurbAboutMe h4 {display:none;} 
   
div.blurbsModule div.blurbLikeToMeet h4 {display:none;} 




  

    

The "Header" you don't need can be deleted from the "Codes".
  
   

          






      

    
      
        
          









  
   
 
   
   
 
   
   
 
   
     
      
       
         

           







 
   Styling The New Sections:   Different Colors Than Main Blurbs Module
  
  
   



     .K {Change Background Color of New Blurbs}
   
 div.blurbsModule div.KhAkBlurbs {background-color:beige;} 
  
   


     .K {Change Color of Blurbs II Header}
   
 div.blurbsModule div.KhAkBlurbs h3.moduleHead span span {
color:yellow;}
  
   


   .K {Change Background Color of Blurbs II Header}
 
 div.blurbsModule div.KhAkBlurbs h3.moduleHead {background-color:red;}
  
   


   .K {Change Color of Blurbs II Sub Headers}
 
 div.blurbsModule div.KhAkBlurbs h4 {color:red;}
  
   



   .K {Change Text Color of Blurbs II}
 
 div.blurbsModule div.KhAkBlurbs div.moduleBody {color:purple;}

Interests: Create New Sections!

Creating Interests Sub Headers: [1]

Add this code at the very end of one of your interest's sections:


   





    

   
   <br /><br />   
   
    <div class="KhAkInterests">
   
     <h4>New Title Here:</h4>
   
    New Content Here
   
   </div>

  
    

      







 
   Creating Interests Main & Sub Headers:  [2]
  
  
   






    
 
Add this code at the very end of your last used interest's sections:
 
  
   




    


   
   <br /><br />   
   
    <div class="KhAkInterests">
   
     <h3 class="moduleHead">



   
  <span><span>Interests II</span></span></h3><br />
   
       <div class="moduleBody">



   
         <h4>General II</h4>
   
        Content Here
    



   
     <h4>Music II</h4>
   
    Content Here
        


   </div></div>


   

     

 

          






      

    
      
        
          









  
   
 
   
   
 
   
   
 
   
     
      
       
         

           







 
   Styling The New Sections:   Different Colors Than Main Interests Module
  
  
   



     .K {Change Background Color of New Interests}
   
 div.interestsModule div.KhAkInt {background-color:beige;} 
  
   


     .K {Change Color of Interests II Header}
   
 div.interestsModule div.KhAkInt h3.moduleHead span span {
color:yellow;}
  
   


   .K {Change Background Color of Interests II Header}
 
 div.interestsModule div.KhAkInt h3.moduleHead {background-color:red;}
  
   


   .K {Change Color of Interests II Sub Headers}
 
 div.interestsModule div.KhAkInt h4 {color:red;}
  
   



   .K {Change Text Color of Interests II}
 
 div.interestsModule div.KhAkInt div.moduleBody {color:purple;}

2008-12-18T22:59:00.000-08:00

Wrap Text Around Images Using CSS:

You will never have an absolutely perfect "padding" around the image
since words have variable length.

Ein Perfekter "Abstand" um das Bild wirst du nie haben, da die Wörter variable Länge haben.

CSS Padding Properties: Description

- Setting all of the padding properties in one declaration:
... {padding: 1px 2px 3px 4px; } =↓ Padding-top, padding-right, padding-bottom, padding-left

Text Wrap Around Image: Float Left

Add the below code in your Field:

.K {Image Text Wrap}
.KhAkLeft {
float:left; padding: 0px 10px 0px 0px;
}

Add the below code in your Interests/Blurbs:

<img class="KhAkLeft" src="Image URL" />
your text here
your text here
your text here
etc.

Text Wrap Around Image: Float Right

Add the below code in your Field:

.K {Image Text Wrap}
.KhAkRight {
float:Right; padding: 0px 0px 0px 10px;
}

Add the below code in your Interests/Blurbs:

<img class="KhAkRight" src="Image URL" />
your text here
your text here
your text here
etc.

2008-12-17T18:45:00.000-08:00

URL & Links Images

Description :

The Dimension Of Images used in my test/code:
width = 200px
height = 30px

Replace "Your Image URL"-s with your own.

CSS Background Properties

Image For Myspace URL:

.KhAk {Image For URL}
div.basicInfoModule ul.contactLinks {padding-left: 310px;}
div.basicInfoModule span.urlLink {display:block; position: relative; top:-20px;
width:220px; padding-left:200px; margin-bottom:-10px;}
div.basicInfoModule span.urlLink a {display:block; font-size:0px; word-spacing:-1000px;
letter-spacing:-1000px; width:200px; height:30px; background-color:transparent;
background-image:url(Your Image URL); background-repeat:no-repeat; background-position:center;}

Images For Contact Links:

.KhAk {Images For Contact Links}
div.basicInfoModule ul.contactLinks li {padding-left: 50px; margin-bottom:-5px;}

.KhAk {Image For Send Message}
div.basicInfoModule ul.contactLinks li.message a {display:block; font-size:0px;
word-spacing:-1000px; letter-spacing:-1000px; width:200px; height:30px;
background-color:transparent; background-image:url(Your Image URL);
background-repeat:no-repeat; background-position:center;}

.KhAk {Image For Add To Friends}
div.basicInfoModule ul.contactLinks li.addToFriends a {display:block; font-size:0px;
word-spacing:-1000px; letter-spacing:-1000px; width:200px; height:30px;
background-color:transparent; background-image:url(Your Image URL);
background-repeat:no-repeat; background-position:center;}

.KhAk {Image For Add Comment}
div.basicInfoModule ul.contactLinks li.comment a {display:block; font-size:0px;
word-spacing:-1000px; letter-spacing:-1000px; width:200px; height:30px;
background-color:transparent; background-image:url(Your Image URL);
background-repeat:no-repeat; background-position:center;}

Adjust the number (50) for the gap to the right side of page.

Background Image For Contact Links:

To add a simple background image to the "Contact Links" use the below code:

.KhAk {Background Image For Contackt Links}
div.basicInfoModule ul.contactLinks {text-align:left; padding-left:10px;
background-image:url(Your Image URL);
background-repeat:no-repeat; background-position:center;}

Hide Contact Links/Images - Message, Add, Commtent:

.KhAk {Hide Contact Links Images}
div.basicInfoModule ul.contactLinks li.message a,
div.basicInfoModule ul.contactLinks li.addToFriends a,
div.basicInfoModule ul.contactLinks li.comment a {background-image:none;}

.KhAk {Hide Contact Links Text}
div.basicInfoModule ul.contactLinks li {padding-left:280px; margin-bottom:-10px;}
div.basicInfoModule ul.contactLinks li.message a,
div.basicInfoModule ul.contactLinks li.addToFriends a,
div.basicInfoModule ul.contactLinks li.comment a {
display:block; width:25px; height:20px; font-size:0px; line-height:18px;
word-spacing:-1000px; letter-spacing:-1000px; background-repeat:no-repeat;}

Adjust the number (280) for the gap to the right side of page.

Replace Mood And Online Now Icons With Your Own:

Custom Mood Icon

Custom Online Now Icon

Images For Page Links (View My: Photos, Videos, Blog, Playlists):

Description :

The Dimension Of Images used in my test/code:
width = 30px
height = 30px

Replace "Your Image URL"-s with your own.

.KhAk {Images For Page Links}
div.basicInfoDetails div.pageLinks ul {white-space:nowrap;}

.KhAk {Image For Photos And Blog}
div.basicInfoDetails div.pageLinks li.odd a {display:block; font-size:0px;
word-spacing:-1000px; letter-spacing:-1000px; width:30px; height:30px;
background-color:transparent; background-image:url(Your Image URL);
background-repeat:no-repeat; background-position:top center;}

.KhAk {Image For Videos}
div.basicInfoDetails div.pageLinks li.even a {display:block; font-size:0px;
word-spacing:-1000px; letter-spacing:-1000px; width:30px; height:30px;
background-color:transparent; background-image:url(Your Image URL);
background-repeat:no-repeat; background-position:top center;}

.KhAk {Image For Playlists}
div.basicInfoDetails div.pageLinks li.even.last a {display:block; font-size:0px;
word-spacing:-1000px; letter-spacing:-1000px; width:30px; height:30px;
background-color:transparent; background-image:url(Your Image URL);
background-repeat:no-repeat; background-position:top center;}

Image For View More - Status And Mood Module:

.KhAk {Image For View More Status}
div.statusMoodModule div.toolbar ul li a {display:block; width:200px; height:30px;
font-size:0px; word-spacing:-1000px; letter-spacing:-1000px;
background-color:transparent; background-image:url(Your Image URL);
background-repeat:no-repeat; background-position:center;}

Images For View All Friends:

.KhAk {Image For View All Friends}
div.friendSpaceModule div.toolbar ul.links li a {display:block; font-size:0px; word-spacing:-1000px;
letter-spacing:-1000px; width:200px; height:30px; background-color:transparent;
background-image:url(Your Image URL); background-repeat:no-repeat; background-position:center;}

Add Your Own View All Friends Link

Images For Subscribe | View XX's Blog:

Description:

The Dimension Of Images used in my test/code:
width = 140px
height = 30px

Replace "Your Image URL"-s with your own.

Image For View XX's Blog:

.KhAk {Image For View XXs Blog}
div.blogsModule div.toolbar ul.links li.last a {display:block;
font-size:0px; word-spacing:-1000px; letter-spacing:-1000px;
width:140px; height:30px;
background-color:transparent; background-image:url(Your Image URL);
background-repeat:no-repeat; background-position:center;}

Image For Subscribe:

.KhAk {Image For Subscribe}
div.blogsModule div.toolbar ul.links li a {display:block;
font-size:0px; word-spacing:-1000px; letter-spacing:-1000px;
width:140px; height:30px;
background-color:transparent; background-image:url(Your Image URL);
background-repeat:no-repeat; background-position:center;}

NOTE:

If you want to add only an image for "Subscribe",
take the code below in addition:

.KhAk {Recreate View XXs Blog Link}
div.blogsModule div.toolbar ul.links li.last a {display:block; font-size:10px;
word-spacing:1px; letter-spacing:0px; background-image:none;}

2008-12-10T07:46:00.000-08:00

Flip Friends Comments

Flipped Friends Comments:

.KhAk {Flipped Comments}
div.commentsModule ul.moduleList li.odd div.user {float:right;}
div.commentsModule ul.moduleList li.odd div.userComment {margin-right:140px; margin-left:0px;}

div.commentsModule ul.moduleList li.even div.user {float:right;}
div.commentsModule ul.moduleList li.even div.userComment {margin-right:140px; margin-left:0px;}

ZigZag Friends Comments

ZigZagged Friends Comments:

.KhAk {ZigZagged Comments}
div.commentsModule ul.moduleList li.even div.user {float:right;}
div.commentsModule ul.moduleList li.even div.userComment {margin-right:140px; margin-left:0px;}

2008-12-03T01:29:00.000-08:00

Headlines Pictures

Instruction:

Change the number "35" to the height of Your Picture.

Adjust "15/-15" for the gap between replaced header and all below it.

Change "transparent" to whatever header background color you wish (Optional).

Replace "Your Image URL" with your own header picture URL.

Profile Name:

.K {Profile Name Pic}
div.basicInfoDetails h2 {display:block; height:35px;
font-size:0px; word-spacing:-1000px; letter-spacing:-1000px;
margin-bottom:15px;
background-color:transparent;
background-image:url(Your Image URL);
background-repeat:no-repeat;}

Status And Mood Module:

.K {Status And Mood Header Pic}
div.statusMoodModule h3.moduleHead span span {display:none;}
div.statusMoodModule h3.moduleHead {height:35px;
margin-bottom:15px;
background-color:transparent;
background-image:url(Your Image URL);
background-repeat:no-repeat;}

Profile Player Module:

.K {Player Header Pic}
div.musicPlayerModule h3.moduleHead {display:block; width:290px;}
div.musicPlayerModule h3.moduleHead span span {display:none;}
div.musicPlayerModule h3.moduleHead {height:35px;
margin-bottom:15px;
background-color:transparent;
background-image:url(Your Image URL);
background-repeat:no-repeat;}

Interests Module:

.K {Interests Header Pic}
div.interestsModule h3.moduleHead span span {display:none;}
div.interestsModule h3.moduleHead {height:35px;
margin-bottom:-15px;
background-color:transparent;
background-image:url(Your Image URL);
background-repeat:no-repeat;}

Details Module:

.K {Details Header Pic}
div.detailsModule h3.moduleHead span span {display:none;}
div.detailsModule h3.moduleHead {height:35px;
margin-bottom:-15px;
background-color:transparent;
background-image:url(Your Image URL);
background-repeat:no-repeat;}

Schools Module:

.K {Schools Header Pic}
div.schoolsModule h3.moduleHead span span {display:none;}
div.schoolsModule h3.moduleHead {height:35px;
margin-bottom:-15px;
background-color:transparent;
background-image:url(Your Image URL);
background-repeat:no-repeat;}

Companies Module:

.K {Companies Header Pic}
div.companiesModule h3.moduleHead span span {display:none;}
div.companiesModule h3.moduleHead {height:35px;
margin-bottom:-15px;
background-color:transparent;
background-image:url(Your Image URL);
background-repeat:no-repeat;}

Networking Module:

.K {Networking Header Pic}
div.networkingModule h3.moduleHead span span {display:none;}
div.networkingModule h3.moduleHead {height:35px;
margin-bottom:-15px;
background-color:transparent;
background-image:url(Your Image URL);
background-repeat:no-repeat;}

Blogs Module:

.K {Blogs Header Pic}
div.blogsModule h3.moduleHead span span {display:none;}
div.blogsModule h3.moduleHead {height:35px;
margin-bottom:-15px;
background-color:transparent;
background-image:url(Your Image URL);
background-repeat:no-repeat;}

Blurbs Module:

Blurbs Header:

.K {Blurbs Header Pic}
div.blurbsModule h3.moduleHead span span {display:none;}
div.blurbsModule h3.moduleHead {height:35px;
margin-bottom:-15px;
background-color:transparent;
background-image:url(Your Image URL);
background-repeat:no-repeat;}

About Me Header:

.K {About Me Header Pic}
div.blurbsModule div.blurbAboutMe h4 {display:block; height:35px;
font-size:0px; word-spacing:-1000px; letter-spacing:-1000px;
margin-bottom:15px;
background-color:transparent;
background-image:url(Your Image URL);
background-repeat:no-repeat;}

Meet Header:

.K {Meet Header Pic}
div.blurbsModule div.blurbLikeToMeet h4 {display:block; height:35px;
font-size:0px; word-spacing:-1000px; letter-spacing:-1000px;
margin-bottom:15px;
background-color:transparent;
background-image:url(Your Image URL);
background-repeat:no-repeat;}

Calendar Module:

.K {Calendar Header Pic}
div.calendarModule h3.moduleHead span span {display:none;}
div.calendarModule h3.moduleHead {height:35px;
margin-bottom:-15px;
background-color:transparent;
background-image:url(Your Image URL);
background-repeat:no-repeat;}

Friends Module:

.K {Friends Header Pic}
div.friendSpaceModule h3.moduleHead span span {display:none;}
div.friendSpaceModule h3.moduleHead {height:35px;
margin-bottom:-15px;
background-color:transparent;
background-image:url(Your Image URL);
background-repeat:no-repeat;}

Comments Module:

.K {Comments Header Pic}
div.commentsModule h3.moduleHead span span {display:none;}
div.commentsModule h3.moduleHead {height:35px;
margin-bottom:-15px;
background-color:transparent;
background-image:url(Your Image URL);
background-repeat:no-repeat;}

Profile Application Module:

.K {Application Header Pic}
div.mdpapplicationModule h3.moduleHead span span {display:none;}
div.mdpapplicationModule h3.moduleHead {height:35px;
margin-bottom:15px;
background-color:transparent;
background-image:url(Your Image URL);
background-repeat:no-repeat;}

Profile Video Player Module:

.K {Video Player Header Pic}
div.videoPlayerModule h3.moduleHead {display:block;}
div.videoPlayerModule h3.moduleHead span span {display:none;}
div.videoPlayerModule h3.moduleHead {height:35px;
margin-bottom:15px;
background-color:transparent;
background-image:url(Your Image URL);
background-repeat:no-repeat;}

Profile Video Slider Module:

.K {Video Slider Header Pic}
div.videoSliderModule h3.moduleHead {display:block;}
div.videoSliderModule h3.moduleHead span span {display:none;}
div.videoSliderModule h3.moduleHead {height:35px;
margin-bottom:15px;
background-color:transparent;
background-image:url(Your Image URL);
background-repeat:no-repeat;}

2008-12-03T00:03:00.000-08:00

Create Image Navigation

Classic 1.0 Contact Table For Profile 2.0: ⇒ Code 1 CODE 2 Contact Module

Create Graphical Navigation Bar:

Add the below code in your Field:

.KhAk {Create Image Navigation}
div.basicInfoModule {padding-top:50px;}
.KhAkImgNav{ position:absolute; left:50%; top:0%;
margin-left:-400px; margin-top:200px;
_margin-left:-400px; _margin-top:210px;
width:800px;
text-align:center; white-space:nowrap;}

.KhAkImgNav a img {border: 2px solid; border-color:yellow;}
.KhAkImgNav a:hover img {border: 2px solid; border-color:red;}

Add this (Your Image Links) to your About Me:

Description:

Set "50" to the height you need for your Image Navigation.

Adjust "margin-left and margin-top numbers" to fix the position.

Adjust "_margin-left and _margin-top numbers" to fix the position on Internet Explorer.

Adjust "800" to the width of your image navigation (max. 950px).

Replace the URLs with your own.
You can find HERE a list of contact table URLs.

2008-12-02T06:00:00.000-08:00

Create Navigation

Create Link Navigation:

Add the below code in your Field:

.KhAk {Create Navigation Bar}
div#topnav {display:none;}
div#googlebar {padding-bottom:50px;}
.KhAkNav { position:absolute; left:50%; top:0%;
margin-left:-400px; margin-top:160px;
width:800px; height:22px; _height:28px;
padding-top:4px; text-align:center;
background-color:lightblue; color:green;
border:2px solid; border-color:white;}

.KhAkNav a {color:red; font-family:tahoma; font-size:12px;}
.KhAkNav a:hover {color:yellow; font-family:tahoma; font-size:12px;}

Add this (Your HyperLinks) to your About Me:

<div class="KhAkNav">
<a href="http://home8.myspace.com/index.cfm?fuseaction=user">Home</a>
 | 
<a href="http://mail1.myspace.com/index.cfm?fuseaction=mail.inbox">Mail</a>
 | 
<a href="http://browseusers.myspace.com/Browse/Browse.aspx?z=1">Browse</a>
 | 
<a href="http://khak-myspace.blogspot.com/" target="_blank">KhAk</a>
 | 
<a href="http://search.myspace.com/index.cfm?fuseaction=find">Search</a>
 | 
<a href="http://vids.myspace.com/index.cfm?fuseaction=vids.home">Videos</a>
 | 
<a href="http://music.myspace.com/index.cfm?fuseaction=music">Musik</a>
 | 
<a href="href="http://collect.myspace.com/index.cfm?fuseaction=block.blockUser&userID=YOUR FRIEND ID HERE">BLOCK ME</a>
</div>

Description:

Adjust "margin-left and margin-top numbers" to fix the position.

Adjust "800" to the width of your navigation (max. 950px).

Change "green" to whatever color you wish for navigation separators.

Replace "YOUR FRIEND ID HERE" with Your own.

What's a "Friend ID"?
Look at the adress bar on your profile page.

2008-12-01T01:50:00.001-08:00

Profile 2.0 Middle Area

Profile 2.0 - The Whole Middle Area (Top, Middle, Footer):

Whole Middle Area Transparency :

.K {Transparent Whole Middle Area}
div#header, div#googlebar, div#topnav, div.content, div.content div.moduleBody, div.module div,
div.content h3.moduleHead, div.module div.userComment, div.module li.moduleItem,
div.module div.moduleMid li {background-color:transparent; background-image:none;}
div#topnav ul {border-right:0px;}
div#topnav ul li {border-left: 0px;}

Whole Middle Area Background:

.K {Change Background Color Of Whole Middle Area}
div#header, div#googlebar, div#topnav, div.content, div.content div.moduleBody, div.module div,
div.content h3.moduleHead, div.module div.userComment, div.module li.moduleItem,
div.module div.moduleMid li {background-color:transparent; background-image:none;}
div#topnav ul {border-right:0px;}
div#topnav ul li {border-left: 0px;}
div.wrap {background-color:red;}

.K {Add Background Image To Whole Middle Area}
div#header, div#googlebar, div#topnav, div.content, div.content div.moduleBody, div.module div,
div.content h3.moduleHead, div.module div.userComment, div.module li.moduleItem,
div.module div.moduleMid li {background-color:transparent; background-image:none;}
div#topnav ul {border-right:0px;}
div#topnav ul li {border-left: 0px;}
div.wrap {background-image: url(Your Image URL);}

Profile 2.0 - The Middle Area (Between Top And Footer Area):

Middle Area Transparency :

.K {Transparent Middle Area}
div.content, div.content div.moduleBody, div.module div,
div.content h3.moduleHead, div.module div.userComment,
div.module li.moduleItem,div.module div.moduleMid li {
background-color:transparent; background-image:none;}

Middle Area - Background:

.K {Change Background Color Of Middle Area}
div.content, div.content div.moduleBody, div.module div,
div.content h3.moduleHead, div.module div.userComment,
div.module li.moduleItem,div.module div.moduleMid li {background-color:red;}

.K {Add Background Image To Middle Area}
div.content, div.content div.moduleBody, div.module div,
div.content h3.moduleHead, div.module div.userComment,
div.module li.moduleItem,div.module div.moduleMid li {background-image: url(Your Image URL);}

Profile 2.0 - The Middle Area (Under Top Area, Navigation Bar):

Middle Area Transparency :

.K {Transparent Middle Area}
div.content, div.content div.moduleBody, div.module div,
div.content h3.moduleHead, div.module div.userComment,
div.module li.moduleItem,div.module div.moduleMid li,
div#footer {background-color:transparent; background-image:none;}

Middle Area - Background:

Middle Area Borders:

Profile Borders

2008-11-30T06:23:00.000-08:00

Applications Modules

Applications:

Get A Myspace Application

Manage Your Myspace Applications

Applications Modules:

.K {Hide MS Applications}
div.mdpapplicationModule {display:none}

.K {Hide Applications Header}
div.mdpapplicationModule h3.moduleHead {display:none}

.K {Center Applications Header}
div.mdpapplicationModule h3.moduleHead {text-align:center;}

.K {Hide Applications Main Titles}
div.mdpapplicationModule h3.moduleHead span span {display:none;}

.K {Change Color Of Applications Main Title}
div.mdpapplicationModule h3.moduleHead span span {color:red;}

.K {Transparent Background Of Applications Main Title}
div.mdpapplicationModule h3.moduleHead {background-color:transparent;}

.K {Change Background Color Of Applications Main Title}
div.mdpapplicationModule h3.moduleHead {background-color:red;}

.K {Add Background Image To Applications Main Title}
div.mdpapplicationModule h3.moduleHead {background-image:url(Your Image URL);}

.K Change Applications Background Color}
div.mdpapplicationModule {background-color:red;}

.K {Add Background Image To Applications Under Headers}
div.mdpapplicationModule div.moduleMid2 {background-image:url(Your Image URL);}

.K {Add Background Image To Applications}
div.mdpapplicationModule {background-image:url(Your Image URL);}

Applications Modules Borders:

.K {Hide Applications Top And Bottom Borders}
div.mdpapplicationModule div.moduleTop, div.mdpapplicationModule div.moduleBottom {display:none;}

.K {Hide Applications Left And Right Borders}
div.mdpapplicationModule div {border:0px;}

.K {Applications Borders}
div.mdpapplicationModule {border:3px solid red;}

Rounded Applications Borders - FF & SA:

.K {Rounded Applications Borders}
div.mdpapplicationModule {border:3px solid red;
-moz-border-radius:10px; -webkit-border-radius:10px;}

Scrollable Applications:

.K {Scrollable Applications}
div.mdpapplicationModule div.moduleBody {overflow:auto; height:100px;}

2008-11-28T22:39:00.000-08:00

User Profile Player

Change Skin Of MS Player:
Official Myspace Player's Skins
(Click On The Link Above. ↑
The page gives you options to choose your desired skin.)

Hide Player But Keep Playing Music:

.K {Hide Player But Keep Playing Music}
div.musicPlayerModule {width:100px; height:1px;
position:absolute; top:0px; left:0px;
filter:alpha(opacity=0.00); -moz-opacity:0.00; opacity:0.00;}

Note:
Make sure your "Player" is set to "Autoplay".

Player Module Header:

Überschrift einblenden lassen:

.K {Unhide MS Player Header}
div.musicPlayerModule h3.moduleHead {display: block; margin-bottom:10px; width:290px;}

.K {Center MS Player Title}
div.musicPlayerModule h3.moduleHead {text-align:center;}

.K {Change Color of MS Player Title}
div.musicPlayerModule h3.moduleHead span span {color:red;}

.K {Transparent Background Of Player Header}
div.musicPlayerModule h3.moduleHead {background-color:transparent;}

.K {Change Background Color Of MS Player Header}
div.musicPlayerModule h3.moduleHead {background-color:yellow;}

.K {Add Background Image To MS Player Header}
div.musicPlayerModule h3.moduleHead {background-image:url(Your Image URL);}

User Profile Player Module:

.K {Resize Player Module And Center Player}
div.musicPlayerModule {width:300px; text-align:center;}

.K {Resize And Center Player}
div.musicPlayerModule {text-align:center;}
div.musicPlayerModule object {width:50px; height:51px;}

Note:
You will have only the 'Play/Stop Button' on your profile.
If you have the 'Myspace PlayList Player', adjust the colored numbers.

.K {Hide MS Player Module}
div.musicPlayerModule {display:none;}

.K {Change Background Color Of MS Player Module}
div.musicPlayerModule {background-color:red; width:300px; text-align:center;}

.K {Add Background Image To MS Player Module}
div.musicPlayerModule {background-image:url(Your Image URL); width:300px; text-align:center;}

MS Player And Module Borders:

.K {Add Borders To Player Module}
div.musicPlayerModule {border:3px solid red;}

.K {Add Borders Just To The Player}
div#musicPlayer {border:3px solid red;}
div.musicPlayerModule div.moduleBody {text-align:center;}

Rounded MS Player Module Borders - FF & SA:

.K {Rounded Player Module Borders}
div.musicPlayerModule {border:3px solid red;
-moz-border-radius:10px; -webkit-border-radius:10px;}

Scrollable MS Player Module:

.K {Scrollable Player Module}
div.musicPlayerModule {overflow:auto; height:50px;}

.K {Scrollable Player Module Body}
div.musicPlayerModule div.moduleBody {overflow:auto; height:50px;}

Move User Profile Player

Move User Profile Player:

The following code works with only some of the myspace themes, like:
"No Theme", "Default", "Ninja" and "Happines" ...

.KhAk {Move MS Player}
div.profileLayout div#musicPlayer {
position:absolute; left:50%;
top:240px; margin-left:-60px;
_top:220; _margin-left:-40px;}
div.musicPlayerModule {
width:0px; height:0px;
z-index:9;}

If your are using the myspace "Default" theme, take the below code in addition:

.KhAk {Trabsparent Blue Box}
div.basicInfoDetails div.profileDemographics {
background-color:transparent;}

Instruction:

First:
Adjust "margin-left and top numbers" to fix the position.
Adjust "_margin-left and _top numbers" to fix the position on Internet Explorer.

Then (If you are using Firefox 2 And The Myspace "Default" Theme):
Settings: Miscellaneous ↓
Einstellungen: Verschiedenes ↓

Note:
If You Have The Myspace User Profile Player
With PlayList, Use The Code Below Instead:
(If you are using Firefox 2, you will have a problem with
the stack order of Player and Basic Info.)

.KhAk {Move MS Player}
div.musicPlayerModule object {
position:absolute; left:50%;
top:240px; margin-left:-60px;
_top:220; _margin-left:-40px;
z-index:9;}
div.musicPlayerModule {
width:0px; height:0px;}

If your are using the myspace "Default" theme, take the below code in addition:

.KhAk {Trabsparent Blue Box}
div.basicInfoDetails div.profileDemographics {
background-color:transparent;}

Change Color Of User Profile Player

Create Custom Player Skin

Create Your Own Custom Player Skin:

Normal Size:

.KhAk {Custom Player Skin}
div.musicPlayerModule div.moduleBody {
width:295px; height:51px; text-align:center;
background-image:url(Your Image URL);
background-repeat:repeat-x; background-position:left;}
div.musicPlayerModule object {
width:295px; height:51px;
opacity:0.50; -moz-opacity:0.50; filter:alpha(opacity=50);}

Instruction:

- The images used in my test had a dimension of 295px by 51px (width/height).
A narrow background image will be repeated horizontally (repeat-x).

CSS Background Properties

- Replace Your Image URL with your own.
- Change the numbers 50 similarly for more/less "Player Opacity".

Note:
If You Have The Myspace User Profile Player
With PlayList, Use The Code Below Instead:

.KhAk {Custom Player Skin}
div.musicPlayerModule div.moduleBody {width:296px;
background-image:url(Your Image URL);
background-repeat:repeat; background-position:top left;}
div.musicPlayerModule object {
opacity:0.50; -moz-opacity:0.50; filter:alpha(opacity=50);}

Small Size:

.KhAk {Custom Player Skin}
div.musicPlayerModule div.moduleBody {
width:50px; height:51px; text-align:left;
background-image:url(Your Image URL);
background-repeat:repeat-x; background-position:left;}
div.musicPlayerModule object {
width:50px; height:51px;
opacity:0.50; -moz-opacity:0.50; filter:alpha(opacity=50);}

Profile Player Module Bottom Picture:

Instruction:

- Change the numbers 60 to the height of your image.
- Replace Your Image URL with your own.

2008-11-28T17:09:00.000-08:00

@pfeiffer's Rotational Styled Comments
Rotational Color Of Comments' Text, Links, Dates And Friends Pics Borders & Names In Comments:

Add the below code to your Field:

.pfeiffer {Rotational Color Of Friends Comments}
div.commentsModule div.moduleBody {background-color:ForestGreen;}
div.commentsModule div.moduleBody ul.moduleList li.odd {color:DarkOrange; background-color:Yellow;}
div.commentsModule li.odd div.user a {color:Red; font-weight:bold;}
div.commentsModule li.odd div.user a:hover {color:DarkGray; font-weight:bold;}
div.commentsModule li.odd div.user a img {border:3px solid Red;}
div.commentsModule li.odd div.user a img:hover {border:3px solid DarkGray;}
div.commentsModule li.odd p.datePosted {color:Blue; font-weight:lighter;}
div.commentsModule ul.moduleList li.odd ul.commentsInfo li a {color:Purple;}
div.commentsModule ul.moduleList li.odd ul.commentsInfo li a:hover {color:DeepPink; text-decoration:underline;}
div.commentsModule ul.moduleList li.odd ul.commentsInfo li {border-right: 1px solid LimeGreen; }

div.commentsModule div.moduleBody ul.moduleList li.even {color:Lime; background-color:ForestGreen;}
div.commentsModule li.even div.user a {color:DarkGreen; font-weight:bold;}
div.commentsModule li.even div.user a:hover {color:DarkGray; font-weight:bold;}
div.commentsModule li.even div.user a img {border:3px solid DarkGreen;}
div.commentsModule li.even div.user a img:hover {border:3px solid DarkGray;}
div.commentsModule li.even p.datePosted {color:Aqua; font-weight:lighter;}
div.commentsModule ul.moduleList li.even ul.commentsInfo li a {color:White;}
div.commentsModule ul.moduleList li.even ul.commentsInfo li a:hover {color:LightGrey; text-decoration:underline;}
div.commentsModule ul.moduleList li.even ul.commentsInfo li {border-right: 1px solid Red; }

Two Examples Of How It Will Look Like:

2008-11-28T08:32:00.000-08:00

Three-Color Contact Links:

P E R S I A N

All you have to do is only to replace the colored values with
YOUR OWN COUNTRY's COLOR.

Contact Links Flag (Ger):

Add the below code in your Field:

.KhAk {Contact Links Flag}
div.basicInfoModule ul.contactLinks li.message a {
background-color:black; color:gold;
padding: 5px 50px;
margin: 0px;
}
div.basicInfoModule ul.contactLinks li.addToFriends a {
background-color:red; color:black;
padding: 5px 50px;
margin: 0px;
}
div.basicInfoModule ul.contactLinks li.comment a {
background-color:gold; color:red;
padding: 5px 50px;
margin: 0px;
}
div.basicInfoModule span.urlLink a {
padding: 0px 30px;
margin: 0px;
}

2008-11-28T01:54:00.000-08:00

Three-Color Last Login:

P E R S I A N

All you have to do is only to replace the colored values with
YOUR OWN COUNTRY's COLOR.

Last Login Flag (Ger I):

Add the below code in your Field:

.KhAk {Last Login Flag I}
div.basicInfoDetails li.tags {
background-color:black; color:gold;
padding: 5px 10px;
margin: 0px;
}
div.basicInfoDetails li#adr {
background-color:red; color:black;
padding: 5px 10px;
margin: 0px;
}
div.basicInfoDetails li.lastlogin {
background-color:gold; color:red;
padding: 5px 10px;
margin: 0px;
}

Last Login Flag (Ger II):

Add the below code in your Field:

.KhAk {Last Login Flag II}
div.basicInfoDetails li.tags {
background-color:black; color:gold;
padding: 5px 10px;
margin: 5px;
}
div.basicInfoDetails li#adr {
background-color:red; color:black;
padding: 5px 10px;
margin: 5px;
}
div.basicInfoDetails li.lastlogin {
background-color:gold; color:red;
padding: 5px 10px;
margin: 5px;
}

2008-11-26T18:46:00.000-08:00

Styling Profile Modules

Profile Body:

Font Color:

.K {Profile Text Color}
div.contentMid div.moduleBody {color:red;}

.K {Profile Link Color}
div.contentMid div.moduleBody a {color:yellow;}
div.contentMid div.moduleBody a:hover {color:gold;}

.K {Profile Name Color}
div.basicInfoDetails h2 {color:lightblue;}

.K {Color Of All Headers}
div.content h3.moduleHead {color:maroon;}

.K {Color Of Interests Sub Titles}
div.interestsModule div.moduleBody ul.moduleList li h4 {color:purple;}

.K {Color Of Details Sub Titles}
div.detailsModule div.moduleBody ul.moduleList li strong {color:violet;}

.K {Color Of Blurbs Sub Titles}
div.blurbsModule div.moduleBody div.autoResize h4 {color:pink;}

.K {Hide Blog Dates And Titles}
div.blogsModule ul.moduleList li.clearfix span {color:Khaki;}

.K {Color Of Friends Count}
div.friendSpaceModule div.toolbar span {color:Salmon;}

.K {Color Of Comments Text}
div.commentsModule div.moduleBody div.userComment {color:SeaGreen;}

.K {Color Of Comments Count}
div.commentsModule div.toolbar span {color:green;}

.K {Color Of Comments Date}
div.commentsModule div.moduleBody div.userComment p.datePosted {color:olive;}

Background:

.K {Body Background Color}
body {background-color:red;}

.K {Body Background Image}
body {background-image:url(Your Image URL);}

.K {Transparent White Middle Div}
div.contentMid {background-color:transparent;}

.K {White Middle Div Background Color}
div.contentMid {background-color:red;}

.K {White Middle Div Background Image}
div.contentMid {background-image:url(Your Image URL);}

CSS Background Properties:

Background Properties

Profile Modules:

Hide Modules:

.K {Hide All Modules}
div.content div.module {display:none;}

.K {Hide All Modules Except Basic Info}
div.profileLayout {display:none;}

Profile Modules Background:

.K {Transparent Profile Modules}
div.content, div.content div.moduleBody, div.module div,
div.content h3.moduleHead, div.module div.userComment,
div.module li.moduleItem, div.module div.moduleMid li {background-color:transparent;}

.K {Add Background Color To All Modules}
div.content {background-color:green;}
div.content div.moduleBody, div.module div,
div.content h3.moduleHead, div.module div.userComment,
div.module li.moduleItem,div.module div.moduleMid li {background-color:red;}

.K {Add Background Image To All Modules}
div.content {background-color:green;}
div.content div.moduleBody, div.module div,
div.content h3.moduleHead, div.module div.userComment,
div.module li.moduleItem,div.module div.moduleMid li {background-color:transparent;}
div.content div.moduleBody {background-image: url(Your Image URL);}

Profile Borders:

Profile Borders

All Module Borders:

.K {Remove All Modules Borders}
div.moduleTop, div.moduleBottom {display:none;}
div.module div, div.blogsModule div.moduleBody ul.moduleList,
div.blogsModule div.moduleBody ul.moduleList li {border:0px;}

.K {Add Borders To All Modules}
div.content div.module {border:3px solid red;}

.K {Add Rounded Borders To All Modules - FF & SA}
div.content div.module {border:3px solid red; -moz-border-radius:10px; -webkit-border-radius:10px;}

.K {Add Borders To All Modules Below Headers}
div.content div.moduleBody {border:3px solid yellow;}

.K {Add Rounded Borders To All Modules Below Headers - FF & SA} div.content div.moduleBody {border:3px solid yellow; -moz-border-radius:10px; -webkit-border-radius:10px;}

Profile Headers:

Headlines Pictures:

Headlines Pictures

Headers Background Color/Image:

.K {Change Background Color Of All Headers}
div.content h3.moduleHead, div.basicInfoDetails h2 {background-color:red;}

.K {Add Background Image To All Headers}
div.content h3.moduleHead, div.basicInfoDetails h2 {background-image:url(Your Image URL);}

Aligning Headers:

.K {Center Align Name}
div.basicInfoDetails h2 {text-align:center;}

.K {Right Align Name}
div.basicInfoDetails h2 {text-align:right;}

.K {Center Align All Headers}
div.content h3.moduleHead {text-align:center;}

.K {Right Align All Headers}
div.content h3.moduleHead {text-align:right;}

.K {Center Align Interests Sub Titles}
div.interestsModule div.moduleBody ul.moduleList li h4 {text-align:center;}

.K {Right Align Interests Sub Titles}
div.interestsModule div.moduleBody ul.moduleList li h4 {text-align:right;}

.K {Center Align Details Sub Titles}
div.detailsModule div.moduleBody ul.moduleList li strong {text-align:center;}

.K {Right Align Details Sub Titles}
div.detailsModule div.moduleBody ul.moduleList li strong {text-align:right;}

.K {Center Align Blurbs Sub Titles}
div.blurbsModule div.moduleBody div.autoResize h4 {text-align:center;}

.K {Right Align Blurbs Sub Titles}
div.blurbsModule div.moduleBody div.autoResize h4 {text-align:right;}

All Header Borders:

.K {Add Borders To All Headers}
div.content h3.moduleHead, div.basicInfoDetails h2 { border:3px solid yellow;}

.K {Add Rounded Borders To All Headers - FF & SA}
div.content h3.moduleHead, div.basicInfoDetails h2 {border:3px solid red;
-moz-border-radius:10px; -webkit-border-radius:10px;};}

Scrollable Contents:

Scrollable Entire Profile:

.K {Scrollable Profile}
div.content {overflow:auto; height:500px;}

Scrollable Entire Profile Below Basic Info:

.K {Scrollable Profile}
div.profileLayout {overflow:auto; height:400px;}

2008-11-26T02:54:00.000-08:00

@pfeiffer's Rotational Styled Friends
Rotational Color Of Friends Names And Friends Pics Borders:

Add the below code to your Field:

.pfeiffer {Rotational Color Of Friends Names And Friends Pics Borders}
div.friendSpaceModule li.odd a span {color:brown;}
div.friendSpaceModule li.odd a span:hover {color:crimson;}

div.friendSpaceModule li.odd a img {border:3px solid yellow;}
div.friendSpaceModule li.odd a img:hover {border: 3px solid gold;}

div.friendSpaceModule li.even a span {color:lime;}
div.friendSpaceModule li.even a span:hover {color:green;}

div.friendSpaceModule li.even a img {border: 3px solid olive;}
div.friendSpaceModule li.even a img:hover {border:3px solid olivedrab;}

div.friendSpaceModule li.odd.last a span, div.friendSpaceModule li.even.last a span {color:aqua;}
div.friendSpaceModule li.odd.last a span:hover, div.friendSpaceModule li.even.last a span:hover {color:blue;}

div.friendSpaceModule li.odd.last a img, div.friendSpaceModule li.even.last a img {border: 3px solid violet;}
div.friendSpaceModule li.odd.last a img:hover, div.friendSpaceModule li.even.last a img:hover {border: 3px solid Purple;}

2008-11-26T01:49:00.000-08:00

HowTo Add Codes To Your Profile 2.0

HowTo Go Back To Your Profile 1.0

Note:

This is no longer possible!

~~If you ONLY have upgraded your profile from 1.0 to 2.0, Myspace will save a copy of your 1.0 profile for 90 days so you can play around with 2.0 without worrying about messing up your old profile.~~

Beachte bitte:

Das ist nicht mehr möglich!

~~NUR wenn du von Profil 1.0 auf 2.0 aktualisiert hast, ist dein 1.0-Profil für 90 Tage gespeichert. Du kannst also 2.0 ausprobieren und kannst jederzeit wieder zur alten Version zurück.~~

2008-11-25T12:40:00.000-08:00

Right Align or Center Align Contents I:

Add this to your Field:

.K {Content Alignment}
div.KdAlign1 {text-align: center;}

Add this to your About Me/Interests:

Content Here / Inhalt Hier <br />
<img src="Your Image URL">

</div>

Instruction:

If you want to use the code at the different places,
for the next container change the numbers "1" to 2, 3, 4, etc. voilà!

To right align contents, change "center" to right.

"div"s can be also replaced with "p"s (like the example below).

Right Align or Center Align Contents II:

Add this to your Field:

.K {Content Alignment}
p.KpAlign1 {text-align: center;}

Add this to your About Me/Interests:

This is a paragraph.<br />
The paragraph will be center-aligned.

</p>

Set The Left Margin Of Contents:

Add this to your Field:

.K {Content Alignment}
div.KMargin1 {width: 200px;
margin-left:150px;}

Add this to your About Me/Interests:

Content Here / Inhalt Hier <br />
<img src="Your Image URL">

</div>

Instruction:

If you want to use the code at the different places,
for the next container change the numbers "1" to 2, 3, 4 etc. voilà!

Change the number "200" to the width of your content.

"150" sets the "Distance" of elements to the left side of the page/neighbour element.

2008-11-25T09:19:00.000-08:00

@pfeiffer's Custom Mood Icon
Replace The Myspace Mood Icon With Your Own:

Add the below code in your Field:

.pfeiffer {Custom Mood Icon} div.basicInfoDetails span.mood img { width:25px; height:25px; background-image: url(ICON URL); background-repeat:no-repeat; background-position: center center; }






 
   Instruction:
     
   
    ☼- Bei Myspace Mood "kein" Icon auswählen.

     ☼- Choose "none" as Myspace def. mood setting.
   
     
  
   Set the numbers to the width/height of your ICON.

    Replace "ICON URL" with your own Icon URL.



2008-11-25T07:55:00.000-08:00





    

      








 
  Positioning Contents Via DIV (Container): 

   
        

 
   Add this to your  Field:
     


  .K {Create And Position A Div} 
 


div.KhAkDiv1 {

position:absolute; left:50%;

margin-left:-400px; top:200px;

width:200px; height:100px; 

background-color:CadetBlue;

background-image: url(Image URL);

border:3px solid coral;

font-family:Arial;

font-size:8pt;

color:green;

z-index:9;

}
  

    

 

 
   Add this to your About Me:
     
   
<div class="KhAkDiv1">

Content Here / Inhalt Hier

</div>

 
 

        


  

  









 
   Instruction:
     

    
   If you want to position more than one container at the different places, 
for the next container change the number "1" to 2, 3, 4, etc. voilà!
    


    
   400 = Moves the container left/right.

  200 = Moves the container up/down.

    


  
   Set it to the width/height of your container.

    Replace it with the color/image (if) you wish.

     Add borders to the container.

      Format the text in your container.