<?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>mummey.org &#187; design</title>
	<atom:link href="http://www.mummey.org/category/design/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.mummey.org</link>
	<description>Personal Website of Adrian Mummey</description>
	<lastBuildDate>Tue, 27 Oct 2009 03:11:46 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.8.5</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>First Wordpress Theme &#8211; My Development Toolbox</title>
		<link>http://www.mummey.org/2009/02/first-wordpress-theme-my-development-toolbox/</link>
		<comments>http://www.mummey.org/2009/02/first-wordpress-theme-my-development-toolbox/#comments</comments>
		<pubDate>Thu, 05 Feb 2009 14:04:47 +0000</pubDate>
		<dc:creator>Adrian Mummey</dc:creator>
				<category><![CDATA[design]]></category>
		<category><![CDATA[news]]></category>
		<category><![CDATA[blueprint]]></category>
		<category><![CDATA[coda]]></category>
		<category><![CDATA[css]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[jQuery]]></category>

		<guid isPermaLink="false">http://www.mummey.org/?p=66</guid>
		<description><![CDATA[My friend Andy recently asked me to help him redesign his website. He runs fly fishing tours here in Mongolia and wasn&#8217;t happy with his current site design. He recently switched most of his websites from Joomla! over to Wordpress. When he came to me with the request I was very excited to help as [...]]]></description>
			<content:encoded><![CDATA[<p>My friend Andy recently asked me to help him redesign his website. He runs fly fishing tours here in Mongolia and wasn&#8217;t happy with his current site design. He recently switched most of his websites from Joomla! over to Wordpress. When he came to me with the request I was very excited to help as most of my templating/design experience has been strictly for Joomla! or custom projects, I had yet to really delve into creating a Wordpress theme. During the whole process I learned quite a bit about the inner workings of Wordpress and have already applied this knowledge to working on my own blog (and hopefully soon designing a theme for mummey.org). Another thing that surprised me was how straightforward the whole process was, there are so many great tools and plugins for Wordpress that we encountered very few problems throughout the design process.</p>
<p>But before starting any programming or design process, it is important to have a good set of tools and resources at your disposal. So the main purpose of this post is to detail most of the tools I used that may help you along with designing your own Wordpress theme.</p>
<h3 class="children">Code Base</h3>
<ul class="list-no-style">
<li>
<div id="attachment_96" class="wp-caption alignleft" style="width: 160px"><a href="http://www.plaintxt.org/themes/sandbox/" target="_blank"><img src="http://www.mummey.org/wp-content/uploads/2009/02/sandbox-c2b7-plaintxtorg-1-150x91.jpg" alt="Wordpress Sandbox" title="sandbox-c2b7-plaintxtorg-1" width="150" height="91" class="size-thumbnail wp-image-96" /></a><p class="wp-caption-text">Wordpress Sandbox</p></div><br />
<a href="http://www.plaintxt.org/themes/sandbox/" title="Wordpress Sandbox" target="_blank">Wordpress Sandbox</a> &#8211; The starting point for my theme. This is a great template that you can just add some formatting and customization and has almost all the functions you need to make a great template.
</li>
</ul>
<h3 class="children">Development Tools</h3>
<ul class="list-no-style">
<li>
<div id="attachment_77" class="wp-caption alignleft" style="width: 130px"><a href="http://www.panic.com" target="_blank"><img class="size-full wp-image-77" title="panic-shockingly-good-mac-software" src="http://www.mummey.org/wp-content/uploads/2009/02/panic-shockingly-good-mac-software.jpg" alt="Coda by Panic" width="120" height="124" /></a><p class="wp-caption-text">Coda by Panic</p></div><br />
<a title="Coda" href="http://www.panic.com" target="_blank">Coda</a> &#8211; I have tried quite a few IDEs and I have found anything that I enjoy working with more than Coda. Everything just seems to flow really well and some some great features like integrated SVN, a great FTP utility, SSH terminal and a lot more. I feel that it is a steal at only 99$.
</li>
<li>
<div id="attachment_115" class="wp-caption alignleft" style="width: 160px"><a href="http://getfirebug.com/" target="_blank"><img src="http://www.mummey.org/wp-content/uploads/2009/02/firebug-web-development-evolved-150x150.jpg" alt="Firebug" title="firebug-web-development-evolved" width="150" height="150" class="size-thumbnail wp-image-115" /></a><p class="wp-caption-text">Firebug</p></div><br />
<a title="Firebug" href="http://getfirebug.com/" target="_blank">Firebug</a> &#8211; Firebug is a must have for any web developer. It gives you a very detailed look at webpages including the DOM, CSS, JS, HTML and also has a handy inspector for helping to solve formatting issues. I often use it to just quickly play around with different color and formatting values to find ones that work.
</li>
</ul>
<h3 class="children">Javascript and CSS</h3>
<ul class="list-no-style">
<li>
<div id="attachment_79" class="wp-caption alignleft" style="width: 160px"><a href="http://www.blueprintcss.org/" target="_blank"><img src="http://www.mummey.org/wp-content/uploads/2009/02/blueprint_-a-css-framework-spend-your-time-innovating-not-replicating-150x92.jpg" alt="Blueprint CSS" title="blueprint_-a-css-framework-spend-your-time-innovating-not-replicating" width="150" height="92" class="size-thumbnail wp-image-79" /></a><p class="wp-caption-text">Blueprint CSS</p></div><br />
<a href="http://www.blueprintcss.org/" title="Blueprint CSS Framework" target="_blank">Blueprint CSS Framework</a> &#8211; I would say that most of the projects I do a lot of custom design work, I try to incorporate Blueprint. It is a great start for anyone wanting to make clean, multicolumn layouts. It also takes care of a lot of spacing and typography for you and works with IE6 too.
</li>
<li>
<div id="attachment_85" class="wp-caption alignleft" style="width: 160px"><a href="http://www.jquery.com" target="_blank"><img src="http://www.mummey.org/wp-content/uploads/2009/02/jquery_-the-write-less-do-more-javascript-library-150x77.jpg" alt="jQuery JS Library" title="jquery_-the-write-less-do-more-javascript-library" width="150" height="77" class="size-thumbnail wp-image-85" /></a><p class="wp-caption-text">jQuery JS Library</p></div><br />
<a href="http://www.jquery.com" title="jQuery" target="_blank">jQuery</a> &#8211; There isn&apos;t much to say about jQuery that hasn&#8217;t already been said. It is the best JS framework out there and with the new release a lot of new features have been added.
</li>
<li>
<div id="attachment_88" class="wp-caption alignleft" style="width: 160px"><a href="http://code.google.com/apis/ajaxlibs/" target="_blank"><img src="http://www.mummey.org/wp-content/uploads/2009/02/ajax-libraries-api-google-code-150x99.jpg" alt="Google Ajax Libraries" title="ajax-libraries-api-google-code" width="150" height="99" class="size-thumbnail wp-image-88" /></a><p class="wp-caption-text">Google Ajax Libraries</p></div><br />
<a href="http://code.google.com/apis/ajaxlibs/" title="Google Ajax Libraries" target="_blank">Google Ajax Libraries</a> &#8211; This service offered by Google allows you to let them host your javascript/ajax libraries rather than you having to host them. From the site <i>&#8220;We take the pain out of hosting the libraries, correctly setting cache headers, staying up to date with the most recent bug fixes, etc. &#8220;</i>
</li>
<li>
<div id="attachment_111" class="wp-caption alignleft" style="width: 160px"><a href="http://users.tpg.com.au/j_birch/plugins/superfish/#getting-started" target="_blank"><img src="http://www.mummey.org/wp-content/uploads/2009/02/superfish-suckerfish-on-_roids-2.jpg" alt="Superfish" title="superfish-suckerfish-on-_roids-2" width="150" height="80" class="size-full wp-image-111" /></a><p class="wp-caption-text">Superfish</p></div><br />
<a href="http://users.tpg.com.au/j_birch/plugins/superfish/#getting-started" title="Superfish" target="_blank">Superfish</a> &#8211; This is a very cool dropdown menu that uses my favorite javascript framework jQuery. It is very similar to the previous iteration, S.ckerfish, but has some more options and it was very easy to implement into my wordpress template. I also like the support for IE6!</li>
</ul>
<h3 class="children">Other Tools</h3>
<ul class="list-no-style">
<li>
<div id="attachment_118" class="wp-caption alignleft" style="width: 160px"><a href="http://fireftp.mozdev.org/"  target="_blank"><img src="http://www.mummey.org/wp-content/uploads/2009/02/fireftp-the-free-ftp-client-for-mozilla-firefox.jpg" alt="Fireftp" title="fireftp-the-free-ftp-client-for-mozilla-firefox" width="150" height="139" class="size-full wp-image-118" /></a><p class="wp-caption-text">Fireftp</p></div><br />
<a href="http://fireftp.mozdev.org/" title="Fireftp" target="_blank">Fireftp</a> &#8211; This is a lightweight, easy to use firefox plugin that has a bunch of great features found in stand alone FTP programs. I like it mainly because it just sits as a tab in my browser and I don&#8217;t need to mess around with some other FTP program. You can also store and name all of your connections for easy retrieval.
</li>
<li>
<div id="attachment_120" class="wp-caption alignleft" style="width: 160px"><a href="http://skitch.com/"  target="_blank"><img src="http://www.mummey.org/wp-content/uploads/2009/02/skitchcom-skitch-fast-and-fun-screen-capture-and-image-sharing-150x133.jpg" alt="Skitch" title="skitchcom-skitch-fast-and-fun-screen-capture-and-image-sharing" width="150" height="133" class="size-thumbnail wp-image-120" /></a><p class="wp-caption-text">Skitch</p></div><br />
<a href="http://skitch.com/" title="Skitch" target="_blank">Skitch</a> &#8211; A fantastic screen capture program. Skitch is one of the most well designed programs I have ever used. It has a great user interface and is very useful for taking screen captures. There are also some great tools to add some graphics and text on top of your screen caps. I tend to use this program a lot during my development, especially when I need to send prototype images to my clients.
</li>
</ul>
<p><br class="children"/></p>
<a class="a2a_dd addtoany_share_save" href="http://www.addtoany.com/share_save?linkurl=http%3A%2F%2Fwww.mummey.org%2F2009%2F02%2Ffirst-wordpress-theme-my-development-toolbox%2F&amp;linkname=First%20Wordpress%20Theme%20%26%238211%3B%20My%20Development%20Toolbox"><img src="http://www.mummey.org/wp-content/plugins/add-to-any/share_save_171_16.gif" width="171" height="16" alt="Share/Bookmark"/></a>]]></content:encoded>
			<wfw:commentRss>http://www.mummey.org/2009/02/first-wordpress-theme-my-development-toolbox/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
	</channel>
</rss>
