Plurk CSS Update for the user info box - code for changing the down/up arrows.


/* change the down arrow graphic */
.drop_arrow div img[src="http://static.plurk.com/static/info_list/down.png"] {
background: url(http://i38.tinypic.com/21jy4nq.png) no-repeat scroll left top;
background-position: left top;
overflow: hidden;
height: 17px;
width: 0px;
padding-left: 22px;
}


/* change the up arrow graphic */
.drop_arrow div img[src="http://static.plurk.com/static/info_list/up.png"] {
background: url(http://i38.tinypic.com/5k3h2r.png) no-repeat scroll left top;
background-position: left top;
overflow: hidden;
height: 17px;
width: 0px;
padding-left: 22px;
}

Much thanks to AZJazzyJ for the help on the blue arrow PNG files :) and skraggy for pointing the right direction

Some Nice Plurk sites or sites which can be used with plurk:

some cool emoticons

Sites by Plurkers:

PlurkSkins by Plurker AZJazzyJ

Plurkiverse by Plurker kdfrawg

Plurkable by Plurker bloggeries

Plurkpix by Plurker martinbogo

My Pleeps by Plurker thoughtwrong

Plurkular by Plurker miketempleton

Plurkmania by Plurker knorcedger

Plurl by Plurker mahadewa

PlurkDev by Plurker mahadewa

Plurkerati by Plurker mahadewa

Plurkk by Plurker bakla

Plurktionary by Plurker DaisyOlsen

Plurkingpoppa by Plurker plurkingpoppa



Other sites:

Plurk Themes

tinypic - upload/resizing pics for plurk

is.gd - compress that URL

stumbleupon plurk group

pikchur - send pictures to plurk via sms/email

ping.fm - code "legendofping"

CCFeed

Plurker friend SHurleyHall has a very nice list of Plurk sites

Gone (A Plurk Poem)

Gone (A Plurk Poem)

Today I awoke
You were not there

Today I went to work
You were not there

Today I went to lunch
You were not there

Today I came home
You were not there

Today I saw you
You were not well

Today I missed you
You "Plurk" have returned


Inspired by the Plurk outage of July 18, 2008
http://www.plurk.com/p/1inbr

We had a bad day together on Friday, Plurk and I
I was there waiting for plurk
But plurk was not to be found
So I had to express the feeling of loss the best way i knew how

Plurk CCS code to change the Timeline Bar:


/* Timeline Bar (where the times are displayed at the bottom at the Timeline */
#bottom_line {
background: #7B68EE;
color: #FFFFFF;
border:none;
opacity: 0; /* see through */
-moz-opacity: 0;
}
/* End Time Bar */

Plurk CSS code to change the Vertical Bar you see on your Plurk timeline:

/* Timeline Vertical Bar */
#timeline_bg .day_start .div_inner
{
/* background: transparent; use this to remove the bar*/
background: #FFFFFF;
border:none;
opacity: 0.1; /* see through */
-moz-opacity: 0.1;
}
/* end Timeline Vertical Bar */

if you wish to remove the bar, uncomment the 'transparent' line and comment the #FFFFFF line. Just in case u want to bring it back.

The following Plurk CSS code can be used to modify the dropdown box; you see it when clicking the down arrow on a plurker's nick (in a plurk/plurk response).

Change the colors to those you like :) also, you may wish to remove this line "opacity: 0.9; /* see-through */" it is used to make the dropdown see-through.

A nice color table http://www.colchis.com/clrtable.html

Have fun.

(also i made the box bigger/text bigger to go with my BIG plurk text for the 24in screen)

/* start of the drop down box */

/* make the box/font bigger */
.AmiMenu.info_menu td
{
padding:0;
width:305px;
overflow:
hidden;
font-family: Arial, Helvetica, sans-serif;
font-size:14px;
font-style: Normal;
line-height:20px;
color:#fff;
cursor:pointer;
}

/* change the color to blue/round the box */
.AmiMenu.info_menu
{
background-color:#0174DF; /* blue */
border:5px solid #0174DF;
border-right:5px solid #0174DF;
border-bottom:5px solid #0174DF;
margin:10;z-index:10000;
-moz-border-radius: 10px; /* rounded */
-webkit-border-radius: 10px;
opacity: 0.9; /* see through */
}

/*make the avatar pic bigger */
.AmiMenu.info_menu .user_info img
{
padding:0 0px;
width:55px;
height:55px;
border:0;
position:relative;
right: 10px;
}

