<?xml version="1.0" encoding="utf-8"?>
<feed xmlns="http://www.w3.org/2005/Atom">
    <title>Plurk Skins</title>
    <link rel="alternate" type="text/html" href="http://plurkskins.com/" />
    <link rel="self" type="application/atom+xml" href="http://plurkskins.com/atom.xml" />
    <id>tag:plurkskins.com,2008-08-09://1</id>
    <updated>2009-01-15T16:31:44Z</updated>
    <subtitle>Teaching Your Plurk Creature New Tricks</subtitle>
    <generator uri="http://www.sixapart.com/movabletype/">Movable Type Pro 4.2-en</generator>

<entry>
    <title>Valentine&apos;s Day Theme 4</title>
    <link rel="alternate" type="text/html" href="http://plurkskins.com/2009/01/valentines-day-theme-4.html" />
    <id>tag:plurkskins.com,2009://1.51</id>

    <published>2009-01-15T16:29:44Z</published>
    <updated>2009-01-15T16:31:44Z</updated>

    <summary>Valentine&apos;s Day is one of those times of year that seem to pull at the hearts of romantics everywhere. It is a time where you can show your love to that special someone in your life. It also signifies a...</summary>
    <author>
        <name>Jeff Summers</name>
        <uri>http://jeffdsummers.com</uri>
    </author>
    
        <category term="Plurk Theme" scheme="http://www.sixapart.com/ns/types#category" />
    
    <category term="holiday" label="holiday" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="theme" label="theme" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="valentinesday" label="Valentine&apos;s Day" scheme="http://www.sixapart.com/ns/types#tag" />
    
    <content type="html" xml:lang="en" xml:base="http://plurkskins.com/">
        <![CDATA[<p>Valentine's Day is one of those times of year that seem to pull at the hearts of romantics everywhere.  It is a time where you can show your love to that special someone in your life.  It also signifies a time of change as the long winter begins to dissipate replaced by the thoughts of spring and change.  As I started looking around for graphics for Valentine's Day I was quickly overwhelmed to the point that instead of creating a Valentine's-based theme I ended up creating four separate ones.  This is the fourth theme, the first was <a href="http://plurkskins.com/2009/01/valentines-day-theme-1.html">Valentine's Day Theme 1</a>, the second was <a href="http://plurkskins.com/2009/01/valentines-day-theme-2.html">Valentine's Day Theme 2</a>, and the third was <a href="http://plurkskins.com/2009/01/valentines-day-theme-3.html">Valentine's Day Theme 3</a>.</p>]]>
        <![CDATA[<p>This is the fourth theme I developed to celebrate Valentine's Day and it has a few interesting features that you might find helpful.</p>

<p>Some of the more interesting features include the use of roses icons to identify new Plurk messages and replies. <span class="mt-enclosure mt-enclosure-image" style="display: inline;"><a href="http://plurkskins.com/assets_c/2009/01/ValentinesDay4.html" onclick="window.open('http://plurkskins.com/assets_c/2009/01/ValentinesDay4.html','popup','width=1170,height=1168,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img src="http://plurkskins.com/assets_c/2009/01/ValentinesDay4-thumb-400x399.jpg" width="400" height="399" alt="ValentinesDay4.jpg" class="mt-image-right" style="float: right; margin: 0 0 20px 20px;" /></a></span>An unread message shows a red rose with pink numbers while a read message will show a yellow rose with yellow numbers. This is slightly different than the typical colored box that you see. For those who don't want to see their Karma score, I have replaced it with a heart-shaped box of chocolates.<br />
The loading graphic in the timeline has been replaced with a graphic of a romantic Valentine's day snack. This will appear whenever you scroll through your timeline left or right. There is also a new loading graphic in the response box. This one is a set of hearts in a small animation.<br />
The scroll left and right arrows have also been replaced with cupid. When you hover over it with your mouse he will draw back his bow pointing the way your timeline will move. The "Back to Home" blue button has been replaced with a ring box. When you hover over it with your mouse the box opens showing a ring with the words "back to start".<br />
The Plurk creature has been removed and replaced with Mickey Mouse in a tux getting ready for a night out with the person he loves.  The timeline graphic shows a bouquet of red roses on a red satin background.  The lower half of the screen is filled with white roses.  The dashboard is a darkened translucent black.  The plurk button has been replaced with 2 dozen roses forming the "L" in Plurk.<br />
I think you will find this theme fairly full-function with a lot of detail added. If you have questions please feel free to contact me. I hope you enjoy this theme and be sure to tell everyone you got it from <a href="http://www.plurk.com">Plurk Skins</a>.</p>

<div style="text-align: center;"><a href="http://www.plurk.com/installDesign/3129365-914ad5746a"><img style="border-style: none" src="http://plurkskins.com/images/install_themeUP.png" onmouseover="this.src='http://plurkskins.com/images/install_themeMO.png';" onmousedown="this.src='http://plurkskins.com/images/install_themeDN.png';" onmouseout="this.src='http://plurkskins.com/images/install_themeUP.png';" alt="Install Theme" name="install" id="install" width="150" height="50"></a></div>

<p><strong>Update:</strong> <em>This theme has been updated to reflect the changes made to Plurk through January 14, 2009.</em></p>]]>
    </content>
</entry>

