<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Keetee &#187; Web Design</title>
	<atom:link href="http://www.keetee.com/category/web-design/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.keetee.com</link>
	<description>My brain to your browser.</description>
	<lastBuildDate>Tue, 16 Mar 2010 21:14:05 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.8.4</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Wordpress: How to Customize the Date Format for wp_get_archives</title>
		<link>http://www.keetee.com/how-to-customize-the-date-format-for-wp_get_archives/</link>
		<comments>http://www.keetee.com/how-to-customize-the-date-format-for-wp_get_archives/#comments</comments>
		<pubDate>Mon, 17 Aug 2009 16:15:18 +0000</pubDate>
		<dc:creator>Allison House</dc:creator>
				<category><![CDATA[Web Design]]></category>
		<category><![CDATA[archives]]></category>
		<category><![CDATA[php]]></category>
		<category><![CDATA[tutorial]]></category>
		<category><![CDATA[web]]></category>
		<category><![CDATA[wordpress]]></category>
		<category><![CDATA[wp_get_archives]]></category>

		<guid isPermaLink="false">http://www.keetee.com/?p=1032</guid>
		<description><![CDATA[The <a href="http://codex.wordpress.org/Template_Tags/wp_get_archives">wp_get_archives template tag</a> is one you've likely seen before&#8212;it displays date-based archives in a list much like what you see in my sidebar under "Explore." Surprisingly, the parameters accepted for this tag allow no changes in the date format.]]></description>
			<content:encoded><![CDATA[<p>The <a href="http://codex.wordpress.org/Template_Tags/wp_get_archives">wp_get_archives template tag</a> is one you&#8217;ve likely seen before&mdash;it displays date-based archives in a list much like what you see in my sidebar under &#8220;Explore.&#8221; Surprisingly, the parameters accepted for this tag allow no changes in the date format.</p>
<p>It&#8217;s difficult to customize this right from your theme, and I suspect that&#8217;s why I was unable to locate any flexible solutions through the Wordpress forums or Google. The easiest way is to edit the original function itself. <strong>Be warned</strong>: new Wordpress installations will overwrite this fix.</p>
<p><span id="more-1032"></span><br />
<h4>Locate general-template.php</h4>
<p>Open the <strong>wp-includes</strong> folder from the root of your Wordpress install. Open the file <strong>general-template.php</strong> with a text editor and locate the wp_get_archives function. Find the following line:<br />
&nbsp;</p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>820
821
</pre></td><td class="code"><pre class="php" style="font-family:monospace;"><span style="color: #000088;">$text</span> <span style="color: #339933;">=</span> <span style="color: #990000;">sprintf</span><span style="color: #009900;">&#40;</span>__<span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'%1$s %2$d'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span> <span style="color: #000088;">$wp_locale</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">get_month</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$arcresult</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">month</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span> <span style="color: #000088;">$arcresult</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">year</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #666666; font-style: italic;">//</span></pre></td></tr></table></div>

<p>In Wordpress 2.8.4 this is on line 820. The default date format is the full textual representation of the month and the full year. Example: <em>January 2009</em>.</p>
<h4>Alternative Date Formats</h4>
<h5>Short textual representation of month</h5>
<p>Example: <em>Jan 2009</em></p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>820
821
</pre></td><td class="code"><pre class="php" style="font-family:monospace;"><span style="color: #000088;">$text</span> <span style="color: #339933;">=</span> <span style="color: #990000;">sprintf</span><span style="color: #009900;">&#40;</span>__<span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'%1$s %2$d'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span> <span style="color: #000088;">$wp_locale</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">get_month_abbrev</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$wp_locale</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">get_month</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$arcresult</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">month</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span> <span style="color: #000088;">$arcresult</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">year</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #666666; font-style: italic;">//</span></pre></td></tr></table></div>

<h5>Numeric representation of month with leading zero</h5>
<p>Example: <em>01 2009</em></p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>820
821
</pre></td><td class="code"><pre class="php" style="font-family:monospace;"><span style="color: #000088;">$text</span> <span style="color: #339933;">=</span> <span style="color: #990000;">sprintf</span><span style="color: #009900;">&#40;</span>__<span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'%1$s %2$d'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span> zeroise<span style="color: #009900;">&#40;</span><span style="color: #000088;">$arcresult</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">month</span><span style="color: #339933;">,</span> <span style="color: #cc66cc;">2</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span> <span style="color: #000088;">$arcresult</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">year</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #666666; font-style: italic;">//</span></pre></td></tr></table></div>

<h5>Numeric representation of month, no leading zero</h5>
<p>Example: <em>1 2009</em></p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>820
821
</pre></td><td class="code"><pre class="php" style="font-family:monospace;"><span style="color: #000088;">$text</span> <span style="color: #339933;">=</span> <span style="color: #990000;">sprintf</span><span style="color: #009900;">&#40;</span>__<span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'%1$d %2$d'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span> <span style="color: #000088;">$arcresult</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">month</span><span style="color: #339933;">,</span> <span style="color: #000088;">$arcresult</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">year</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #666666; font-style: italic;">//</span></pre></td></tr></table></div>

<h5>Two digit representation of year</h5>
<p>Example: <em>January 09</em></p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>820
821
</pre></td><td class="code"><pre class="php" style="font-family:monospace;"><span style="color: #000088;">$text</span> <span style="color: #339933;">=</span> <span style="color: #990000;">sprintf</span><span style="color: #009900;">&#40;</span>__<span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'%1$s %2$s'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span> <span style="color: #000088;">$wp_locale</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">get_month</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$arcresult</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">month</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span> <span style="color: #990000;">substr</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$arcresult</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">year</span><span style="color: #339933;">,</span> <span style="color: #cc66cc;">2</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #666666; font-style: italic;">//</span></pre></td></tr></table></div>

<h4>Adding Flourishes and Changing Order</h4>
<p>Additional formatting can be applied by just changing <strong>&#8216;%1$s %2$d&#8217;</strong> in that line, where <strong>%1$s</strong> represents the month and <strong>%2$d</strong> represents the year.</p>
<h5>Punctuation between month and year</h5>
<p>These examples use a slash. Replace with dot or dash as desired.</p>
<p>Example: <em>01/2009</em></p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>820
821
</pre></td><td class="code"><pre class="php" style="font-family:monospace;"><span style="color: #000088;">$text</span> <span style="color: #339933;">=</span> <span style="color: #990000;">sprintf</span><span style="color: #009900;">&#40;</span>__<span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'%1$s/%2$d'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span> zeroise<span style="color: #009900;">&#40;</span><span style="color: #000088;">$arcresult</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">month</span><span style="color: #339933;">,</span> <span style="color: #cc66cc;">2</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span> <span style="color: #000088;">$arcresult</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">year</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #666666; font-style: italic;">//</span></pre></td></tr></table></div>

<p>Example: <em>01/09</em></p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>820
821
</pre></td><td class="code"><pre class="php" style="font-family:monospace;"><span style="color: #000088;">$text</span> <span style="color: #339933;">=</span> <span style="color: #990000;">sprintf</span><span style="color: #009900;">&#40;</span>__<span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'%1$s/%2$d'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span> zeroise<span style="color: #009900;">&#40;</span><span style="color: #000088;">$arcresult</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">month</span><span style="color: #339933;">,</span> <span style="color: #cc66cc;">2</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span> <span style="color: #990000;">substr</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$arcresult</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">year</span><span style="color: #339933;">,</span> <span style="color: #cc66cc;">2</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #666666; font-style: italic;">//</span></pre></td></tr></table></div>

<h5>Abbreviated Year</h5>
<p>Example: <em>January &#8216;09</em></p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>820
821
</pre></td><td class="code"><pre class="php" style="font-family:monospace;"><span style="color: #000088;">$text</span> <span style="color: #339933;">=</span> <span style="color: #990000;">sprintf</span><span style="color: #009900;">&#40;</span>__<span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'%1$s /'</span><span style="color: #339933;">%</span><span style="color:#800080;">2</span><span style="color: #000088;">$s</span><span style="color: #0000ff;">'), $wp_locale-&gt;get_month($arcresult-&gt;month), substr($arcresult-&gt;year, 2));
//</span></pre></td></tr></table></div>

<h5>Reversed Month and Year</h5>
<p>Example: <em>2009 January</em></p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>820
821
</pre></td><td class="code"><pre class="php" style="font-family:monospace;"><span style="color: #000088;">$text</span> <span style="color: #339933;">=</span> <span style="color: #990000;">sprintf</span><span style="color: #009900;">&#40;</span>__<span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'%2$d %1$s'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span> <span style="color: #000088;">$wp_locale</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">get_month</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$arcresult</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">month</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span> <span style="color: #000088;">$arcresult</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">year</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #666666; font-style: italic;">//</span></pre></td></tr></table></div>

<h4>Mix, Match, Enjoy!</h4>
<p>There are more combinations than I can reasonably post here, but I hope this helps you figure out how to get the exact date format you want.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.keetee.com/how-to-customize-the-date-format-for-wp_get_archives/feed/</wfw:commentRss>
		<slash:comments>11</slash:comments>
		</item>
		<item>
		<title>Keetee Gets a Major Design Overhaul</title>
		<link>http://www.keetee.com/keetee-gets-a-major-design-overhaul/</link>
		<comments>http://www.keetee.com/keetee-gets-a-major-design-overhaul/#comments</comments>
		<pubDate>Mon, 17 Aug 2009 14:01:50 +0000</pubDate>
		<dc:creator>Allison House</dc:creator>
				<category><![CDATA[Miscellaneous]]></category>
		<category><![CDATA[Web Design]]></category>
		<category><![CDATA[design]]></category>
		<category><![CDATA[Keetee]]></category>
		<category><![CDATA[process]]></category>
		<category><![CDATA[ui]]></category>
		<category><![CDATA[update]]></category>
		<category><![CDATA[web]]></category>
		<category><![CDATA[wordpress]]></category>

		<guid isPermaLink="false">http://www.keetee.com/?p=989</guid>
		<description><![CDATA[When I created Keetee back in January, I was relatively new to this almighty publishing platform called Wordpress. I put together a loose design plan in Photoshop inspired by the simplicity of Nerdist and Good Magazine, then went to work coding it up. The project took around two days&#8212;I recall having completed over a weekend&#8212;and [...]]]></description>
			<content:encoded><![CDATA[<p>When I created Keetee back in January, I was relatively new to this almighty publishing platform called <a href="http://www.wordpress.org">Wordpress</a>. I put together a loose design plan in Photoshop inspired by the simplicity of <a href="http://www.nerdist.com/">Nerdist</a> and <a href="http://www.good.is/">Good Magazine</a>, then went to work coding it up. The project took around two days&mdash;I recall having completed over a weekend&mdash;and the outcome looked something like this:</p>
<p><img src="/images/old_keetee_screenshot.jpg" alt="A Screenshot of the Old Keetee Website Design" class="border" /></p>
<p>For two days of work, I wasn&#8217;t particularly displeased. I was impressed with the ease with which one can build a Wordpress theme, proud of myself for having done so with swiftness, and satisfied with the visual component of the design.</p>
<h5>Queue the Querulousness</h5>
<p>As time wore on, however, the flaws became increasingly apparent&mdash;I&#8217;d taken too many shortcuts, hadn&#8217;t done enough planning, left out details. I eventually became so unhappy with the site I didn&#8217;t want to update for fear new visitors would recognize these doofy indiscretions. Keetee just didn&#8217;t meet my standards for design, and my desire to use it gave way to evanescence.</p>
<p><span id="more-989"></span>With a steady few hundred hits a day, I kept it running so people could benefit from old articles. One of my readers, Yopladas, sent me an e-mail in May asking for updates. &#8220;Nah,&#8221; I responded, &#8220;Keetee is dead.&#8221; Indeed.</p>
<h4>Rekindling Keetee</h4>
<p>When summer began, I resolved to reform my disappointing brainchild. I cooked up a new design that retained some of the same visual elements in the spirit of <a href="http://www.alistapart.com/articles/redesignrealign">realignment</a>.</p>
<p><img src="/images/first_iteration.jpg" alt="A Screenshot of the First Iteration of the New Keetee Design" class="border" /></p>
<p>There are a number of things that are very dull about this version, but it was a starting point. I let it simmer for a few weeks, then kicked off a week-long sprint of planning, designing, and coding to bring the design up to par.</p>
<p><img src="/images/new_keetee_planning.jpg" alt="Planning"  class="border" /></p>
<p>Here are a few things I think I did right:</p>
<h5>1. Improved Spacing</h5>
<p>It&#8217;s important to have a big-picture view when you&#8217;re styling dynamic content. The first time around I didn&#8217;t do enough planning, created a lot of delicately interdependent styling, and ended up using ghetto spacing workarounds because of it. </p>
<h5>2. Details, Details, Details</h5>
<p>I spent a lot of time on the little things. There are the literal little things like accents, icons, and decorative images, but I&#8217;ve also very carefully positioned the layout. Everything is on a grid, the main containers follow the <a href="http://en.wikipedia.org/wiki/Rule_of_thirds">rule of thirds</a>, and a couple special areas pull proportions from the <a href="http://en.wikipedia.org/wiki/Golden_ratio">golden ratio</a>. By mocking up all the details first, there was little experimentation to do when it came down to the code.</p>
<h5>3. No Half-Assing </h5>
<p>Having been new to Wordpress the first time around, there were naturally things I wasn&#8217;t sure how to do. There were several cases where I settled for the default look or setting rather than going the extra mile. This time I spared no expense, ensuring everything looks and works precisely as planned.</p>
<h4>I Hope You Like It</h4>
<p><img src="/images/new_keetee_screenshot.jpg" alt="A Screenshot of the Current Iteration of the New Keetee Design" class="border" /></p>
<p>I spent a full workweek on this new design, so believe me when I say it&#8217;s a labor of love! I hope you like my final product. Drop a comment and let me know what you think.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.keetee.com/keetee-gets-a-major-design-overhaul/feed/</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
	</channel>
</rss>