/* change the color when cursor is over the user info */
.AmiMenu.info_menu .user_info.on
{
color:#FFFFFF;
background-color:#FF0000;
cursor:default;
}

/* change the highlight color */
.AmiMenu.info_menu .on
{
background-color:#6A5ACD;
border:none!important;
margin:0!important;
}

/* change the block plurker color */
.AmiMenu.info_menu .block
{
background-color:#000;
color:#FFFFFF;
}



.AmiMenu.info_menu .separator{
background:url(http://static.plurk.com/static/emoticons/silver/dance.gif) repeat-x 0 bottom;
height:30px;
padding-top:6px;
}


/* end drop down box */


P.S.
I'll let u figure where to put this code:

/info_list/separator.png

ROFL

What am I doing??




Welcome to my first Vlog and my last (LOL)

thx @onepinktee

Someone asked about changing the Font of the Plurks. From the earlier post for rounded plurk boxes, you add the following two lines:

font-family: Arial, Helvetica, sans-serif;
font-size: 10px; <-- change to a size you like, but not TOO big

Example:

.plurk_cnt {
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
border: 1px solid #ddd;
background-color: #FFFFFF;
-moz-border-radius: 10px;
-khtml-border-radius: 1px;
-webkit-border-radius:1px;
border-radius: 1px;
margin-right: 1px;
margin-left: 1px;
}



For the Font you would like to use, you change it here:

font-family: Arial, Helvetica, sans-serif;

For example; Arial could be change to Times


Font size you change here:

font-size: 10px;

For the Font Size change the 10 to a diff number


As part of this you can also add:

font-style: italic;

Which can change the style of the plurk text, can replace italic with:

normal
oblique


You can also add a weight:

font-weight: bold;

You change 'bold' to normal

Use Firefox?

Have a Plurk badge?

Add the following Plurk CSS code to your Profile CSS setting and you'll have a Firefox Badge :)

/* display firefox badge */
.award_bar {
background: url(http://www.plurkpix.com/pix/1Gh.png) no-repeat right;
}

Want to your remove your plurk creature? Copy the following Plurk CSS code to your Plurk Profile CSS settings:


/* remove plurk creature */
#dynamic_logo {
opacity:0;filter:alpha(opacity=0);zoom:1
}

Plurk CSS code to change the "Plurk time" character; this the time which is displayed on the timeline when you click on a Plurk within the timeline view

Change the "psy.gif" to another graphic you would to appear

/* Plurk Timeline Character */
#time_show{
background:url(http://plurk.cainanunes.com/psy.gif) left top no-repeat;
background-position:1px 1px;
height:50px;
padding-right:1px;
text-align:right;
width:80px;
bottom:-35px!important;
position:absolute;
}
/* change the plurk time color */
#time_show span{
margin:0;
padding:0;
color:#FFFFFF;
font-weight:bold;
}

Plurk CSS code to turn your dashboard into boxes; have fun with it

/* http://www.colchis.com/clrtable.html color table */

/* make your dashboard into boxes */

#plurk-dashboard {
background: none;
border: none;
}

/* setup stats box */
#dash-stats {
height:300px;
padding: 10px 5px;
color: #FFFFFF;
background-color: #0000FF;
border: 5px solid #FFFFFF;
opacity: 0.9;
filter: alpha(opacity=90);
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
}

#dash-stats, h2 {
text-align: center;
}

#dash-stats h2 {
color: #FFFFFF;
border-bottom: 0;

padding: 0 0 0 20px;
}

#dash-stats #plurks_count, #dash-stats #response_count, #dash-stats table td {
text-align: left;
color: #FFFFFF;
}

/* setup friends box */
#dash-friends {
height: 300px;
padding: 10px 10px;
color: #FFFFFF;
background-color: #FF0000;
border: 5px solid #FFFFFF;
opacity: 0.8;
filter: alpha(opacity=80);
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
}

#dash-friends h2 {
color: #FFFFFF;
border-bottom: 0;
text-align: left;
padding: 0 0 0 20px;
}

#dash-friends, #dash-friends-pics {
text-align: center;
padding: 10px 6px;
}

#show_all_friends {
padding: 0 0 0 20px;
text-align: left;
height: 14px;
no-repeat 0 0;
}