<entry>
    <title>Valentine&apos;s Day Theme 3</title>
    <link rel="alternate" type="text/html" href="http://plurkskins.com/2009/01/valentines-day-theme-3.html" />
    <id>tag:plurkskins.com,2009://1.50</id>

    <published>2009-01-15T16:21:09Z</published>
    <updated>2009-01-15T16:22:37Z</updated>

    <summary>Valentine&apos;s Day is one of those times of year that seem to pull at the hearts of romantics everywhere. It is a time where you can show your love to that special someone in your life. It also signifies a...</summary>
    <author>
        <name>Jeff Summers</name>
        <uri>http://jeffdsummers.com</uri>
    </author>
    
        <category term="Plurk Theme" scheme="http://www.sixapart.com/ns/types#category" />
    
    <category term="holiday" label="holiday" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="theme" label="theme" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="valentinesday" label="Valentine&apos;s Day" scheme="http://www.sixapart.com/ns/types#tag" />
    
    <content type="html" xml:lang="en" xml:base="http://plurkskins.com/">
        <![CDATA[<p>Valentine's Day is one of those times of year that seem to pull at the hearts of romantics everywhere.  It is a time where you can show your love to that special someone in your life.  It also signifies a time of change as the long winter begins to dissipate replaced by the thoughts of spring and change.  As I started looking around for graphics for Valentine's Day I was quickly overwhelmed to the point that instead of creating a Valentine's-based theme I ended up creating four separate ones.  This is the third theme, the first was <a href="http://plurkskins.com/2009/01/valentines-day-theme-1.html">Valentine's Day Theme 1</a> and the second was <a href="http://plurkskins.com/2009/01/valentines-day-theme-2.html">Valentine's Day Theme 2</a>.</p>]]>
        <![CDATA[<p>This is the third theme I developed to celebrate Valentine's Day and it has a few interesting features that you might find helpful.</p>

<p>Some of the more interesting features include the use of Hershey's kisses candies icons to identify new Plurk messages and replies. <span class="mt-enclosure mt-enclosure-image" style="display: inline;"><a href="http://plurkskins.com/assets_c/2009/01/ValentinesDay3.html" onclick="window.open('http://plurkskins.com/assets_c/2009/01/ValentinesDay3.html','popup','width=1170,height=1168,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img src="http://plurkskins.com/assets_c/2009/01/ValentinesDay3-thumb-400x399.jpg" width="400" height="399" alt="ValentinesDay3.jpg" class="mt-image-right" style="float: right; margin: 0 0 20px 20px;" /></a></span>An unread message shows a gold Hershey's kiss with dark red numbers while a read message will show a silver Hershey's kiss with pink numbers. This is slightly different than the typical colored box that you see. For those who don't want to see their Karma score, I have replaced it with a heart-shaped box of chocolates.<br />
The loading graphic in the timeline has been replaced with a graphic of a romantic Valentine's day snack. This will appear whenever you scroll through your timeline left or right. There is also a new loading graphic in the response box. This one is a set of hearts in a small animation.<br />
The scroll left and right arrows have also been replaced with cupid. When you hover over it with your mouse he will draw back his bow pointing the way your timeline will move. The "Back to Home" blue button has been replaced with a ring box. When you hover over it with your mouse the box opens showing a ring with the words "back to start".<br />
The Plurk creature has been removed and replaced with Mickey Mouse in a tux getting ready for a night out with the person he loves.  The timeline graphic shows a three dimensional heart with red shadow on a black background.  The lower half of the screen is filled with Hershey's kisses candies.  The dashboard is a darkened translucent black.  The plurk button has been replaced with 2 dozen roses forming the "L" in Plurk.<br />
I think you will find this theme fairly full-function with a lot of detail added. If you have questions please feel free to contact me. I hope you enjoy this theme and be sure to tell everyone you got it from <a href="http://www.plurk.com">Plurk Skins</a>.</p>

<div style="text-align: center;"><a href="http://www.plurk.com/installDesign/3129365-84bdf1d9b8"><img style="border-style: none" src="http://plurkskins.com/images/install_themeUP.png" onmouseover="this.src='http://plurkskins.com/images/install_themeMO.png';" onmousedown="this.src='http://plurkskins.com/images/install_themeDN.png';" onmouseout="this.src='http://plurkskins.com/images/install_themeUP.png';" alt="Install Theme" name="install" id="install" width="150" height="50"></a></div>

<p><strong>Update:</strong> <em>This theme has been updated to reflect the changes made to Plurk through January 14, 2009.</em></p>]]>
    </content>
</entry>

<entry>
    <title>Valentine&apos;s Day Theme 2</title>
    <link rel="alternate" type="text/html" href="http://plurkskins.com/2009/01/valentines-day-theme-2.html" />
    <id>tag:plurkskins.com,2009://1.49</id>

    <published>2009-01-15T16:12:24Z</published>
    <updated>2009-01-15T16:14:20Z</updated>

    <summary>Valentine&apos;s Day is one of those times of year that seem to pull at the hearts of romantics everywhere. It is a time where you can show your love to that special someone in your life. It also signifies a...</summary>
    <author>
        <name>Jeff Summers</name>
        <uri>http://jeffdsummers.com</uri>
    </author>
    
        <category term="Plurk Theme" scheme="http://www.sixapart.com/ns/types#category" />
    
    <category term="holiday" label="holiday" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="theme" label="theme" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="valentinesday" label="Valentine&apos;s Day" scheme="http://www.sixapart.com/ns/types#tag" />
    
    <content type="html" xml:lang="en" xml:base="http://plurkskins.com/">
        <![CDATA[<p>Valentine's Day is one of those times of year that seem to pull at the hearts of romantics everywhere.  It is a time where you can show your love to that special someone in your life.  It also signifies a time of change as the long winter begins to dissipate replaced by the thoughts of spring and change.  As I started looking around for graphics for Valentine's Day I was quickly overwhelmed to the point that instead of creating a Valentine's-based theme I ended up creating four separate ones.  This is the second theme, the first was <a href="http://plurkskins.com/2009/01/valentines-day-theme-1.html">Valentine's Day Theme 1</a>.</p>]]>
        <![CDATA[<p>This is the second theme I developed to celebrate Valentine's Day and it has a few interesting features that you might find helpful.</p>

<p>Some of the more interesting features include the use of conversation heart candies icons to identify new Plurk messages and replies. <span class="mt-enclosure mt-enclosure-image" style="display: inline;"><a href="http://plurkskins.com/assets_c/2009/01/ValentinesDay2.html" onclick="window.open('http://plurkskins.com/assets_c/2009/01/ValentinesDay2.html','popup','width=1170,height=1168,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img src="http://plurkskins.com/assets_c/2009/01/ValentinesDay2-thumb-400x399.jpg" width="400" height="399" alt="ValentinesDay2.jpg" class="mt-image-right" style="float: right; margin: 0 0 20px 20px;" /></a></span>An unread message shows a pink conversation heart with dark red numbers while a read message will show a green conversation heart with pink numbers. This is slightly different than the typical colored box that you see. For those who don't want to see their Karma score, I have replaced it with two champagne glasses, a rose and a bottle of champagne.<br />
The loading graphic in the timeline has been replaced with a graphic of a romantic Valentine's day snack. This will appear whenever you scroll through your timeline left or right. There is also a new loading graphic in the response box. This one is a set of hearts in a small animation.<br />
The scroll left and right arrows have also been replaced with cupid. When you hover over it with your mouse he will draw back his bow pointing the way your timeline will move. The "Back to Home" blue button has been replaced with a ring box. When you hover over it with your mouse the box opens showing a ring with the words "back to start".<br />
The Plurk creature has been removed and replaced with Mickey Mouse in a tux getting ready for a night out with the person he loves.  The timeline graphic shows a couple embraced in a kiss with a heart filled background.  The lower half of the screen is filled with conversation heart candies.  The dashboard is a darkened translucent black.  The plurk button has been replaced with 2 dozen roses forming the "L" in Plurk.<br />
I think you will find this theme fairly full-function with a lot of detail added. If you have questions please feel free to contact me. I hope you enjoy this theme and be sure to tell everyone you got it from <a href="http://www.plurk.com">Plurk Skins</a>.</p>

<div style="text-align: center;"><a href="http://www.plurk.com/installDesign/3129365-ee87e4b602"><img style="border-style: none" src="http://plurkskins.com/images/install_themeUP.png" onmouseover="this.src='http://plurkskins.com/images/install_themeMO.png';" onmousedown="this.src='http://plurkskins.com/images/install_themeDN.png';" onmouseout="this.src='http://plurkskins.com/images/install_themeUP.png';" alt="Install Theme" name="install" id="install" width="150" height="50"></a></div>

<p><strong>Update:</strong> <em>This theme has been updated to reflect the changes made to Plurk through January 14, 2009.</em></p>]]>
    </content>
</entry>

<entry>
    <title>Valentine&apos;s Day Theme 1</title>
    <link rel="alternate" type="text/html" href="http://plurkskins.com/2009/01/valentines-day-theme-1.html" />
    <id>tag:plurkskins.com,2009://1.48</id>

    <published>2009-01-15T15:47:44Z</published>
    <updated>2009-01-15T16:00:54Z</updated>

    <summary>Valentine&apos;s Day is one of those times of year that seem to pull at the hearts of romantics everywhere. It is a time where you can show your love to that special someone in your life. It also signifies a...</summary>
    <author>
        <name>Jeff Summers</name>
        <uri>http://jeffdsummers.com</uri>
    </author>
    
        <category term="Plurk Theme" scheme="http://www.sixapart.com/ns/types#category" />
    
    <category term="holiday" label="holiday" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="theme" label="theme" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="valentinesday" label="Valentine&apos;s Day" scheme="http://www.sixapart.com/ns/types#tag" />
    
    <content type="html" xml:lang="en" xml:base="http://plurkskins.com/">
        <![CDATA[<p>Valentine's Day is one of those times of year that seem to pull at the hearts of romantics everywhere.  It is a time where you can show your love to that special someone in your life.  It also signifies a time of change as the long winter begins to dissipate replaced by the thoughts of spring and change.  As I started looking around for graphics for Valentine's Day I was quickly overwhelmed to the point that instead of creating a Valentine's-based theme I ended up creating four separate ones.</p>]]>
        <![CDATA[<p>This is the first theme I developed to celebrate Valentine's Day and it has a few interesting features that you might find helpful.</p>

<p>Some of the more interesting features include the use of valentine's heart icons to identify new Plurk messages and replies. <span class="mt-enclosure mt-enclosure-image" style="display: inline;"><a href="http://plurkskins.com/assets_c/2009/01/ValentinesDay1.html" onclick="window.open('http://plurkskins.com/assets_c/2009/01/ValentinesDay1.html','popup','width=1170,height=1168,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img src="http://plurkskins.com/assets_c/2009/01/ValentinesDay1-thumb-400x399.jpg" width="400" height="399" alt="ValentinesDay1.jpg" class="mt-image-right" style="float: right; margin: 0 0 20px 20px;" /></a></span>An unread message shows two valentine hearts with an arrow piercing them with dark red numbers while a read message will show a single pierced heart pink numbers. This is slightly different than the typical colored box that you see. For those who don't want to see their Karma score, I have replaced it with a box of chocolates.<br />
The loading graphic in the timeline has been replaced with a graphic of a romantic Valentine's day snack. This will appear whenever you scroll through your timeline left or right. There is also a new loading graphic in the response box. This one is a set of hearts in a small animation.<br />
The scroll left and right arrows have also been replaced with cupid. When you hover over it with your mouse he will draw back his bow pointing the way your timeline will move. The "Back to Home" blue button has been replaced with a ring box. When you hover over it with your mouse the box opens showing a ring with the words "back to start".<br />
The Plurk creature has been removed and replaced with Mickey Mouse in a tux getting ready for a night out with the person he loves.  The timeline graphic shows three-dimensional red orbs forming the shape of a heart on a steel gray background.  The lower half of the screen is filled with cinnamon heart candies.  The dashboard is a darkened translucent black.  The plurk button has been replaced with 2 dozen roses forming the "L" in Plurk.<br />
I think you will find this theme fairly full-function with a lot of detail added. If you have questions please feel free to contact me. I hope you enjoy this theme and be sure to tell everyone you got it from <a href="http://www.plurk.com">Plurk Skins</a>.</p>

<div style="text-align: center;"><a href="http://www.plurk.com/installDesign/3129365-8ad1d0b558"><img style="border-style: none" src="http://plurkskins.com/images/install_themeUP.png" onmouseover="this.src='http://plurkskins.com/images/install_themeMO.png';" onmousedown="this.src='http://plurkskins.com/images/install_themeDN.png';" onmouseout="this.src='http://plurkskins.com/images/install_themeUP.png';" alt="Install Theme" name="install" id="install" width="150" height="50"></a></div>

<p><strong>Update:</strong> <em>This theme has been updated to reflect the changes made to Plurk through January 14, 2009.</em></p>]]>
    </content>
</entry>

<entry>
    <title>Modifying the Friends/Fans icons and User Avatar Size</title>
    <link rel="alternate" type="text/html" href="http://plurkskins.com/2009/01/modifying-the-friendsfans-icon.html" />
    <id>tag:plurkskins.com,2009://1.47</id>

    <published>2009-01-12T05:55:02Z</published>
    <updated>2009-01-14T06:05:07Z</updated>

    <summary>Recently Plurk made changes to their User Interface by enlarging several of the graphic elements within the dashboard area. This startled several members who immediately began looking for a way to resize the image to something slightly more manageable. During...</summary>
    <author>
        <name>Jeff Summers</name>
        <uri>http://jeffdsummers.com</uri>
    </author>
    
        <category term="CSS Profile" scheme="http://www.sixapart.com/ns/types#category" />
    
        <category term="New Features" scheme="http://www.sixapart.com/ns/types#category" />
    
    <category term="avatar" label="avatar" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="fan" label="fan" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="friend" label="friend" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="icon" label="icon" scheme="http://www.sixapart.com/ns/types#tag" />
    
    <content type="html" xml:lang="en" xml:base="http://plurkskins.com/">
        <![CDATA[<p>Recently Plurk made changes to their User Interface by enlarging several of the graphic elements within the dashboard area.  This startled several members who immediately began looking for a way to resize the image to something slightly more manageable.  During the incurring scramble to find a solution many users came up with creative ways of fixing the code.  Thanks goes out to <a href="http://plurklayouts.com/">Plurk Layouts</a> and <a href="http://www.plurk.com/oliviabell">Olivia Bell</a> for first documenting the friends/fans elements so that a solution could be created.  The first change was to the user's avatar image which increased in size by nearly 3 times.  The second graphical change was in the Friends and Fans section.  The user icons in those sections likewise received a size boost going from 25 pixels to 40 pixels.  Users again were up in arms as the larger icons took up screen real estate.  This tutorial has been written to provide you with the code necessary to change both of these image sizes as well as to center the icons within the Friends and Fans section.  </p>]]>
        <![CDATA[<p>As we always do we'll begin by providing all of the code to allow you to copy and paste it directly into your profile to begin using the new functionality immediately.</p>

<blockquote>
/* Center Friend Icons */<br />
.friend_holder table { <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
     margin-left: auto;<br />
     &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
     margin-right: auto;<br />
}

<p>.friend_holder td {<br />
     &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
     padding: 5px 6px 5px 6px;<br />
}<br />
/* End Center Friend Icons */</p>

<p>/* Change Friends/Fans Picture Size */<br />
.friend_holder .user_link, .friend_holder .user_link img {<br />
     &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
     width: 25px !important;<br />
     &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
     height: 25px !important;<br />
}<br />
/* End Change Friends/Fans Picture Size */</p>

<p>/* Change Personal Avatar Picture Size */<br />
#profile_pic { <br />
     &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
     width: 87px; <br />
     &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
     height: 87px;<br />
}</p>

<p>#profile_pic:hover {<br />
     &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
     width: 195px;<br />
     &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
     height: 195px;<br />
}<br />
/* End Change Personal Avatar Picture Size */<br />
</p></blockquote><br />
We'll now follow up by discussing each line of code so that you will understand what each section does and why it is in the profile. As I always do, I strongly recommend documenting the code by making notes for yourself so that you can remember why you added the code. This is extremely important if you ever need to go back to your profile and troubleshoot or modify it.

<p>To make the changes to the friends and fans icons there are several elements that need to be added or modified.  We'll break it up to make it easier to explain.  The values on the picture sizes are merely examples, you may set them to different sizes to meet your needs and more closely match your theme.<br />
</p><blockquote>.friend_holder table { <br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
     margin-left: auto;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
     margin-right: auto;<br />
}<br />
</blockquote><br />
The first section deals with the table that holds the friends and fans.  In this section we are going to center the icons.  We're doing this so that once we have resized the icons they will center within the box.  To do this we will use a CSS sleight of hand by setting the left and right margins to automatically adjust according to the width of the table.  This is done through the margin-left and margin-right commands.  When margin-left and margin-right are both set to auto the block inside is centered to the edges of the container which in this case is the friends box or the fans box.  If you have other margin values for .friend_holder table{} you must remove those otherwise your icons will not center.<br />
<blockquote>.friend_holder td {<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
     padding: 5px 6px 5px 6px;<br />
}</blockquote>

<p>The next section of code will modify the padding surrounding each individual icon.  I've added this because once the icons have been reduced in size the white space between them feels too large.  I am using the padding command and providing a value in pixels for the top, right, bottom, and left sides of the icon.  In this case we are adding 5 pixels to the top and bottom and 6 pixels to the left and right of the friends and fans icons.  This will move them up and in from what they were before.<br />
</p><blockquote>.friend_holder .user_link, .friend_holder .user_link img {<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
     width: 25px !important;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
     height: 25px !important;<br />
}</blockquote>

<p>This code segment will resize the actual icons themselves.  We are actually working with two different elements, the .friend_holder .user_link and the image inside this container identified as .friend_holder .user_link img.  Within this we use the width and height commands to define the new size.  With the latest Plurk changes the icons went to 40 pixels by 40 pixels.  Before they were 25 pixels.  By setting width: 25px and height: 25px it will make the icons the same size as they were before.  In order to override the image size you need to use the !important qualifier which tells the system to use these values no matter what the inheritance of the CSS says.<br />
</p><blockquote>#profile_pic { <br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
     width: 87px; <br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
     height: 87px;<br />
}</blockquote>

<p>This section of code will focus on the user's profile avatar or picture.  This too has been enlarged substantially.  Before it was somewhere in the neighborhood of 50-60 pixels.  After the latest changes that Plurk made this avatar ballooned to 195 pixels.  For some that is too large.  The container that controls this is #profile_pic.  By modifying the width and height of this element you can resize the picture.  I chose to use 87 pixels which is larger than before but roughly half the size of what Plurk has it set for. <br />
</p><blockquote>#profile_pic:hover {<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
     width: 195px;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
     height: 195px;<br />
}</blockquote>

<p>Before Plurk made these changes, the user's avatar would become larger when you ran your mouse over the graphic. When Plurk went to the larger profile picture this function was taken away.  We'll re-introduce this using the :hover qualifier to the #profile_pic element.  The :hover describes what should be done when a user "hovers" the mouse over an element.  In our case we are telling the system to change the width and height of the image.  In our case we are resizing the user's avatar to the 195 pixel size that Plurk is now defaulting to.<br />
Well that's about all there is to resizing and repositioning the friends and fans icons and changing the size of your avatar that appears in the dashboard. After this tutorial you will have a customized Friends and Fans section as well as a user image that fits in with the rest of your theme. Hopefully you will find this useful. Good luck and be sure to let everyone know you found this on <a href="http://plurkskins.com/">Plurk Skins</a>.</p>]]>
    </content>
</entry>

<entry>
    <title>iPod Nano Theme</title>
    <link rel="alternate" type="text/html" href="http://plurkskins.com/2009/01/ipod-nano-theme.html" />
    <id>tag:plurkskins.com,2009://1.46</id>

    <published>2009-01-09T02:11:51Z</published>
    <updated>2009-01-14T02:20:04Z</updated>

    <summary>One of the most influential products to come out has been the Apple iPod. It has revolutionized the way people listen to music. The iPod has taken many shapes and sizes. One of the most popular has been the Nano...</summary>
    <author>
        <name>Jeff Summers</name>
        <uri>http://jeffdsummers.com</uri>
    </author>
    
        <category term="Plurk Theme" scheme="http://www.sixapart.com/ns/types#category" />
    
    <category term="apple" label="Apple" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="ipod" label="iPod" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="theme" label="theme" scheme="http://www.sixapart.com/ns/types#tag" />
    
    <content type="html" xml:lang="en" xml:base="http://plurkskins.com/">
        <![CDATA[<p>One of the most influential products to come out has been the Apple iPod.  It has revolutionized the way people listen to music.  The iPod has taken many shapes and sizes.  One of the most popular has been the Nano which uses flash memory storage and is razor thin.  Looking at my daughter's iPod Nano I thought it would make a great subject for a Plurk theme.</p>]]>
        <![CDATA[<p>I developed this theme for my daughter who wanted something themed around the Apple iPod Nano and it has a few interesting features that you might find helpful.</p>

<p>Some of the more interesting features include the use of a red and a green iPod Nano icons to identify new Plurk messages and replies. <span class="mt-enclosure mt-enclosure-image" style="display: inline;"><a href="http://plurkskins.com/assets_c/2009/01/iPod.html" onclick="window.open('http://plurkskins.com/assets_c/2009/01/iPod.html','popup','width=1170,height=1168,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img src="http://plurkskins.com/assets_c/2009/01/iPod-thumb-400x399.jpg" width="400" height="399" alt="iPod.jpg" class="mt-image-right" style="float: right; margin: 0 0 20px 20px;" /></a></span>An unread message shows a red iPod Nano with red numbers while a read message will show a green iPod Nano with green numbers. This is slightly different than the typical colored box that you see. For those who don't want to see their Karma score, I have replaced it with Apple CEO Steve Jobs.<br />
The loading graphic in the timeline has been replaced with an iPod commercial graphic. This will appear whenever you scroll through your timeline left or right. There is also a new loading graphic in the response box. This one is a rotating iPod Classic in a small animation.<br />
The scroll left and right arrows have also been replaced with blue iPod Nanos. When you hover over it with your mouse it rotates to its side with an arrow that points which direction your timeline will move. The "Back to Home" blue button has been replaced with an Apple logo. When you hover over it with your mouse the logo changes to the old style rainbow Apple logo.<br />
The Plurk creature has been removed and replaced with Goofy wearing a Diamondbacks uniform.<br />
I think you will find this theme fairly full-function with a lot of detail added. If you have questions please feel free to contact me. I hope you enjoy this theme and be sure to tell everyone you got it from <a href="http://www.plurk.com">Plurk Skins</a>.</p>

<div style="text-align: center;"><a href="http://www.plurk.com/installDesign/3129365-8c83aaf6a1"><img style="border-style: none" src="http://plurkskins.com/images/install_themeUP.png" onmouseover="this.src='http://plurkskins.com/images/install_themeMO.png';" onmousedown="this.src='http://plurkskins.com/images/install_themeDN.png';" onmouseout="this.src='http://plurkskins.com/images/install_themeUP.png';" alt="Install Theme" name="install" id="install" width="150" height="50"></a></div>

<p><strong>Update:</strong> <em>This theme has been updated to reflect the changes made to Plurk through January 13, 2009.</em></p>]]>
    </content>
</entry>

<entry>
    <title>New Years Theme</title>
    <link rel="alternate" type="text/html" href="http://plurkskins.com/2008/12/new-years-theme.html" />
    <id>tag:plurkskins.com,2008://1.45</id>

    <published>2008-12-28T01:11:55Z</published>
    <updated>2009-01-14T01:19:51Z</updated>

    <summary>While I was searching for a suitable background for my New Years Eve theme I came across another background image that really signified the holiday. I&apos;ve therefore created a second New Years theme with this background as well. This version...</summary>
    <author>
        <name>Jeff Summers</name>
        <uri>http://jeffdsummers.com</uri>
    </author>
    
        <category term="Plurk Theme" scheme="http://www.sixapart.com/ns/types#category" />
    
    <category term="holiday" label="holiday" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="newyears" label="New Years" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="theme" label="theme" scheme="http://www.sixapart.com/ns/types#tag" />
    
    <content type="html" xml:lang="en" xml:base="http://plurkskins.com/">
        <![CDATA[<p>While I was searching for a suitable background for my <a href="http://plurkskins.com/2008/12/new-years-eve-theme.html">New Years Eve</a> theme I came across another background image that really signified the holiday. I've therefore created a second New Years theme with this background as well. This version features a pair of champagne glasses in a toast with the words Happy New Year at the top of the timeline. Where the first theme is leading up to the clock striking midnight this one captures that magical moment just after the new year arrives.</p>]]>
        <![CDATA[<p>I developed this theme to celebrate New Years and it has a few interesting features that you might find helpful.</p>

<p>Some of the more interesting features include the use of a red and a blue New Years Eve hat icons to identify new Plurk messages and replies. <span class="mt-enclosure mt-enclosure-image" style="display: inline;"><a href="http://plurkskins.com/assets_c/2009/01/NewYears2.html" onclick="window.open('http://plurkskins.com/assets_c/2009/01/NewYears2.html','popup','width=1170,height=1168,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img src="http://plurkskins.com/assets_c/2009/01/NewYears2-thumb-400x399.jpg" width="400" height="399" alt="NewYears2.jpg" class="mt-image-right" style="float: right; margin: 0 0 20px 20px;" /></a></span>An unread message shows a red and gold hat with gold numbers while a read message will show a blue and silver hat and silver numbers. This is slightly different than the typical colored box that you see. For those who don't want to see their Karma score, I have replaced it with baby new year.<br />
The loading graphic in the timeline has been replaced with a graphic of a clock just before midnight covered with confetti. This will appear whenever you scroll through your timeline left or right. There is also a new loading graphic in the response box. This one is a champagne bottle bursting with the words Happy New Year in a small animation.<br />
The scroll left and right arrows have also been replaced with a champagne bottle. When you hover over it with your mouse it points the way your timeline will move. The "Back to Home" blue button has been replaced with a calendar. When you hover over it with your mouse the date changes.<br />
The Plurk creature has been removed and replaced with Eeyore celebrating New Years.<br />
I think you will find this theme fairly full-function with a lot of detail added. If you have questions please feel free to contact me. I hope you enjoy this theme and be sure to tell everyone you got it from <a href="http://www.plurk.com">Plurk Skins</a>.</p>

<div style="text-align: center;"><a href="http://www.plurk.com/installDesign/3129365-4901dbc163"><img style="border-style: none" src="http://plurkskins.com/images/install_themeUP.png" onmouseover="this.src='http://plurkskins.com/images/install_themeMO.png';" onmousedown="this.src='http://plurkskins.com/images/install_themeDN.png';" onmouseout="this.src='http://plurkskins.com/images/install_themeUP.png';" alt="Install Theme" name="install" id="install" width="150" height="50"></a></div>

<p><strong>Update:</strong> <em>This theme has been updated to reflect the changes made to Plurk through January 13, 2009.</em></p>]]>
    </content>
</entry>

<entry>
    <title>New Years Eve Theme</title>
    <link rel="alternate" type="text/html" href="http://plurkskins.com/2008/12/new-years-eve-theme.html" />
    <id>tag:plurkskins.com,2008://1.44</id>

    <published>2008-12-27T00:58:47Z</published>
    <updated>2009-01-14T01:10:59Z</updated>

    <summary>New Years is an interesting holiday. It comes almost immediately after Christmas so you barely have time to catch your breath before shifting from one celebration to the next. The other thing that is really weird is that we actually...</summary>
    <author>
        <name>Jeff Summers</name>
        <uri>http://jeffdsummers.com</uri>
    </author>
    
        <category term="Plurk Theme" scheme="http://www.sixapart.com/ns/types#category" />
    
    <category term="holiday" label="holiday" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="newyears" label="New Years" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="theme" label="theme" scheme="http://www.sixapart.com/ns/types#tag" />
    
    <content type="html" xml:lang="en" xml:base="http://plurkskins.com/">
        <![CDATA[<p>New Years is an interesting holiday.  It comes almost immediately after Christmas so you barely have time to catch your breath before shifting from one celebration to the next.  The other thing that is really weird is that we actually commemorate the end of one calendar and the beginning of another.  I guess it could be worse, we could celebrate running out of toilet paper.</p>]]>
        <![CDATA[<p>I developed this theme to celebrate New Years Eve and it has a few interesting features that you might find helpful.</p>

<p>Some of the more interesting features include the use of a red and a blue New Years Eve hat icons to identify new Plurk messages and replies. <span class="mt-enclosure mt-enclosure-image" style="display: inline;"><a href="http://plurkskins.com/assets_c/2009/01/NewYears.html" onclick="window.open('http://plurkskins.com/assets_c/2009/01/NewYears.html','popup','width=1170,height=1168,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img src="http://plurkskins.com/assets_c/2009/01/NewYears-thumb-400x399.jpg" width="400" height="399" alt="NewYears.jpg" class="mt-image-right" style="float: right; margin: 0 0 20px 20px;" /></a></span>An unread message shows a red and gold hat with gold numbers while a read message will show a blue and silver hat and silver numbers. This is slightly different than the typical colored box that you see. For those who don't want to see their Karma score, I have replaced it with baby new year.<br />
The loading graphic in the timeline has been replaced with a graphic of a clock just before midnight covered with confetti. This will appear whenever you scroll through your timeline left or right. There is also a new loading graphic in the response box. This one is a champagne bottle bursting with the words Happy New Year in a small animation.<br />
The scroll left and right arrows have also been replaced with a champagne bottle. When you hover over it with your mouse it points the way your timeline will move. The "Back to Home" blue button has been replaced with a calendar. When you hover over it with your mouse the date changes.<br />
The Plurk creature has been removed and replaced with Mickey Mouse in a top hat.<br />
I think you will find this theme fairly full-function with a lot of detail added. If you have questions please feel free to contact me. I hope you enjoy this theme and be sure to tell everyone you got it from <a href="http://www.plurk.com">Plurk Skins</a>.</p>

<div style="text-align: center;"><a href="http://www.plurk.com/installDesign/3129365-bd88a72e56"><img style="border-style: none" src="http://plurkskins.com/images/install_themeUP.png" onmouseover="this.src='http://plurkskins.com/images/install_themeMO.png';" onmousedown="this.src='http://plurkskins.com/images/install_themeDN.png';" onmouseout="this.src='http://plurkskins.com/images/install_themeUP.png';" alt="Install Theme" name="install" id="install" width="150" height="50"></a></div>

<p>Update: This theme has been updated to reflect the changes made to Plurk through January 13, 2009.</p>]]>
    </content>
</entry>

<entry>
    <title>Christmas theme</title>
    <link rel="alternate" type="text/html" href="http://plurkskins.com/2008/12/christmas-theme.html" />
    <id>tag:plurkskins.com,2008://1.43</id>

    <published>2008-12-02T00:19:33Z</published>
    <updated>2009-01-14T00:31:58Z</updated>

    <summary>One of the best contemporary Christmas movies has to be A Christmas Story. There&apos;s just something about following poor Ralphie as he tries to convince his parents, teacher, and Santa Claus that a Red Ryder air rifle would be the...</summary>
    <author>
        <name>Jeff Summers</name>
        <uri>http://jeffdsummers.com</uri>
    </author>
    
        <category term="Plurk Theme" scheme="http://www.sixapart.com/ns/types#category" />
    
    <category term="christmas" label="Christmas" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="holiday" label="holiday" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="theme" label="theme" scheme="http://www.sixapart.com/ns/types#tag" />
    
    <content type="html" xml:lang="en" xml:base="http://plurkskins.com/">
        <![CDATA[<p>One of the best contemporary Christmas movies has to be A Christmas Story.  There's just something about following poor Ralphie as he tries to convince his parents, teacher, and Santa Claus that a Red Ryder air rifle would be the perfect gift.  When this movie makes it's annual appearance on television it signifies the beginning of the Christmas season. </p>]]>
        <![CDATA[<p>I developed this theme to pay tribute to the movie and it has a few interesting features that you might find helpful.</p>

<p>Some of the more interesting features include the use of a red and a green Christmas ornament icons to identify new Plurk messages and replies. <span class="mt-enclosure mt-enclosure-image" style="display: inline;"><a href="http://plurkskins.com/assets_c/2009/01/Christmas.html" onclick="window.open('http://plurkskins.com/assets_c/2009/01/Christmas.html','popup','width=1170,height=1168,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img src="http://plurkskins.com/assets_c/2009/01/Christmas-thumb-400x399.jpg" width="400" height="399" alt="Christmas.jpg" class="mt-image-right" style="float: right; margin: 0 0 20px 20px;" /></a></span>An unread message shows an green ornament with red numbers while a read message will show a red ornament and green numbers. This is slightly different than the typical colored box that you see.<br />
For those who don't want to see their Karma score, I have replaced it with three wrapped presents.<br />
The loading graphic in the timeline has been replaced with a graphic of Santa's sleigh and his bag of toys. This will appear whenever you scroll through your timeline left or right. There is also a new loading graphic in the response box. This one is Santa Clause dancing in a small animation.<br />
The scroll left and right arrows have also been replaced with Rudolph. When you hover over him with your mouse he points with his leg. The "Back to Home" blue button has been replaced with the Abominable Snowman. When you hover over him with your mouse he puts a star on top of the Christmas tree.<br />
The Plurk creature has been removed and replaced with Alvin and the Chipmunks.<br />
I think you will find this theme fairly full-function with a lot of detail added. If you have questions please feel free to contact me. I hope you enjoy this theme and be sure to tell everyone you got it from <a href="http://plurkskins.com">Plurk Skins</a>.</p>

<div style="text-align: center;"><a href="http://www.plurk.com/installDesign/3129365-98471d1522"><img style="border-style: none" src="http://plurkskins.com/images/install_themeUP.png" onmouseover="this.src='http://plurkskins.com/images/install_themeMO.png';" onmousedown="this.src='http://plurkskins.com/images/install_themeDN.png';" onmouseout="this.src='http://plurkskins.com/images/install_themeUP.png';" alt="Install Theme" name="install" id="install" width="150" height="50"></a></div>

<p><strong>Update:</strong> <em>This theme has been updated to reflect the changes made to Plurk through January 13, 2009.</em><br />
</p>]]>
    </content>
</entry>

<entry>
    <title>Thanksgiving Theme</title>
    <link rel="alternate" type="text/html" href="http://plurkskins.com/2008/11/thanksgiving-theme.html" />
    <id>tag:plurkskins.com,2008://1.42</id>

    <published>2008-11-13T23:59:18Z</published>
    <updated>2009-01-14T00:09:30Z</updated>

    <summary>The holiday season kicks off in full gear with Thanksgiving. There is just something special about getting together with family and friends and reflecting on those things in your life that you are most grateful for. At I stopped to...</summary>
    <author>
        <name>Jeff Summers</name>
        <uri>http://jeffdsummers.com</uri>
    </author>
    
        <category term="Plurk Theme" scheme="http://www.sixapart.com/ns/types#category" />
    
    <category term="holiday" label="holiday" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="thanksgiving" label="Thanksgiving" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="theme" label="theme" scheme="http://www.sixapart.com/ns/types#tag" />
    
    <content type="html" xml:lang="en" xml:base="http://plurkskins.com/">
        <![CDATA[<p>The holiday season kicks off in full gear with Thanksgiving.  There is just something special about getting together with family and friends and reflecting on those things in your life that you are most grateful for.  At I stopped to think about this I began to count all the blessings I have been given such as a healthy family, wonderful friends, and of course cascading style sheets.</p>]]>
        <![CDATA[<p>I developed this theme for Thanksgiving and it has a few interesting features that you might find helpful.</p>

<p>Some of the more interesting features include the use of a pilgrim and an American Indian icons to identify new Plurk messages and replies. <span class="mt-enclosure mt-enclosure-image" style="display: inline;"><a href="http://plurkskins.com/assets_c/2009/01/Thanksgiving.html" onclick="window.open('http://plurkskins.com/assets_c/2009/01/Thanksgiving.html','popup','width=1170,height=1168,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img src="http://plurkskins.com/assets_c/2009/01/Thanksgiving-thumb-400x399.jpg" width="400" height="399" alt="Thanksgiving.jpg" class="mt-image-right" style="float: right; margin: 0 0 20px 20px;" /></a></span>An unread message shows an American Indian with red numbers while a read message will show a pilgrim and green numbers. This is slightly different than the typical colored box that you see.<br />
For those who don't want to see their Karma score, I have replaced it with a cornecopia.<br />
The loading graphic in the timeline has been replaced with a graphic of a turkey being stuffed or "loaded". This will appear whenever you scroll through your timeline left or right. There is also a new loading graphic in the response box. This one is a turkey with a football running down the field in a small animation.<br />
The scroll left and right arrows have also been replaced with turkey legs. When you hover over them with your mouse a bite is taken out of the turkey leg. The "Back to Home" blue button has been replaced with a freshly baked pumpkin pie. When you hover over it with your mouse the pie gets a dollop of whipped cream and text appears on the pie.<br />
The Plurk creature has been removed and replaced with an American Indian.<br />
I think you will find this theme fairly full-function with a lot of detail added. If you have questions please feel free to contact me. I hope you enjoy this theme and be sure to tell everyone you got it from <a href="http://plurkskins.com">Plurk Skins</a>.</p>

<div style="text-align: center;"><a href="http://www.plurk.com/installDesign/3129365-2d90624196"><img style="border-style: none" src="http://plurkskins.com/images/install_themeUP.png" onmouseover="this.src='http://plurkskins.com/images/install_themeMO.png';" onmousedown="this.src='http://plurkskins.com/images/install_themeDN.png';" onmouseout="this.src='http://plurkskins.com/images/install_themeUP.png';" alt="Install Theme" name="install" id="install" width="150" height="50"></a></div>

<p><strong>Update:</strong> <em>This theme has been updated to reflect the changes made to Plurk through January 13, 2009.</em></p>]]>
    </content>
</entry>

<entry>
    <title>Green Beret Theme</title>
    <link rel="alternate" type="text/html" href="http://plurkskins.com/2008/11/green-beret-theme.html" />
    <id>tag:plurkskins.com,2008://1.41</id>

    <published>2008-11-10T22:57:19Z</published>
    <updated>2009-01-13T23:33:00Z</updated>

    <summary>While I was searching for a suitable background for my Veteran&apos;s Day theme I came across another background image that really touched me. I&apos;ve therefore created a second Veteran&apos;s Day theme with this background as well. This version features members...</summary>
    <author>
        <name>Jeff Summers</name>
        <uri>http://jeffdsummers.com</uri>
    </author>
    
        <category term="Plurk Theme" scheme="http://www.sixapart.com/ns/types#category" />
    
    <category term="holiday" label="holiday" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="theme" label="theme" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="veteransday" label="Veteran&apos;s Day" scheme="http://www.sixapart.com/ns/types#tag" />
    
    <content type="html" xml:lang="en" xml:base="http://plurkskins.com/">
        <![CDATA[<p>While I was searching for a suitable background for my <a href="http://plurkskins.com/2008/11/veterans-day-theme.html">Veteran's Day theme</a> I came across another background image that really touched me.  I've therefore created a second Veteran's Day theme with this background as well.  This version features members of the Green Berets as they salute their fellow soldiers and their flag. This simple action should be a reminder to all of us how indebted we are to those who served their country.</p>]]>
        <![CDATA[<p>I also developed this theme for Veterans Day and it has a few interesting features that you might find helpful.</p>

<p>Some of the more interesting features include the use of the Uncle Sam and Liberty Bell icons to identify new Plurk messages and replies. <span class="mt-enclosure mt-enclosure-image" style="display: inline;"><a href="http://plurkskins.com/assets_c/2009/01/GreenBeret.html" onclick="window.open('http://plurkskins.com/assets_c/2009/01/GreenBeret.html','popup','width=1170,height=1168,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img src="http://plurkskins.com/assets_c/2009/01/GreenBeret-thumb-400x399.jpg" width="400" height="399" alt="GreenBeret.jpg" class="mt-image-right" style="float: right; margin: 0 0 20px 20px;" /></a></span>An unread message shows a Uncle Sam with red numbers while a read message will show the Liberty Bell and blue numbers. This is slightly different than the typical colored box that you see.<br />
For those who don't want to see their Karma score, I have replaced it with a flag draped coffin. It could be a metaphor to how you feel about Karma or it could just be a commemoration for those who have died preserving our way of life.<br />
The loading graphic in the timeline has been replaced with a graphic of the Iwo Jima flag raising. This will appear whenever you scroll through your timeline left or right. There is also a new loading graphic in the response box. This one is a navy helicopter with the rotors moving in a small animation.<br />
The scroll left and right arrows have also been replaced with bald eagles. When you hover over them with your mouse the eagles go into an attack position. The "Back to Home" blue button has been replaced with a picture of a soldier returning home holding his daughter that says "Home". When you hover over it with your mouse the text changes colors.<br />
The Plurk creature has been removed to not take away from the background image.<br />
I think you will find this theme fairly full-function with a lot of detail added. If you have questions please feel free to contact me.  I hope you enjoy this theme and be sure to tell everyone you got it from <a href="http://plurkskins.com">Plurk Skins</a>.<br />
<div style="text-align: center;"><a href="http://www.plurk.com/installDesign/3129365-01dff35e64"><img style="border-style: none" src="http://plurkskins.com/images/install_themeUP.png" onmouseover="this.src='http://plurkskins.com/images/install_themeMO.png';" onmousedown="this.src='http://plurkskins.com/images/install_themeDN.png';" onmouseout="this.src='http://plurkskins.com/images/install_themeUP.png';" alt="Install Theme" name="install" id="install" width="150" height="50"></a></div></p>

<p><strong>Update:</strong> <em>This theme has been updated to reflect the changes made to Plurk through January 13, 2009.</em></p>]]>
    </content>
</entry>

<entry>
    <title>Veteran&apos;s Day Theme</title>
    <link rel="alternate" type="text/html" href="http://plurkskins.com/2008/11/veterans-day-theme.html" />
    <id>tag:plurkskins.com,2008://1.40</id>

    <published>2008-11-09T22:07:02Z</published>
    <updated>2009-01-13T23:31:19Z</updated>

    <summary>As I was thinking about all of the freedoms we enjoy I began to think that perhaps it might be appropriate to create a theme for Veteran&apos;s Day to pay tribute to those who have defended our liberties. From the...</summary>
    <author>
        <name>Jeff Summers</name>
        <uri>http://jeffdsummers.com</uri>
    </author>
    
        <category term="Plurk Theme" scheme="http://www.sixapart.com/ns/types#category" />
    
    <category term="holiday" label="holiday" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="theme" label="theme" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="veteransday" label="Veteran&apos;s Day" scheme="http://www.sixapart.com/ns/types#tag" />
    
    <content type="html" xml:lang="en" xml:base="http://plurkskins.com/">
        <![CDATA[<p>As I was thinking about all of the freedoms we enjoy I began to think that perhaps it might be appropriate to create a theme for Veteran's Day to pay tribute to those who have defended our liberties.  From the comments that I have received I decided this theme would be a great candidate to share with others so that they too can show how important Veterans have been to our way of life.</p>]]>
        <![CDATA[<p>I developed this for Veterans Day and it has a few interesting features that you might find helpful.</p>

<p>Some of the more interesting features include the use of the Uncle Sam and Liberty Bell icons to identify new Plurk messages and replies. <span class="mt-enclosure mt-enclosure-image" style="display: inline;"><a href="http://plurkskins.com/assets_c/2009/01/VeteransDay.html" onclick="window.open('http://plurkskins.com/assets_c/2009/01/VeteransDay.html','popup','width=1170,height=1168,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img src="http://plurkskins.com/assets_c/2009/01/VeteransDay-thumb-400x399.jpg" width="400" height="399" alt="VeteransDay.jpg" class="mt-image-right" style="float: right; margin: 0 0 20px 20px;" /></a></span>An unread message shows a Uncle Sam with red numbers while a read message will show the Liberty Bell and blue numbers. This is slightly different than the typical colored box that you see.<br />
For those who don't want to see their Karma score, I have replaced it with a flag draped coffin. It could be a metaphor to how you feel about Karma or it could just be a commemoration for those who have died preserving our way of life.<br />
The loading graphic in the timeline has been replaced with a graphic of the Iwo Jima flag raising. This will appear whenever you scroll through your timeline left or right. There is also a new loading graphic in the response box. This one is a navy helicopter with the rotors moving in a small animation.<br />
The scroll left and right arrows have also been replaced with bald eagles. When you hover over them with your mouse the eagles go into an attack position. The "Back to Home" blue button has been replaced with a picture of a soldier returning home holding his daughter that says "Home". When you hover over it with your mouse the text changes colors.<br />
The Plurk creature has been removed to not take away from the background image.<br />
I think you will find this theme fairly full-function with a lot of detail added. If you have questions please feel free to contact me.  I hope you enjoy this theme and be sure to tell everyone you got it from <a href="http://plurkskins.com">Plurk Skins</a>.<br />
<div style="text-align: center;"><br />
<a href="http://www.plurk.com/installDesign/3129365-11d040b299"><img style="border-style: none" src="http://plurkskins.com/images/install_themeUP.png" onmouseover="this.src='http://plurkskins.com/images/install_themeMO.png';" onmousedown="this.src='http://plurkskins.com/images/install_themeDN.png';" onmouseout="this.src='http://plurkskins.com/images/install_themeUP.png';" alt="Install Theme" name="install" id="install" width="150" height="50"></a></div></p>

<p><strong>Update:</strong> <em>This theme has been updated to reflect the changes made to Plurk through January 13, 2009.</em></p>]]>
    </content>
</entry>

<entry>
    <title>Haunted Mansion Theme</title>
    <link rel="alternate" type="text/html" href="http://plurkskins.com/2008/10/haunted-mansion-theme.html" />
    <id>tag:plurkskins.com,2008://1.39</id>

    <published>2008-10-31T19:48:12Z</published>
    <updated>2009-01-13T23:29:39Z</updated>

    <summary>As I work through the CSS code for Plurk I sometimes begin to question how things work and whether I can modify them for my own warped use. Since I try not to introduce this madness onto the unsuspecting masses...</summary>
    <author>
        <name>Jeff Summers</name>
        <uri>http://jeffdsummers.com</uri>
    </author>
    
        <category term="Plurk Theme" scheme="http://www.sixapart.com/ns/types#category" />
    
    <category term="halloween" label="Halloween" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="profile" label="profile" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="theme" label="theme" scheme="http://www.sixapart.com/ns/types#tag" />
    
    <content type="html" xml:lang="en" xml:base="http://plurkskins.com/">
        <![CDATA[<p>As I work through the CSS code for Plurk I sometimes begin to question how things work and whether I can modify them for my own warped use.  Since I try not to introduce this madness onto the unsuspecting masses I usually end up updating my own personal profile theme.  Sometimes I'll have people ask if I would please share the code so that they too can us it.  I'm always more than happy to provide whatever help I can so every so often I'll include a post where I will give you the code from my profile page that you are free to use.</p>]]>
        <![CDATA[<p>The first of this series is what I refer to as the Haunted Mansion theme.  I developed this for Halloween and it has a few interesting features that you might find helpful.</p>

<p>Some of the more interesting features include the use of pumpkin and skull icons to identify new Plurk messages and replies.  An unread message shows a pumpkin with orange numbers while a read message will show a skull and green numbers.  <span class="mt-enclosure mt-enclosure-image" style="display: inline;"><a href="http://plurkskins.com/assets_c/2009/01/Halloween.html" onclick="window.open('http://plurkskins.com/assets_c/2009/01/Halloween.html','popup','width=1170,height=1168,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img src="http://plurkskins.com/assets_c/2009/01/Halloween-thumb-400x399.jpg" width="400" height="399" alt="Halloween.jpg" class="mt-image-right" style="float: right; margin: 0 0 20px 20px;" /></a></span>This is slightly different than the typical colored box that you see.<br />
For those who don't want to see their Karma score, I have replaced it with an opening coffin.  It could be a metaphor to how you really feel about Karma or it could just be a holiday decoration, it's up to you to decide how to interpret it.<br />
The loading graphic in the timeline has been replaced with a Disney pumpkin just so things are not too scary.  This will appear whenever you scroll through your timeline left or right.  There is also a new loading graphic in the response box.  This one is a set of kids trick-or-treating where they hold out their bags for candy in a small animation.<br />
The scroll left and right arrows have also been replaced with skeleton hands.  When you hover over them with your mouse the bones will point the way.  The "Back to Home" blue button has been replaced with a tombstone that says "Home".  When you hover over it with your mouse the epitaph will change to "R.I.P. Karma" again having fun with the holiday spirit.<br />
The Plurk creature has been replaced with The Haunted Mansion sign from Disneyland.  My usual Plurk creature is Horny Stitch whose graphic is 8.png.  If you are using a different creature you will need to modify the CSS for the appropriate creature.  A list of creatures and their corresponding image numbers can be found in the tutorial <a href="http://plurkskins.com/2008/08/replacing-the-plurk-creature.html">Replacing the Plurk Creature</a> here on Plurk Skins.<br />
I think you will find this theme fairly full-function with a lot of detail added.  I hope you enjoy the theme and tell everyone you got on <a href="http://plurkskins.com">PlurkSkins</a>!</p>

<div style="text-align: center;"><a href="http://www.plurk.com/installDesign/3129365-dd8cdb7fe0"><img style="border-style: none" src="http://plurkskins.com/images/install_themeUP.png" onmouseover="this.src='http://plurkskins.com/images/install_themeMO.png';" onmousedown="this.src='http://plurkskins.com/images/install_themeDN.png';" onmouseout="this.src='http://plurkskins.com/images/install_themeUP.png';" alt="Install Theme" name="install" id="install" width="150" height="50"></a></div>

<p><strong>Update:</strong> <em>This theme has been updated to reflect the changes made to Plurk through January 13, 2009.</em></p>]]>
    </content>
</entry>

<entry>
    <title>Everything&apos;s Changing</title>
    <link rel="alternate" type="text/html" href="http://plurkskins.com/2008/10/everythings-changing.html" />
    <id>tag:plurkskins.com,2008://1.38</id>

    <published>2008-10-29T02:47:54Z</published>
    <updated>2008-10-29T07:43:07Z</updated>

    <summary>Over the course of the last 24 hours the Plurk development team rolled out several new features to the Plurk community. Many of these were welcomed additions but a few of them had an undesirable impact. It was definitely one...</summary>
    <author>
        <name>Jeff Summers</name>
        <uri>http://jeffdsummers.com</uri>
    </author>
    
        <category term="New Features" scheme="http://www.sixapart.com/ns/types#category" />
    
    <category term="css" label="css" scheme="http://www.sixapart.com/ns/types#tag" />
    
    <content type="html" xml:lang="en" xml:base="http://plurkskins.com/">
        <![CDATA[<p>Over the course of the last 24 hours the Plurk development team rolled out several new features to the Plurk community.  Many of these were welcomed additions but a few of them had an undesirable impact.  It was definitely one of those good news/bad news kind of things.  The good news is that the features introduced are great additions to an already good product.  The first new functionality was the inclusion of a "Block User" button to the user's profile. You now have the capability to block a user directly from their profile.  This has been something that the user community has been asking about for quite some time so it's inclusion brought a lot of joy from the user base.  The default graphic is a red square button so you can bet that I'll be covering how to theme that in an upcoming tutorial so it matches the style and color scheme of your profile page.  The second new feature that was introduced was the ability to follow or friend someone directly from the friend/fan page.  This again brings great strides in usability to the interface.  Both of these show that the developers are definitely listening to the users which is one of the best reasons for using Plurk versus one of the other micro-blogging services.<br />
Now for the bad news.  I should probably preface this by saying this isn't necessarily bad news just that it had implications to a lot of users that were somewhat unexpected.  In an effort to make Plurk faster and more scalable, the development team made several changes to the CSS files.  These changes should make things run a little faster as the files have been optimized at least initially.  As a result several areas may have broken if you have modified or customized your CSS profile.  <br />
From first glance it appears the changes have impacted the following:</p><ul><li>Modified the Karma arrow and added an element ID for it</li><li>Added a SPAN and background image to the Find Twitter Friends box</li><li>Added a SPAN and background image to the Embed Plurk Widget box</li><li>Added a SPAN and background image to the Mobile Plurk link box</li><li>Added a SPAN and background image to the Invite or Find Your Friends box</li><li>Added an element for the Loading Image</li><li>Added an element for the left browse arrow image</li><li>Added an element for the right browse arrow image</li><li>Added an element for the Back to Today image</li><li>Added an element for the update box divider (# new plurks/# new responses)<br /></li></ul>There are probably other changes that have been added that I haven't come across yet and I will try to document them were I can.&nbsp; I've created a <a href="http://www.plurk.com/p/6nyqq">Plurk message</a> that I am updating as I find new items.&nbsp; I've already updated the existing <a href="http://plurkskins.com/">Plurk Skins</a> tutorials to include these changes so if you read a tutorial before and read it again now don't be confused if the text seems different than you remember.<br />Over the course of the next several days and weeks I'll continue to try and add new tutorials to the site.&nbsp; I'm also toying with the idea of releasing the themes that I am creating such as the Halloween theme you might have seen.&nbsp; I'm currently working on a Thanksgiving theme and I am in the initial planning stages to create a Christmas theme.&nbsp; I'll continue to use the motorcycle theme for continuity in the tutorials as well.<br />As always, if you have an idea for a tutorial or a theme please don't hesitate to ask and I will see what I can do to create something to meet your needs.&nbsp; As always I suggest <a href="http://plurk.com/redeemByURL?from_uid=26229&amp;check=285938079&amp;s=1">following my Plurk account</a> or check back often to stay abreast of anything new on the site.<br />]]>
        
    </content>
</entry>

<entry>
    <title>Theming the Private Plurks, Languages &amp; Options Button</title>
    <link rel="alternate" type="text/html" href="http://plurkskins.com/2008/10/theming-the-private-plurks-lan.html" />
    <id>tag:plurkskins.com,2008://1.37</id>

    <published>2008-10-27T22:19:20Z</published>
    <updated>2008-10-27T22:46:21Z</updated>

    <summary>While I was writing the tutorials on the Dashboard Buttons I noticed that Plurk had created a new box below the main input field to select Private Plurks, define the language of the Plurk, and allow the user to set...</summary>
    <author>
        <name>Jeff Summers</name>
        <uri>http://jeffdsummers.com</uri>
    </author>
    
        <category term="CSS Profile" scheme="http://www.sixapart.com/ns/types#category" />
    
    <category term="buttons" label="buttons" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="css" label="css" scheme="http://www.sixapart.com/ns/types#tag" />
    <category term="roundedcorners" label="rounded corners" scheme="http://www.sixapart.com/ns/types#tag" />
    
    <content type="html" xml:lang="en" xml:base="http://plurkskins.com/">
        <![CDATA[<p>While I was writing the tutorials on the <a href="http://plurkskins.com/2008/10/create-dashboard-buttons-for-twitter-contacts-widget-mobile.html">Dashboard Buttons</a> I noticed that Plurk had created a new box below the main input field to select Private Plurks, define the language of the Plurk, and allow the user to set options on the message.  This used to be just a text link but now has the appearance of being a button.  They added an icon of a padlock to the left side.  Unfortunately the orange background color they used clashes with just about every known color on the planet.  It was clear that something needed to be done with that and quickly so I created this short tutorial that will make this area more aesthetically pleasing.</p>]]>
        <![CDATA[<p>As we always do we'll begin by providing all of the code to allow you to copy and paste it directly into your profile to begin using the new functionality immediately.<br />
</p><blockquote> /* Private Plurks, languages &amp; options */<br />#more_options_link {<br />&nbsp;&nbsp; &nbsp;background: #ff6600 url(/static/timeline/private-lock.png) no-repeat scroll 4px 3px;<br />&nbsp;&nbsp; &nbsp;border-color: #FF9955 #A14000 #A14000 #FF9955;<br />&nbsp;&nbsp; &nbsp;-moz-border-radius: 4px 4px 4px 4px;<br />&nbsp;&nbsp; &nbsp;-khtml-border-radius: 4px;<br />&nbsp;&nbsp; &nbsp;-webkit-border-radius: 4px;<br />&nbsp;&nbsp; &nbsp;border-radius: 4px;<br />}<br />/* End Private Plurks, languages &amp; options */<br /></blockquote>
We'll now follow up by discussing each line of code so that you will understand what each section does and why it is in the profile. As I always do, I strongly recommend documenting the code by making notes for yourself so that you can remember why you added the code. This is extremely important if you ever need to go back to your profile and troubleshoot or modify it.<br />
The first line of code is the now familiar background command.  This is the same command as we have used in the past.  The background command is made up of several parameters which we'll now explain.  The first parameter is for background color.  In this case we are setting the background color to the bright orange that we have used throughout our theme.  The next parameter is the background image.  With the value of the URL we tell the system where to find the background image.  In this case we are using the Plurk image of the padlock that was used in the default.  If you wanted to add your own image just replace the value in the URL section of the background command.  The next parameter tells the system not to repeat the image making it appear only once.  The scroll parameter tells the system to allow the background image to move with the screen when the user horizontally and vertically scrolls the window.  The final parameter tells the system to place the image at coordinates 4px,3px basically putting it 4 pixels from the left edge and 3 pixels from the top.<br />
The next command will define the border colors on this box.  In our case we are using a light orange color on the top and left sides of the box and a darker orange on the bottom and right sides.  This gives the box a three-dimensional look that meshes well with the other theme elements we have been using.<br />
The final four commands round the corners of this new box giving it a similar look and feel to the other buttons we have created on the site.  These are the same border rounding techniques we have used in the past.  These are CSS3 commands so they only work on CSS3 compliant browsers.  At this point that includes Safari and Firefox but does not include Internet Explorer.  In IE you will still see the square corners.<br />
Well that's about all there is to theming the new Private Plurks box that appears below the input field and above dashboard.  After this tutorial you will have a customized button for your Private Plurks and options  that fits in with the rest of your theme.  Hopefully you will find this useful.  Good luck and be sure to let everyone know you found this on <a href="http://plurkskins.com/mt-static/html/%E2%80%9Dhttp://plurkskins.com%E2%80%9D">Plurk Skins</a>.]]>
    </content>
</entry>

</feed>