/* setup fans box */
#dash-fans {
height: 300px;
padding: 10px 5px;
color: #FFFFFF;
background-color: #FF00FF;
border: 5px solid #FFFFFF;
opacity: 0.8;
filter: alpha(opacity=80);
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
}

#dash-fans, h2 {
text-align: center;
}

h2#h2_fans {
color: #FFFFFF;
padding: 0 0 0 20px;
border-bottom: 0;
}

#dash-fans div div {
text-align: left;
}

Add the following to lines to your Plurk CSS code to make the Original Plurker's nick show up in Red(or change C00 to another color code)

/* make the org plurker name red */
.highlight_owner .name{text-decoration:none; color: #C00;}

CSS Code for showing Plurkers Nicks in a Diff color for the ones whom you've not visited their profile page


/* make the links 'blue'/#0174DF for persons profiles you have not visited */
a:link { color: #0174DF; }

/* make the org plurker name red */
.highlight_owner .name{text-decoration:none; color: #C00;}

Add those lines in your Plurk CSS code

thx to @skraggy for the "org plurker name" color

Copy all of the CSS code below into your CSS profile box and turn your dashboard into 'boxes'

/* turn your dashboard into 'boxes' */
#plurk-dashboard {
background: none;
border: none;
}
.segment-content {
background-color: #0174DF;
padding: 10px;
margin: 10px;
}

Remove Karma from your Plurk profile:

1) .karma_hover{font-size: 0px} #karma_arrow{position: relative;left: -800px;}

2) #dash-stats h3, a.link_arrow {opacity:0.0;filter:alpha(opacity=0);height:0;margin:0;padding:0;font-size:0;}


copy/paste the code below into your CSS profile settings


/* remove karma from your dashboard */
.karma_hover{font-size: 0px} #karma_arrow{position: relative;left: -800px;}
#dash-stats h3, a.link_arrow {opacity:0.0;filter:alpha(opacity=0);height:0;margin:0;padding:0;font-size:0;}

/* Move the Plurker Avatar to the left of the plurk */
div.p_img {
position: relative;
right: 3px;
}

change the 3px to a number you like

/* the display for when you have new plurks/responses */
#updater {
border: none;
background-color: #0174DF;
color: silver;
}
#updater a {
color: white;
}

You can change to diff colors from what is used; also i set border to "none", why have a border?

/* the display for when you have new plurks/responses */
#updater {
border: none;
background-color: #0174DF;
color: silver;
}
#updater a {
color: white;
}

You can change to diff colors from what is used; also i set border to "none", why have a border?

/* make a bigger input box for the plurk */

#plurk_form #input_big { height: 100px; }

thx @skraggy!


*100px is just right to hold the 140 char plurk

See any plurkers CCS code by doing the following:

http://www.plurk.com/Users/getCustomCss?user_id=id

where =id is the avatar # of a plurker

right click on the avatar picture on a plurkers profile page and 'copy image location'

then pasted that location:

http://avatars.plurk.com/9829-medium.gif

replace the =id with 9829

http://www.plurk.com/Users/getCustomCss?user_id=9829

will give you the CSS code for my profile (the CSS code changes often ; )

How to make a Bigger Reply box in Plurk

Plurk CSS code to make a big Response box:

/* make a bigger input box for the responses */
#input_small {
height: 75px;
background:#A7CEE8;
}


This makes it ezer to input a response to a plurk.

Move the Mute button from the Plurk, to the Left side of the Plurk, when you hover over a plurk

/* hovering mute */
div.manager {
position: absolute;
top: 0px;
left: -28px;
background-color: #8FB2C5;
border: 1px solid #8FB2C5;
width: 50px;
height: 20px;
overflow: hidden !important;
}

/* color the mute text */
.manager a {
color: #FFFFFF !important;
}

Plurk CSS code for rounded Plurk boxes

.plurk_cnt {
border: 1px solid #ddd;
background-color: #FFFFFF;
-moz-border-radius: 10px;
-khtml-border-radius: 1px;
-webkit-border-radius:1px;
border-radius: 1px;
margin-right: 1px;
margin-left: 1px;
}

Create a red response count number for the plurk


/* Create a BIG red response count number for the plurk */
.response_count {
text-align: center;
-moz-border-radius: 7px;
-khtml-border-radius: 7px;
-webkit-border-radius: 7px;
border-radius: 7px;
font-size:16px;
padding: 2px;
}