<?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>Jenn Mears Web Design &#187; tutorials</title>
	<atom:link href="http://www.jennmearswebdesign.com/category/tutorials/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.jennmearswebdesign.com</link>
	<description>Web Design and Development: 617-816-1209</description>
	<lastBuildDate>Thu, 01 Dec 2011 13:56:29 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3</generator>
		<item>
		<title>How to Re-Size Your Photos on Google</title>
		<link>http://www.jennmearswebdesign.com/2011/11/how-to-re-size-your-photos-on-google/</link>
		<comments>http://www.jennmearswebdesign.com/2011/11/how-to-re-size-your-photos-on-google/#comments</comments>
		<pubDate>Fri, 18 Nov 2011 18:40:37 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[blogging]]></category>
		<category><![CDATA[Lifehacks]]></category>
		<category><![CDATA[tutorials]]></category>
		<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[Google]]></category>
		<category><![CDATA[photos]]></category>
		<category><![CDATA[picasa]]></category>

		<guid isPermaLink="false">http://www.jennmearswebdesign.com/?p=680</guid>
		<description><![CDATA[One of the many reasons that I switched from my hosting provider&#8217;s webmail to a gmail account is the sheer size of the images clients send via email. Which brings up a valid question for a lot of clients who want to add their own images to their WordPress site: How to resize the multi-megabyte <a href='http://www.jennmearswebdesign.com/2011/11/how-to-re-size-your-photos-on-google/'>[...]</a>]]></description>
			<content:encoded><![CDATA[<p>One of the many reasons that I switched from my hosting provider&#8217;s webmail to a gmail account is the sheer size of the images clients send via email.  Which brings up a valid question for a lot of clients who want to add their own images to their WordPress site: How to resize the multi-megabyte images that even a basic cellphone camera will take so that the pictures do not interfere with a site&#8217;s layout and load time?</p>
<p>Since not everyone has Photoshop, is there a way for someone to re-size a large picture to be used on a website or to send via email without jamming the recipient&#8217;s inbox?  Yes!  With Google&#8217;s image tools, Picasa and Picnik, there&#8217;s an easy way to work with your images to resize them online and then use them however you need.</p>
<p><strong>Step 1: If you don&#8217;t have one already, get yourself a Google account. </strong></p>
<p>I love a lot of Google&#8217;s free services.  There&#8217;s gmail of course, which enables me to receive emails on my phone with no hassle and gives me over 7,000 megabytes of storage.  Then there&#8217;s Feedburner which allows me to offer subscriptions to a web site via RSS.  Google Analytics is also another great tool to take advantage of.  For this tutorial though, we&#8217;re going to look at two media tools; Picasa and Picnik.  So go to <a href="http://google.com" target="_blank">google.com</a> and sign up for account if you don&#8217;t have one already.</p>
<p><strong>Step 2: Now that you have your Google username (email) and password, sign in and get started with Picasa.</strong></p>
<div id="attachment_685" class="wp-caption alignleft" style="width: 410px"><a href="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picasa-locate1.jpg"><img class="size-full wp-image-685" title="picasa-locate1" src="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picasa-locate1.jpg" alt="" width="400" height="34" /></a><p class="wp-caption-text">Your Google account&#39;s top toolbar as seen from Gmail window</p></div>
<p>To find Picasa, sign in and then you will see more on the far right of the top toolbar.</p>
<p>&nbsp;</p>
<p>Click that to open a menu where the last item is &#8220;even more&#8221;.</p>
<p style="text-align: center;">&nbsp;</p>
<div id="attachment_686" class="wp-caption aligncenter" style="width: 135px"><a href="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picasa-locate2.jpg"><img class="size-full wp-image-686 " title="picasa-locate2" src="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picasa-locate2.jpg" alt="" width="125" height="453" /></a><p class="wp-caption-text">Click on Even More down at the bottom</p></div>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>Under the Media section, you will see Picasa on the left and Picnik on the right.</p>
<div id="attachment_687" class="wp-caption aligncenter" style="width: 460px"><a href="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picasa-locate3.jpg"><img class="size-full wp-image-687" title="picasa-locate3" src="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picasa-locate3.jpg" alt="" width="450" height="159" /></a><p class="wp-caption-text">Google&#39;s Media Products</p></div>
<p><span style="color: #ff00ff;"><strong>TIP:</strong></span> The direct url to your Picasa account is <a href="https://picasaweb.google.com/home" target="_blank">https://picasaweb.google.com/home</a><br />
You should probably bookmark this page so that you don&#8217;t have to go through Google&#8217;s admittedly convoluted click-throughs every time.</p>
<div id="attachment_688" class="wp-caption aligncenter" style="width: 300px"><a href="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picasabookmarkstoolbar1.jpg"><img class="size-full wp-image-688" title="picasabookmarkstoolbar1" src="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picasabookmarkstoolbar1.jpg" alt="" width="290" height="269" /></a><p class="wp-caption-text">Saving a bookmark in Firefox </p></div>
<p>Now you can get to Picasa without jumping through Google&#8217;s hoops!</p>
<div id="attachment_689" class="wp-caption aligncenter" style="width: 410px"><a href="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picasabookmarkstoolbar2.jpg"><img class="size-full wp-image-689" title="picasabookmarkstoolbar2" src="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picasabookmarkstoolbar2.jpg" alt="" width="400" height="300" /></a><p class="wp-caption-text">Easy one-click access!</p></div>
<p><strong>Step 3: Create your album and upload pictures.</strong><br />
If you decide to just start to upload photos that&#8217;s fine.  Just understand that Google needs to sort them into albums so if you upload a batch of images today, Google will prompt you to create an album with today&#8217;s date (you can always give it a custom name).</p>
<p><strong>Step 4: Once photos have been added to an album, select one to resize.</strong></p>
<div id="attachment_691" class="wp-caption aligncenter" style="width: 251px"><a href="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picasa-landingpage-link.jpg"><img class="size-full wp-image-691 " title="picasa-landingpage-link" src="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picasa-landingpage-link.jpg" alt="" width="241" height="100" /></a><p class="wp-caption-text">Link to your existing albums on Picasa&#39;s home page</p></div>
<div id="attachment_694" class="wp-caption aligncenter" style="width: 366px"><a href="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picasa-youralbums.jpg"><img class="size-full wp-image-694" title="picasa-youralbums" src="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picasa-youralbums.jpg" alt="" width="356" height="280" /></a><p class="wp-caption-text">Click on the album to open it</p></div>
<div id="attachment_693" class="wp-caption aligncenter" style="width: 410px"><a href="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picasa-photosinalbum.jpg"><img class="size-full wp-image-693" title="picasa-photosinalbum" src="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picasa-photosinalbum.jpg" alt="" width="400" height="176" /></a><p class="wp-caption-text">Click on a photo to open it</p></div>
<p>Click on the album that contains your images to open it.  Then click on the image you need to resize.  Once the image is in its own window, you will see a toolbar at the top with a little landscape icon at the top.  Click on that to launch Picnik.</p>
<div id="attachment_695" class="wp-caption aligncenter" style="width: 460px"><a href="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picasa-click-to-edit.jpg"><img class="size-full wp-image-695" title="picasa-click-to-edit" src="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picasa-click-to-edit.jpg" alt="" width="450" height="324" /></a><p class="wp-caption-text">Click landscape icon to launch Picnik</p></div>
<div id="attachment_696" class="wp-caption aligncenter" style="width: 363px"><a href="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picasa-editinpicnik.jpg"><img class="size-full wp-image-696" title="picasa-editinpicnik" src="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picasa-editinpicnik.jpg" alt="" width="353" height="224" /></a><p class="wp-caption-text">You can also click on Actions and then select &quot;Edit in Picnik&quot;</p></div>
<p><span style="color: #ff00ff;"><strong>TIP:</strong> </span>If you want to bypass Picasa, you can just launch Picnik right away and upload photos directly from your harddrive.  I just suggest uploading to Picasa if you are fairly mobile and you want to get the whole process done on the web as opposed to being chained to whatever computer has your images.  Also, once the image is resized, you can always add it to your site via its URL on Picasa.</p>
<p><strong>Step 5: Edit your image with Picnik.</strong><br />
Go to Re-Size on the leftside toolbar.  Then simply enter in the dimensions that you would like the image to be to use on your site.</p>
<div id="attachment_697" class="wp-caption aligncenter" style="width: 239px"><a href="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picnik-resize1.jpg"><img class="size-full wp-image-697" title="picnik-resize1" src="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picnik-resize1.jpg" alt="" width="229" height="558" /></a><p class="wp-caption-text">Editing toolbar in Picnik</p></div>
<p>Depending on the layout of your theme, maximum size can vary, but for the sake of example, I usually save my images at 450 pixels wide as the maximum width.  Make sure you choose to retain the proportions as well.</p>
<p style="text-align: center;">&nbsp;</p>
<div id="attachment_698" class="wp-caption aligncenter" style="width: 243px"><a href="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/resize-newdimensions1.jpg"><img class="size-full wp-image-698" title="resize-newdimensions1" src="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/resize-newdimensions1.jpg" alt="" width="233" height="251" /></a><p class="wp-caption-text">Original photo&#39;s dimensions.  Too big for a blog!</p></div>
<div id="attachment_699" class="wp-caption aligncenter" style="width: 252px"><a href="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/resize-newdimensions2.jpg"><img class="size-full wp-image-699 " title="resize-newdimensions2" src="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/resize-newdimensions2.jpg" alt="" width="242" height="260" /></a><p class="wp-caption-text">Enter in the new dimensions (width and height in pixels)</p></div>
<p><strong>Step 6: Save your image and either download or get url.</strong><br />
Picnik will allow you to save your edits and then you can either download the image back to your computer or, on Picasa, you can get the url of the image.</p>
<div id="attachment_700" class="wp-caption aligncenter" style="width: 202px"><a href="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picnik-savetoalbum.jpg"><img class="size-full wp-image-700" title="picnik-savetoalbum" src="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picnik-savetoalbum.jpg" alt="" width="192" height="118" /></a><p class="wp-caption-text">Save to your Picasa album</p></div>
<div id="attachment_701" class="wp-caption aligncenter" style="width: 410px"><a href="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picasa-downloadphoto.jpg"><img class="size-full wp-image-701" title="picasa-downloadphoto" src="http://www.jennmearswebdesign.com/wp-content/uploads/2011/11/picasa-downloadphoto.jpg" alt="" width="400" height="239" /></a><p class="wp-caption-text">Now you can download the re-sized image to a folder on your computer</p></div>
<p>Then, when you add an image into your WordPress post or page, it&#8217;s simply a matter of pasting that images url into the add-image pop up window.  If you choose to download the re-sized image, then all you need to do is add your images the regular way and the smaller file size will take a load off your server!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.jennmearswebdesign.com/2011/11/how-to-re-size-your-photos-on-google/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Fun with Suffusion</title>
		<link>http://www.jennmearswebdesign.com/2011/03/fun-with-suffusion/</link>
		<comments>http://www.jennmearswebdesign.com/2011/03/fun-with-suffusion/#comments</comments>
		<pubDate>Tue, 29 Mar 2011 02:56:15 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[blogging]]></category>
		<category><![CDATA[news]]></category>
		<category><![CDATA[tutorials]]></category>
		<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[BostonWP]]></category>
		<category><![CDATA[Suffusion]]></category>

		<guid isPermaLink="false">http://www.jennmearswebdesign.com/?p=546</guid>
		<description><![CDATA[I attended my first WordPress Meetup tonight and it was an amazing experience. Just to realize that other people out there have had clients who erase a lovingly customized embedded Google map (&#8220;Html view? What&#8217;s that?&#8221;) made me feel that much less alone in the universe. Not only was I going to my first meetup <a href='http://www.jennmearswebdesign.com/2011/03/fun-with-suffusion/'>[...]</a>]]></description>
			<content:encoded><![CDATA[<p>I attended my first <a href="http://bostonwp.org">WordPress Meetup</a> tonight and it was an amazing experience.  Just to realize that other people out there have had clients who erase a lovingly customized embedded Google map (&#8220;Html view?  What&#8217;s that?&#8221;) made me feel that much less alone in the universe.</p>
<p>Not only was I going to my first meetup but I had been invited to be one of the presenters which was a really <del datetime="2011-03-29T02:42:26+00:00">nerve-wracking</del> fun experience.  The theme was a WordPress BakeOff between <a href="http://www.alanbergstein.com/">Thesis</a>, <a href="http://www.gadarian.com/">Headway</a> and Suffusion.  Each participant was assigned a framework and then given a design to re-create using their theme.  As the Suffusion contestant, I found that it really helped to have an outline of all the features so <a href="http://testblog5.jennmearswebdesign.com/?page_id=114">you can see that here</a>.</p>
<p>On a side note, <a href="http://testblog5.jennmearswebdesign.com/">this is where I am going to be working on a new look for my own site</a>, so bookmark this if you want to follow the progress of my own Suffusion-powered site renovation!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.jennmearswebdesign.com/2011/03/fun-with-suffusion/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>&#8220;Random Image, Meet Short Code Exec PHP&#8221;</title>
		<link>http://www.jennmearswebdesign.com/2010/12/random-image-meet-short-code-exec-php/</link>
		<comments>http://www.jennmearswebdesign.com/2010/12/random-image-meet-short-code-exec-php/#comments</comments>
		<pubDate>Thu, 16 Dec 2010 20:37:50 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[tutorials]]></category>
		<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[Wordpress Hack]]></category>
		<category><![CDATA[design]]></category>
		<category><![CDATA[plugins]]></category>

		<guid isPermaLink="false">http://www.jennmearswebdesign.com/?p=508</guid>
		<description><![CDATA[-Now shake hands and play nice&#8230; I&#8217;m putting together a proposal site for a (potential) client and using Sayontan&#8217;s excellent &#8220;Suffusion&#8221; theme. What makes it awesome (for me) is that it&#8217;s a snap to customize with the various customizing menus. And, it comes with a bunch of different layout templates so it&#8217;s easy to set <a href='http://www.jennmearswebdesign.com/2010/12/random-image-meet-short-code-exec-php/'>[...]</a>]]></description>
			<content:encoded><![CDATA[<p>-Now shake hands and play nice&#8230;<br />
I&#8217;m putting together a proposal site for a (potential) client and using <a href="http://wordpress.org/extend/themes/suffusion">Sayontan&#8217;s excellent &#8220;Suffusion&#8221; theme</a>.  What makes it awesome (for me) is that it&#8217;s a snap to customize with the various customizing menus.  And, it comes with a bunch of different layout templates so it&#8217;s easy to set a page to contain sidebars, or not, if the client prefers.</p>
<p>One of the design requirements, is that there had to be an image that would change every time one went to the home page.  Not a bad idea, but one of those concepts so deceptively simple that it was lost in a sea of over-elaborate plugins promising to do everything short of picking up your drycleaning.  <span id="more-508"></span></p>
<p>Finally, I located the <a href="http://wordpress.org/extend/plugins/random-image-selector/">Random Image plugin</a>, but was a little skittish about the &#8220;freshness date&#8221; on the plugin&#8217;s WordPress page.  It did work with 3.0.2 though except for one small issue:  the code that generated the random image only worked on the template side of things, meaning, I could insert the php into the template file that the page was set to , but not on the actual page&#8217;s editing window.</p>
<p>I tried putting it into the no-sidebars.php file that I was using and saving it as a different template, and the random image would display, but the sidebars would show up!  What&#8217;s a girl to do?</p>
<p><a href="http://wordpress.org/extend/plugins/shortcode-exec-php/faq/">Short Code Exec PHP</a> to the rescue!  Once installed, you can input php code into the editing window (located in Settings&gt;Short Code Exec PHP).  Just be sure to leave the initial and ending php tags out.  See below:<br />
<img class="aligncenter size-full wp-image-509" title="Short Code Exec PHP" src="http://www.jennmearswebdesign.com/wp-content/uploads/2010/12/Picture-3.png" alt="Short Code Exec PHP" width="671" height="322" /><br />
Then, I went to the page I wanted a random image to appear on and put the short code by using the random-img short code tag I had defined in the Short Exec settings.<br />
And, just like that, I have a random image generated every time I load the page.  This is great for when a plugin creator doesn&#8217;t have short code instructions available!</p>
<p>At least <em>something</em> is going right today&#8230;</p>
]]></content:encoded>
			<wfw:commentRss>http://www.jennmearswebdesign.com/2010/12/random-image-meet-short-code-exec-php/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Connections: Facebook, Flickr and your camera phone</title>
		<link>http://www.jennmearswebdesign.com/2010/01/connections-facebook-flickr-and-your-camera-phone/</link>
		<comments>http://www.jennmearswebdesign.com/2010/01/connections-facebook-flickr-and-your-camera-phone/#comments</comments>
		<pubDate>Mon, 04 Jan 2010 01:19:38 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Facebook]]></category>
		<category><![CDATA[Lifehacks]]></category>
		<category><![CDATA[social media]]></category>
		<category><![CDATA[tutorials]]></category>
		<category><![CDATA[blogging]]></category>
		<category><![CDATA[lifehacks]]></category>
		<category><![CDATA[photo]]></category>

		<guid isPermaLink="false">http://www.jennmearswebdesign.com/?p=436</guid>
		<description><![CDATA[Although there&#8217;s an iPhone app for everything short of walking your dog, sometimes there&#8217;s an easier way to something that&#8217;s a little off the beaten path. I was taking photos of some artwork that a friend of mine did with our daughter on New Year&#8217;s Eve and in the midst of sending it to my <a href='http://www.jennmearswebdesign.com/2010/01/connections-facebook-flickr-and-your-camera-phone/'>[...]</a>]]></description>
			<content:encoded><![CDATA[<p>Although there&#8217;s an iPhone app for everything short of walking your dog, sometimes there&#8217;s an easier way to something that&#8217;s a little off the beaten path.  I was taking photos of some artwork that a friend of mine did with our daughter on New Year&#8217;s Eve and in the midst of sending it to my twitpic account, I changed my mind and came up with a way to post a photo to a Flickr photo stream and Facebook simultaneously. <span id="more-436"></span></p>
<p>Step 1: Find your Flickr upload email address.</p>
<p>This can be done by signing into your Flickr account.  Then, click on You in the top left toolbar and then scroll down to Your Account.  Once you&#8217;ve clicked on that, you will see a tab on the next page for Email.  Click that and then on the next page you will see next to Your Flickr upload email, the address for sending photos that will appear in your Photostream.</p>
<div id="attachment_438" class="wp-caption alignnone" style="width: 369px"><img class="size-full wp-image-438" title="flickr_photostream" src="http://www.jennmearswebdesign.com/wp-content/uploads/2010/01/flickr_photostream.jpg" alt="Finding your upload email address" width="359" height="478" /><p class="wp-caption-text">Finding your upload email address</p></div>
<p>Step 2: Find your Facebook mobile uploads email address.</p>
<p>Sign into Facebook and go to your profile by clicking on your name in the top right corner.  Then, go to the Your Photos tab, select an album and then click on Edit Album, then, Add More.  Then, you will see an option below, &#8220;Got a camera phone?&#8221;.  Click on &#8220;Upload photos straight from your phone.&#8221;, and you will be shown your upload email address in the top half of the next page.</p>
<div id="attachment_439" class="wp-caption alignnone" style="width: 430px"><img class="size-full wp-image-439" title="fb_addphotos" src="http://www.jennmearswebdesign.com/wp-content/uploads/2010/01/fb_addphotos.jpg" alt="Finding your Facebook uploads address" width="420" height="357" /><p class="wp-caption-text">Finding your Facebook uploads address</p></div>
<p>Step 3:  Add the two email addresses to your phone.</p>
<p>This can be done by adding 2 new contacts, calling them Flickr and Facebook and then adding their respective email addresses.</p>
<p>Step 4:  Take a picture!</p>
<p>Once you have a photo you want to send to both Flickr and Facebook, or, either one, simply select the email option in your camera phone and begin to type the email address.  Once it appears as a suggestion, select it and then add the other as a CC if you wish.</p>
<p>Et voilà!</p>
<div id="attachment_440" class="wp-caption alignnone" style="width: 310px"><img class="size-full wp-image-440" title="fb_imageadded" src="http://www.jennmearswebdesign.com/wp-content/uploads/2010/01/fb_imageadded.jpg" alt="A camera phone photo uploaded to Facebook" width="300" height="301" /><p class="wp-caption-text">A camera phone photo uploaded to Facebook</p></div>
<div id="attachment_441" class="wp-caption alignnone" style="width: 410px"><img class="size-full wp-image-441" title="flickr_photoadded" src="http://www.jennmearswebdesign.com/wp-content/uploads/2010/01/flickr_photoadded.jpg" alt="Uploaded photo on your Flickr photostream page" width="400" height="323" /><p class="wp-caption-text">Uploaded photo on your Flickr photostream page</p></div>
]]></content:encoded>
			<wfw:commentRss>http://www.jennmearswebdesign.com/2010/01/connections-facebook-flickr-and-your-camera-phone/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>NextGen Gallery: The Missing Manual</title>
		<link>http://www.jennmearswebdesign.com/2009/12/nextgen-gallery-the-missing-manual/</link>
		<comments>http://www.jennmearswebdesign.com/2009/12/nextgen-gallery-the-missing-manual/#comments</comments>
		<pubDate>Thu, 31 Dec 2009 19:33:35 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[tutorials]]></category>
		<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[WP Plugins]]></category>
		<category><![CDATA[dashboard]]></category>
		<category><![CDATA[guide]]></category>
		<category><![CDATA[images]]></category>
		<category><![CDATA[nextgen]]></category>
		<category><![CDATA[plugins]]></category>

		<guid isPermaLink="false">http://www.jennmearswebdesign.com/?p=381</guid>
		<description><![CDATA[As much as everyone loves the NextGen Gallery by Alex Rabe (myself included), a comprehensive guide to how to actually use it seems to be as scarce as the proverbial hens&#8217; teeth. The first time I installed it for a client, I have to admit the sheer amount of options and settings was a little <a href='http://www.jennmearswebdesign.com/2009/12/nextgen-gallery-the-missing-manual/'>[...]</a>]]></description>
			<content:encoded><![CDATA[<p>As much as everyone loves the <a href="http://alexrabe.de/wordpress-plugins/nextgen-gallery/">NextGen Gallery by Alex Rabe</a> (myself included), a comprehensive guide to how to actually <em>use</em> it seems to be as scarce as the proverbial hens&#8217; teeth.  The first time I installed it for a client, I have to admit the sheer amount of options and settings was a little overwhelming.  At any rate, you came here for a manual so here it is.<span id="more-381"></span></p>
<p>Once you have <a href="http://wordpress.org/extend/plugins/nextgen-gallery/">downloaded</a>, installed and activated the NextGen Gallery Plugin, when you go to your WP dashboard, it appears at the bottom left like so:</p>
<div id="attachment_393" class="wp-caption alignnone" style="width: 172px"><img class="size-full wp-image-393" title="ngg_dashboardloc" src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/12/ngg_dashboardloc.jpg" alt="NextGen's Location in the WP Dashboard" width="162" height="208" /><p class="wp-caption-text">NextGen&#39;s Location in the WP Dashboard</p></div>
<p>Clicking next to the plugin&#8217;s name will open a list of tools and settings for NextGen:</p>
<div id="attachment_396" class="wp-caption alignnone" style="width: 162px"><img class="size-full wp-image-396" title="ngg_areas" src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/12/ngg_areas.jpg" alt="NextGen Gallery Tools and Settings" width="152" height="256" /><p class="wp-caption-text">NextGen Gallery Tools and Settings</p></div>
<p><strong>Here&#8217;s a quick guide to the various areas of the NextGen toolbox:</strong><br />
<a href="#Overview">1: Overview</a><br />
<a href="#Add Gallery/Images">2: Add Gallery/Images</a><br />
<a href="#Manage Gallery">3: Manage Gallery</a><br />
<a href="#Album">4: Album</a><br />
<a href="#Tags">5: Tags</a><br />
<a href="#Options">6: Options</a><br />
<a href="#Style">7: Style</a><br />
<a href="#Set Up">8: Set Up</a><br />
<a href="#Roles">9: Roles</a><br />
<a href="#About">10: About</a><br />
<a title="Overview" name="Overview"></a></p>
<h2>1: Overview</h2>
<p>Opens a page that contains general info about Next Gen.  You can see a count of your albums, galleries and images, the names of recent donors to the plugin&#8217;s author (some nice exposure in exchange for a little support-these things don&#8217;t write themselves), updates from Alex Rabe&#8217;s blog, related plugins (good to check out for ways to extend Next Gen) and your Graphic Library settings.</p>
<div id="attachment_398" class="wp-caption alignnone" style="width: 410px"><img class="size-full wp-image-398" title="ngg_imageuploader" src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/12/ngg_imageuploader.jpg" alt="ngg_imageuploader" width="400" height="151" /><p class="wp-caption-text">Step 1. Click on Upload Images</p></div>
<p><a title="Add Gallery/Images" name="Add Gallery/Images"></a></p>
<h2>2: Add Gallery/Images</h2>
<p>Fairly  self-explanatory, this is where you would go to create a new gallery or add images to an existing gallery.  Click on &#8220;browse&#8221; to select an image from your computer.  Then, select the gallery they will be uploaded to.</p>
<div id="attachment_399" class="wp-caption alignnone" style="width: 410px"><img class="size-full wp-image-399" title="uploading_images" src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/12/uploading_images.jpg" alt="Step 2. Select your images" width="400" height="346" /><p class="wp-caption-text">Step 2. Select your images</p></div>
<p><a title="Manage Gallery" name="Manage Gallery"></a></p>
<h2>3. Manage Gallery</h2>
<p>This brings you to a list of all your galleries.  Click one of your galleries to edit the following settings:</p>
<p><strong>Title</strong>: The title your gallery will have when it&#8217;s displayed on a page.</p>
<p><strong>Description</strong>: A brief summary of the gallery&#8217;s content</p>
<p><strong>Path</strong>: The file path for your gallery.</p>
<p><strong>Page Link To</strong>: When the gallery is displayed as the content of an Album, choosing a page here will create a linked image and title that can be clicked on to go directly to that gallery&#8217;s page.</p>
<p><strong>Preview Image</strong>: Lets you choose which image will be displayed when the gallery is shown in an Album.</p>
<p><strong>Author</strong>: Lets you show the Gallery&#8217;s author.</p>
<p><strong>Create Page</strong>: This feature allows you to create a page for the Gallery if you need to.</p>
<p>Below those options is a dropdown menu of Actions.  If you need to make changes to several or all the images at once, this will save you time:</p>
<p><strong>No Action</strong>: the default</p>
<p><strong>Set Watermark</strong>: Allows you to embed text onto the image to mark it as yours.</p>
<p><strong>Create New Thumbnails</strong>: This is what you need to use if you have changed your Thumbnails settings under <em>Options</em> (see below).</p>
<p><strong>Re-size Images</strong>: You may need to re-size images to fit your site&#8217;s style.</p>
<p><strong>Delete Images</strong>: Allows you to perform a batch delete on selected images.</p>
<p><strong>Import Metadata</strong>: Allows you to import <a href="http://www.rideau-info.com/photos/labelling.html">metadata</a> (e.g. EXIF, IPTC, or XMP data) from images and set it in the alternate title text field. (Thanks <a href="http://dpotter.net/Technical/2008/03/nextgen-gallery-review-image-management/">Dave</a>!)</p>
<p><strong>Rotate Images Clockwise/Counter-Clockwise</strong>: Fairly self-explanatory.</p>
<p><strong>Copy To</strong>: Lets you copy the selected images to a different gallery.</p>
<p><strong>Move To</strong>: Lets you move the images from one gallery to another.</p>
<p><strong>Add/Delete/Overwrite Tags</strong>: Allows you to batch-edit tags-keywords associated with the images that can enable the images to be selected by keyword-based searches.</p>
<p>If you have selected one of these actions, just click on <strong>Apply</strong> to put the changes in effect.  You can also choose to <strong>Sort the Gallery</strong> which takes you to a page where you can re-arrange your images.  To return to the Gallery editing window, just click Return to Previous Page on the far right.  Also, if you did change anything, make sure you click &#8220;<strong>Save Changes</strong>&#8221; to put all your edits into effect.</p>
<p>The bottom of the Manage Gallery page contains a list of all that Gallery&#8217;s images.  If you just need to edit one image, or, if each image needs individual editing, you can do that here.<br />
<a title="Album" name="Album"></a></p>
<h2>4. Album</h2>
<p>If you need to sort your Galleries into categories, then you need to create Albums.  The analogy at work here is that you can have a family album entitled &#8220;Vacations&#8221; and perhaps another entitled &#8220;Weddings&#8221; and into those albums you would put collections of photos (or galleries) called &#8220;Disneyworld09&#8243; and &#8220;Phyllis &amp; Mike&#8221;.</p>
<div id="attachment_410" class="wp-caption alignnone" style="width: 410px"><img class="size-full wp-image-410" title="album_manager" src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/12/album_manager.jpg" alt="Click and drag an album from the right window to place it in the left window for editing." width="400" height="189" /><p class="wp-caption-text">Click and drag an album from the right window to place it in the left window for editing.</p></div>
<p>Once you have selected which album you want to edit, just drag it over to the far left window to add galleries via the drag and drop method.</p>
<p>Click Update to place the Galleries into the Album selected.<br />
<a title="Tags" name="Tags"></a></p>
<h2>5. Tags</h2>
<p>This allows you to edit existing tags, re-name tags, delete tags and also edit the tags&#8217; slug (the way it will be written into the page&#8217;s URL).  For example: if you had tagged an image as &#8220;Family Vacations&#8221;, the slug could be specified as family-vacations.  Choosing your slugs wisely makes you site more &#8220;search friendly&#8221;.</p>
<div id="attachment_414" class="wp-caption alignnone" style="width: 410px"><img class="size-full wp-image-414" title="edit_tag_slug" src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/12/edit_tag_slug.jpg" alt="This makes the image likely to show up in a search for the terms &quot;home&quot; AND &quot;interior&quot;." width="400" height="139" /><p class="wp-caption-text">This makes the image likely to show up in a search for the terms &quot;home&quot; AND &quot;interior&quot;.</p></div>
<p><a title="Options" name="Options"></a></p>
<h2>6. Options:</h2>
<p>This is where you go to control the following settings:<br />
<strong>General</strong>: set the gallery path, delete image files (check to remove the images from the database when you remove a gallery, activate permalinks, select a graphic library, activate an rss feed for your images and activate some Javascript effects for your galleries to create certain displays of images.  Another feature you can edit here is how your images can be attached to posts that shares certain search terms, either by categories or tags.</p>
<p><strong>Thumbnails:</strong> Here you can set the dimensions and the quality of your galleries&#8217; thumbnails.  Just be sure to go to Manage Galleries &gt; Select a gallery &gt; Actions and select &#8220;Create New Thumbnails&#8221; after you do this.</p>
<p><strong>Images</strong>: Here you can edit your images&#8217; size, quality, enable caching of images when someone browses a gallery and also clear the cache folder in case you change certain image settings.</p>
<p><strong>Gallery</strong>: You can set a large array of options for your galleries here.  Deactivate a gallery page&#8217;s link, set the number of images per page, set the number of image columns, integrate Slideshow settings, choose to show either a slideshow or a list of thumbnails, simply show the imagebrowser, add hidden images, enable Ajax pagination and choose Sort options.</p>
<p><strong>Effects</strong>: This is where you can set the way images will be displayed once their thumbnails in a Gallery are clicked.  Note: the only two options that will work automatically are Thick Box (which displays the image with a thick white border over a sheer gray background) and Shutter (similar display but with no border).  Highslide and Lightbox effects can only be generated when certain javascript is inserted into your content folder.  For an example of the Highslide effect, click <a href="http://highslide.com/#examples">here</a> and then click one of the images under Galleries.<br />
To see what the Lightbox effect is go <a href="http://www.huddletogether.com/projects/lightbox2/#example">here</a> and select one of the images.</p>
<p><strong>Watermark</strong>: Here you can edit your settings for displaying watermarks such as whether yo want to use an image or text to protect your images from theft.</p>
<p>Slideshow: Set your slideshows&#8217; appearance.  Note: you will need to download an <a href="http://www.longtailvideo.com/players/jw-image-rotator/">auxiliary plugin named JW Image Rotator</a> to get the slideshows to function.<br />
<a title="Style" name="Style"></a></p>
<h2>7. Style:</h2>
<p>Style allows you to choose from 7 different stylesheets for your Album and Gallery displays as well as customize the CSS to suit your site&#8217;s look and layout.  The available readymade styles aren&#8217;t radically different from each other, but here is a series of screenshots with the various choices in effect.</p>
<div id="attachment_422" class="wp-caption alignnone" style="width: 408px"><img class="size-full wp-image-422" title="css_default" src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/12/css_default.jpg" alt="Gallery displaying the default style" width="398" height="166" /><p class="wp-caption-text">Gallery displaying the default style</p></div>
<div id="attachment_423" class="wp-caption alignnone" style="width: 405px"><img class="size-full wp-image-423" title="css_blackminimalism" src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/12/css_blackminimalism.jpg" alt="css_blackminimalism" width="395" height="122" /><p class="wp-caption-text">Black Minimalism Theme</p></div>
<div id="attachment_424" class="wp-caption alignnone" style="width: 396px"><img class="size-full wp-image-424" title="css_dkret3" src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/12/css_dkret3.jpg" alt="DKret 3 Theme" width="386" height="121" /><p class="wp-caption-text">DKret 3 Theme</p></div>
<div id="attachment_425" class="wp-caption alignnone" style="width: 417px"><img class="size-full wp-image-425" title="css_hovereffectstyles" src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/12/css_hovereffectstyles.jpg" alt="Hovereffect Styles" width="407" height="126" /><p class="wp-caption-text">Hovereffect Styles</p></div>
<div id="attachment_426" class="wp-caption alignnone" style="width: 398px"><img class="size-full wp-image-426" title="css_k2theme" src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/12/css_k2theme.jpg" alt="K2 Theme" width="388" height="117" /><p class="wp-caption-text">K2 Theme</p></div>
<div id="attachment_427" class="wp-caption alignnone" style="width: 407px"><img class="size-full wp-image-427" title="css_shadoweffect" src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/12/css_shadoweffect.jpg" alt="Shadow Effect " width="397" height="122" /><p class="wp-caption-text">Shadow Effect </p></div>
<div id="attachment_428" class="wp-caption alignnone" style="width: 406px"><img class="size-full wp-image-428" title="css_shadoweffecttext" src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/12/css_shadoweffecttext.jpg" alt="Shadow Effect with Description Text" width="396" height="122" /><p class="wp-caption-text">Shadow Effect with Description Text</p></div>
<p>Not stunningly different in appearance I know, but, look at things this way.  You can select a style, customize it any way you like via CSS and then, if things get hairy, you can always select another style to revert your design to something similar to its original state.</p>
<p><a title="Set Up" name="Set Up"></a></p>
<h2>8. Set Up:</h2>
<p>This page gets a little lost in translation for me.  One would expect it to contain info about folders and ports and such but this is actually where you go to fully remove any images/galleries/album info from your database.  That first line you see:<br />
&#8220;You don&#8217;t like NextGEN Gallery ?&#8221; always reminds me that awkward moment when you have to tell your mother-in-law &#8220;No thanks&#8221; when offered a helping of her special &#8220;Spam &#8216;n Cheezwiz Surprise&#8221;.  I wish this section was called &#8220;Uninstall&#8221; instead.</p>
<p><a title="Roles" name="Roles"></a></p>
<h2>9. Roles:</h2>
<p>This is a nice touch.  If you run a site that has several administrators/editors/contributors (the basic WordPress roles), this is where you can assign different levels of access to the NextGen galleries for different people.</p>
<p><a title="About&quot;" name="About"></a></p>
<h2>10. About:</h2>
<p>Here&#8217;s where the credits roll.  If you are burning with desire to see who contributed to this plugin&#8217;s development and/or economic survival, then this is the section for you.  And, if you find NextGen so fabulous that you want to throw some cash their way, there&#8217;s a &#8220;Make a Donation&#8221; button right under the heading &#8220;How to Support?&#8221;.</p>
<h2>Related Links:</h2>
<p>Hungry for more?  Here&#8217;s a list of links to other NextGen-related articles that I have gathered in the course of working with the NextGen plugin:</p>
<p><a href="http://www.vuthy.com/blog/2008/11/23/guide-to-nextgen-gallery-plugin-album-and-gallery/">Vuthy.com: Guide to Using NextGen&#8217;s Albums and Galleries</a></p>
<p><a href="http://www.scotproof.com/inserting-a-nextgen-gallery-or-slideshow-in-a-custom-field/comment-page-1/">Scotproof&#8217;s: Inserting a NextGen gallery or slideshow in a custom field</a></p>
<p><a href="http://narasopa.com/seoblog/2009/02/adding-title-and-description-to-nextgen-gallery-thumbnails/">Narasopa Media&#8217;s: Adding Title and Description to NextGen Gallery Thumbnails</a></p>
<p>And <a title="Get RSS feed for Jenn Mears Web Design" href="http://www.jennmearswebdesign.com/feed/">stay tuned</a> for the next article in my NextGen series: &#8220;Customizing Your Gallery&#8221;!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.jennmearswebdesign.com/2009/12/nextgen-gallery-the-missing-manual/feed/</wfw:commentRss>
		<slash:comments>17</slash:comments>
		</item>
		<item>
		<title>A Rough Guide to Business Blogging</title>
		<link>http://www.jennmearswebdesign.com/2009/10/a-rough-guide-to-business-blogging/</link>
		<comments>http://www.jennmearswebdesign.com/2009/10/a-rough-guide-to-business-blogging/#comments</comments>
		<pubDate>Thu, 15 Oct 2009 03:49:13 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Advertising]]></category>
		<category><![CDATA[Business]]></category>
		<category><![CDATA[Glossary]]></category>
		<category><![CDATA[social media]]></category>
		<category><![CDATA[tutorials]]></category>
		<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[blogging]]></category>

		<guid isPermaLink="false">http://www.jennmearswebdesign.com/?p=383</guid>
		<description><![CDATA[Author&#8217;s note: This is not the stuff that I do, but it&#8217;s what I should do. 5 Reasons to have a blog for your business 1. It&#8217;s environmentally friendly. Unless you are running a blog about your helicopter hunting/timber logging business venture. But not only is it green for the environment, it&#8217;s green for you. <a href='http://www.jennmearswebdesign.com/2009/10/a-rough-guide-to-business-blogging/'>[...]</a>]]></description>
			<content:encoded><![CDATA[<p>Author&#8217;s note:  This is not the stuff that I do, but it&#8217;s what I <em>should</em> do.</p>
<p><strong>5 Reasons to have a blog for your business<br />
</strong><br />
1. It&#8217;s environmentally friendly.  Unless you are running a blog about your helicopter hunting/timber logging business venture.  But not only is it green for the environment, it&#8217;s green for you.  It takes up much less of your company&#8217;s business day since you no longer need to drive to cold calls, print out newsletters and manage mail merges.</p>
<p>2. It&#8217;s extremely cost-effective.  Even if you feel the need to (ahem) hire a professional designer to &#8220;tweak your template&#8221; (more on <em>that</em> later), you should still save a ton of dough by not needing to do as much print advertising.</p>
<p>3. You will have an &#8220;auxiliary engine&#8221; to drive traffic to your company&#8217;s site.  Put a link back to your company&#8217;s site. Use your blog profile tool to find local sites and bloggers and ask them if they are willing to trade links.</p>
<p>4. It can generate customer feedback and communication.  Run a contest for your readers.  Ask people for their opinion on your review of a local restaurant.  Let people know you welcome comments by making that link more visible.</p>
<p>5. It&#8217;s fun!  It&#8217;s a low stress way to promote your business without feeling like you are out there on a soapbox.  Write what you enjoy writing about and they will come.</p>
<p><strong>4 Do&#8217;s and Don&#8217;ts</strong></p>
<p>Don&#8217;t be too negative too much.  If you had a tough time with a client, or your favorite team/american  idol contestant/politician lost, write about what you learned from it and respect others&#8217; privacy and/or opinions.</p>
<p>Try to find a rhythm and stay with it.  One interesting post a week is better than 7 entries that vary on &#8220;My Starbucks-Fueled Mini-Rant&#8221;, but keep your content as fresh as possible without sacrificing quality for quantity.</p>
<p>Be useful, or funny, or ahead of the crowd or any combination.  Being creative doesn&#8217;t hurt either.  Think about what kinds of questions your clients have had lately and how you can answer them.</p>
<p>Don&#8217;t blitz your readers with &#8220;bells and whistles&#8221;.  We&#8217;ve all been to that site where so many &#8220;awesome&#8221;(bandwidth-hogging) features needed to load that we didn&#8217;t go past the home page.</p>
<p><strong>3 Blogging Terms to Know<br />
</strong><br />
RSS:  Almost synonymous with the term &#8220;Feed&#8221;, RSS stands for (in my opinion) Really Simple Syndication.  It&#8217;s an easy way for your readers to keep up with your blog and make sure that they know when you have something new on the site.  Of course, it&#8217;s up to your readers to decide to follow your blog, but putting a widget in your template (see below) suggesting that your readers to subscribe really helps things along.</p>
<p>Template: This is the term blogging services use for your blog&#8217;s layout and overall design.  If you really want a distinctive look for your blog, such as colors based on your logo and custom backgrounds, etc, you should the editing options for your template before you go with it.</p>
<p>Widgets/Badges: Basically, those &#8220;bells and whistles&#8221; I was warning you about earlier.  Like a good spice, use them only if necessary and they will work for you, not against you.  Some examples of widgets are &#8220;Archives&#8221; that list your posts in chronological order, and Google&#8217;s Adsense which will place text ads on your blog by &#8220;sensing&#8221; the site&#8217;s content.  (Which still doesn&#8217;t explain the Maalox ad that kept appearing on Jennsweb a few years ago.)  Badges are items such as Flickr, which can display your Flickr images in a little window, and Twitter, which can display your most recent updates on your Twitter account.</p>
<p><strong>2 FAQ&#8217;s</strong></p>
<p>What should I blog about?<br />
Almost anything.  A post can be a photo, a story, an interesting link or all three combined.  Don&#8217;t cast your net too wide.  Think about the blog&#8217;s description (that little phrase underneath a blog&#8217;s title) and see if your entry would be something that someone finding your blog would find interesting as well.</p>
<p>How much time should I devote to this?<br />
If you run a business, then you know how the word &#8220;busy&#8221; got in there.  The best approach is the one that fits around your schedule.  Blog on your coffee break if you want.  As long as you get in the habit, don&#8217;t obsess over how much time you spend on it because&#8230;<br />
<strong><br />
#1 Rule: Have fun with it!</strong><br />
Remember, it&#8217;s not the annual report to the stockholders.  Because who gets excited about reading <em>those</em>?</p>
]]></content:encoded>
			<wfw:commentRss>http://www.jennmearswebdesign.com/2009/10/a-rough-guide-to-business-blogging/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>A Guide to Web Color-</title>
		<link>http://www.jennmearswebdesign.com/2009/06/a-guide-to-web-color/</link>
		<comments>http://www.jennmearswebdesign.com/2009/06/a-guide-to-web-color/#comments</comments>
		<pubDate>Sun, 28 Jun 2009 17:55:32 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Lifehacks]]></category>
		<category><![CDATA[tutorials]]></category>
		<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[Wordpress Hack]]></category>
		<category><![CDATA[color]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[html]]></category>

		<guid isPermaLink="false">http://www.jennmearswebdesign.com/?p=372</guid>
		<description><![CDATA[-right in your own (WordPress) backyard! I was ready to do a search for a good online hexadecimal color guide for a client, when I realized that they have one right there in the Editing window! Step 1. Go to the Dashboard, then select either New or Edit, Post or Page. Any combination will work, <a href='http://www.jennmearswebdesign.com/2009/06/a-guide-to-web-color/'>[...]</a>]]></description>
			<content:encoded><![CDATA[<p>-right in your own (WordPress) backyard!  I was ready to do a search for a good online hexadecimal color guide for a client, when I realized that they have one right there in the Editing window!<span id="more-372"></span><br />
<strong>Step 1.</strong><br />
Go to the Dashboard, then select either New or Edit, Post or Page.  Any combination will work, but you want to make sure you are in <strong>Visual Mode</strong>.</p>
<p><strong>Step 2.</strong><br />
Open up the &#8220;Kitchen Sink&#8221; mode (This is done by clicking that button on the right end of the display that has all those tiny squares), and click the arrow next to the underlined &#8220;A&#8221; to bring up the Color-Picker.<br />
<a href='http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/color-picker.jpg'><img src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/color-picker.jpg" alt="" title="color-picker" width="144" height="149" class="aligncenter size-full wp-image-374" /></a></p>
<p><strong>Step 3.</strong><br />
The initial Color-Picker window contains just a few of the hundreds of colors available.  Click on &#8220;More Colors&#8221; to bring up the full range of options.  By default, the window opens to the the full spectrum Picker, but there are other options as well such as the Palette (web-safe colors)  and Named Color (standard colors such as &#8220;Red&#8221;).<br />
<a href='http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/full_palette.jpg'><img src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/full_palette.jpg" alt="" title="full_palette" width="398" height="294" class="aligncenter size-full wp-image-375" /></a><br />
<a href='http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/hex_palette.jpg'><img src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/hex_palette.jpg" alt="" title="hex_palette" width="395" height="289" class="aligncenter size-full wp-image-376" /></a><br />
<a href='http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/named_colors.jpg'><img src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/named_colors.jpg" alt="" title="named_colors" width="398" height="292" class="aligncenter size-full wp-image-377" /></a></p>
<p><strong>Step 4.</strong><br />
Notice how clicking on any point in the palette brings up a series of letters and numbers in the lower right side box?  That&#8217;s the code you will need to display that color.  Choose a few colors and write down their corresponding code.  Now, when you want to customize your CSS file, you will have the right code on hand to display the colors you want.  (See example below)</p>
<p><a href='http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/css_example.jpg'><img src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/css_example.jpg" alt="" title="css_example" width="334" height="327" class="aligncenter size-full wp-image-378" /></a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.jennmearswebdesign.com/2009/06/a-guide-to-web-color/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Getting Your Company Listed with Bing.com</title>
		<link>http://www.jennmearswebdesign.com/2009/06/getting-your-company-listed-with-bingcom/</link>
		<comments>http://www.jennmearswebdesign.com/2009/06/getting-your-company-listed-with-bingcom/#comments</comments>
		<pubDate>Fri, 26 Jun 2009 00:55:27 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Advertising]]></category>
		<category><![CDATA[Business]]></category>
		<category><![CDATA[Lifehacks]]></category>
		<category><![CDATA[Links]]></category>
		<category><![CDATA[tutorials]]></category>
		<category><![CDATA[Twitter]]></category>
		<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[search engines]]></category>
		<category><![CDATA[seo]]></category>

		<guid isPermaLink="false">http://www.jennmearswebdesign.com/?p=367</guid>
		<description><![CDATA[Bing.com is a new search engine that is being touted as the next big thing, at least that&#8217;s what Microsoft is hoping. They&#8217;ve pumped metric tons of money into marketing it as Google&#8217;s new competitor, but the jury still seems to be deliberating about that. Still, as Bing buzz builds, it couldn&#8217;t hurt to get <a href='http://www.jennmearswebdesign.com/2009/06/getting-your-company-listed-with-bingcom/'>[...]</a>]]></description>
			<content:encoded><![CDATA[<p>Bing.com is a new search engine that is being touted as the next big thing, at least that&#8217;s what Microsoft is hoping.  They&#8217;ve pumped metric tons of money into marketing it as Google&#8217;s new competitor, but the jury still seems to be deliberating about that.  Still, as Bing buzz builds, it couldn&#8217;t hurt to get listed on their local listings right?</p>
<p>I&#8217;ve talked a few clients through the process of registering their business with Google and, based on that experience, the idea of talking someone through the same process on Bing is a little more daunting, but doable.  Here&#8217;s a comparison of the user experience for each site:</p>
<p><strong>Google&#8217;s Home Page:</strong><br />
<a href='http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/google_home.jpg'><img src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/google_home.jpg" alt="" title="google_home" width="400" height="141" class="alignnone size-full wp-image-371" /></a></p>
<p>The process:</p>
<p>Step 1.  Get a Google Account, if you don&#8217;t have one already.<br />
Step 2.  Go to Google.com and click on &#8220;Business Solutions&#8221; below the search terms window.<br />
Step 3. On the next page, click on &#8220;Local Business Center&#8221; in the bottom half of the page.</p>
<p>Now you are all set to start listing your business with Google.  <strong>One precaution:</strong>  Make sure you are near your business phone so you can verify your listing with Google&#8217;s automated call to your business phone.  They will call with a PIN that you will need to verify that this is actually your business.</p>
<p><strong>Bing.com&#8217;s Home Page:</strong></p>
<p><a href='http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/bing_home.jpg'><img src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/bing_home.jpg" alt="" title="bing_home" width="400" height="252" class="alignnone size-full wp-image-368" /></a></p>
<p>The Process:</p>
<p>Step 1: If you haven&#8217;t already, sign up for a Windows Live account (click on &#8220;Windows Live&#8221; in the top left corner of the page to get started)<br />
Step 2: With your Windows Live email and password on hand, go to Bing&#8217;s home page and select &#8220;Maps&#8221; from the search options listed under the main search field.<br />
Step 3: In the Maps page search field, enter either your business name or your location and business category.<br />
<a href='http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/bing_localsearch.jpg'><img src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/bing_localsearch.jpg" alt="" title="bing_localsearch" width="400" height="80" class="alignnone size-full wp-image-370" /></a><br />
Step 4: In the listing of search results, scroll all the way down until you see the words &#8220;local listing center&#8221; in page gray and click on that to get started with your listing.<br />
<a href='http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/bing_locallisting.jpg'><img src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/bing_locallisting.jpg" alt="" title="bing_locallisting" width="399" height="166" class="alignnone size-full wp-image-369" /></a></p>
<p><strong>Now for the real way to do this.</strong><br />
Go to: <a href="https://ssl.bing.com/listings/ListingCenter.aspx">https://ssl.bing.com/listings/ListingCenter.aspx</a><br />
-and sign up from there.<br />
I only listed these steps out to illustrate the fact that Bing&#8217;s method is; 4 (non-intuitive) steps as opposed to Google&#8217;s 2 somewhat obvious ones and that trying to explain this to a client over the phone is not high on my list of fun and easy activities.  The only bright spot in all this is that, at the end of the sign-up process, Bing.com promises to send you a letter for verification about your listing as opposed to a phone call that can take some people by surprise.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.jennmearswebdesign.com/2009/06/getting-your-company-listed-with-bingcom/feed/</wfw:commentRss>
		<slash:comments>5</slash:comments>
		</item>
		<item>
		<title>How to Use WordPress: Part 1</title>
		<link>http://www.jennmearswebdesign.com/2009/06/how-to-use-wordpress-part-1/</link>
		<comments>http://www.jennmearswebdesign.com/2009/06/how-to-use-wordpress-part-1/#comments</comments>
		<pubDate>Fri, 19 Jun 2009 16:13:38 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[tutorials]]></category>
		<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[dashboard]]></category>
		<category><![CDATA[Posts]]></category>

		<guid isPermaLink="false">http://www.jennmearswebdesign.com/?p=355</guid>
		<description><![CDATA[I feel like I haven&#8217;t posted anything new in forever! Mainly it&#8217;s because I&#8217;ve been really busy with new clients and now the result it that I have been to quite a few client meetings to tutor people on how to use their new WordPress site effectively. So, rather than keep writing the same emails <a href='http://www.jennmearswebdesign.com/2009/06/how-to-use-wordpress-part-1/'>[...]</a>]]></description>
			<content:encoded><![CDATA[<p>I feel like I haven&#8217;t posted anything new in forever!  Mainly it&#8217;s because I&#8217;ve been really busy with new clients and now the result it that I have been to quite a few client meetings to tutor people on how to use their new WordPress site effectively.  So, rather than keep writing the same emails over and over, here&#8217;s a rough guide to using the new WordPress dashboard.  Enjoy! <span id="more-355"></span></p>
<p><strong>1: Logging into your WP site</strong><br />
All WP sites have the same login procedure.  Go to your browser and in the address bar type in a URL in the following format:<br />
<img src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/login_url.jpg"/><br />
(of course, you&#8217;d want to substitute your own site&#8217;s name for &#8220;jennmearswebdesign.com&#8221;)</p>
<p>After that, you will see a screen that looks like this:<br />
<img src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/signin.jpg"/><br />
You&#8217;ll need to enter your User Name and Password here.  Tip: Click the box that says &#8220;Remember Me&#8221; so that your browser can automatically re-insert your password when you visit again.  If it doesn&#8217;t seem to remember the password and your user name is automatically entered next time you visit, try deleting the last few characters of the user name and re-typing them.  That usually triggers the automatic entry of the password.</p>
<p><strong>2: Welcome to the Dashboard<br />
</strong><br />
After you have successfully logged in, you should be looking at the WP dashboard.  This is your starting point to any task you need to get accomplished for updating your site.  Here&#8217;s a quick tour:</p>
<p>From the top:<br />
You&#8217;ll see your site&#8217;s name at the top left corner with a little link that says &#8220;Visit Site&#8221;.  This is handy when you are making changes to the layout and want to see how those changes look.  This link will always take you to your site&#8217;s home page.<br />
In the top right corner, you will see a &#8220;New Post&#8221; and a dropdown menu.  This is great when you are in a hurry and WP has inserted quick links to the most common tasks for WP users.  Next to that you will see &#8220;Howdy! and your user name, then a link to &#8220;Turbo&#8221; which can be installed for faster blogging.  Next to Turbo is the Log Out button for when you are done with your session.</p>
<p><strong>Left Dashboard:</strong></p>
<p>The top link, labeled &#8220;Dashboard&#8221; will return you to the Dashboard home from wherever you are in the admin section.  Next down is the area where you can control the basic components of a WP site: Posts, Media, Links, Pages and Comments:<br />
<img src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/db_topleft.jpg"/></p>
<p>From there, you have your toolbar for editing your site&#8217;s look and layout (note, this is only accessible to users with Administrator access):<br />
<img src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/appearance.jpg"/></p>
<p><strong>Themes</strong> are the basic templates that your WP site has stored online.  This is where you would go if you wanted to choose a new theme for your site.</p>
<p><strong>Widgets</strong> are the components that make up the features of your sidebar.  When a theme says &#8220;Widget-enabled&#8221; it means that the theme&#8217;s author has coded the ability for the theme to display widgets properly.  Widgets are a great way to handle a lot of your site&#8217;s functionality.<br />
Tip: If you choose a widget for your sidebar(s), just be aware that it will create a sidebar that <em>only</em> displays widgets.  If you have sidebar elements that have been handcoded in the file &#8220;sidebar.php&#8221;, then you will need to make sure that those can be installed as a widget as well.</p>
<p><strong>Editor</strong> is where you can work with the files that make up your site&#8217;s theme.  For example, if I wanted to change the font on my site&#8217;s Posts to a different one than the font on the Pages, I would go to Editor>Style.css and then change the style declaration for posts to display a different font.</p>
<p><img src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/db_pluginstools.jpg"/></p>
<p>The next panel is for <strong>Plugin</strong> administration.  Plugins are applications created to meet various needs site owners may have.  Much of the time, a developer realizes that there is a demand for a particular tool, such as a dynamic calendar, or a way to insert custom meta-tags in a site&#8217;s headers so they create a package of code to accomplish this and make it available for download often for free or minimal cost.  You can explore more about <a href="http://wordpress.org/extend/plugins/tags/">Plugins here</a>.</p>
<p><strong>Users</strong> is where you can control who has access to your Dashboard and how much access they can have.  If you have a site with a lot of contributors, this is where you will go to control who can go where.  </p>
<p>Under <strong>Tools</strong>, you have 4 selections: Tools, where you can enable Turbo and Press This (also found in the Turbo link in the top right), Import, where you can import content from other blogs, Export, where you can bundle your current blog&#8217;s contents, and Upgrade where you can install the latest version of WordPress.  (You&#8217;ll need to back everything up before doing so).</p>
<p><img src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/settings.jpg"/></p>
<p><strong>Settings</strong> is a pretty big topic but suffice to say it&#8217;s where you can work with features such as your site&#8217;s url structure, blog title and description, which Page on your site is the &#8220;Home&#8221; page and so on.  It&#8217;s very useful to explore the Settings panel and get used to the wide variety of options available.  And, speaking of Options, some versions of WP use the term &#8220;options&#8221; instead of &#8220;settings&#8221; which is good to know when you are searching for help online for a WP issue.</p>
<p>So that&#8217;s the basic left side toolbar of the dashboard.  Underneath Settings is usually where any Plugins that you&#8217;ve enabled outside of the standard ones included in WP will show up and you can utilize them from there.  </p>
<p><strong>3. Create Some Content<br />
</strong><br />
Now that you&#8217;re familiar with the dashboard, you can begin creating content for your new site.  Since the method for creating Posts and Pages is roughly similar, I&#8217;m going to discuss creating a Post and it should help with creating Pages too.  What&#8217;s the difference you ask?  There are a few analogies I like to use but here I&#8217;ll just say that Posts are like press releases or newsletters about your company and Pages are like brochures.  So, here&#8217;s how to create a Post:</p>
<p><strong>Step 1: Log In to the Dashboard</strong><br />
Once you&#8217;ve signed in, you&#8217;ll notice a window in the top right of the dashboard called &#8220;QuickPress&#8221;.  This is very handy when you want to simply write a post and get it up on the site without a lot of formatting.<br />
<img src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/db_topright.jpg"/></p>
<p><strong>Step 2: Creating the Content</strong><br />
If you need more control over the layout and look of the Post, then simply go to the Posts section in the left toolbar and click &#8220;Add New&#8221;.  (You may need to click the arrow to the right of Posts to open the menu.)  </p>
<p>Now the full size edit window will open up and you can add the Post&#8217;s title and begin creating the content.<br />
<img src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/newpost1.jpg"/></p>
<p>Oftentimes people find that they can simply copy and paste text from another format into WP and it works just fine.  However you get it in there, once it&#8217;s there, you probably want to play with the formatting a little and WP makes this fairly easy in several ways.</p>
<p><strong>Step 3: Formatting the Content</strong><br />
There are two different modes of editing, Visual and HTML.  Visual is good when you are working with text and images.  HTML mode is handy when you want to paste in things such as an embedded map or video.  It&#8217;s also possible to create divs and markup for precision styling via your style.css file.  Let&#8217;s start with a tour of the Visual mode:</p>
<p><img src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/toolbar1.jpg"/></p>
<p>These are the buttons for formatting your content.  To use them, simply highlight the text you want to change and click one of the buttons.  From left to right they are:<br />
Bold<br />
Italics<br />
Strike-Through (when you want to show that some text has been changed)<br />
Unordered List (will format a list with bullet points according to whichever style your theme&#8217;s author has designated)<br />
Ordered List (a numbered list)<br />
Block Quote<br />
Align Left<br />
Align Center<br />
Align Right<br />
Insert/Edit a Link<br />
Unlink the text<br />
More (for when you only want to display the beginning of a post on the blog&#8217;s home page)<br />
Spellcheck (with various European languages included)<br />
Toggle for Full Screen Mode<br />
Show/Hide &#8220;Kitchen Sink&#8221; mode (see below)<br />
+ any plugins you have enabled such as CFormsII or NextGen Gallery</p>
<p><strong>Kitchen Sink Mode Buttons:</strong><br />
Paragraph Styles<br />
Underline<br />
Align Full<br />
Text Color<br />
Paste as Plain Text<br />
Paste from Word<br />
Remove Formatting<br />
Insert/Edit Embedded Media<br />
Insert Custom Character<br />
Outdent<br />
Indent<br />
Un-Do<br />
Re-Do<br />
Help (opens a pop-up window)</p>
<p><strong>Editing in HTML Mode</strong></p>
<p>HTML mode is handy when you want to include some markup into your content, but don&#8217;t want to deal with hand-coding.  You can highlight your text and then apply the various tags like so:<br />
(from left to right)<br />
b=Bold text<br />
<em>i</em>=Italicized<br />
link=A hypertext link<br />
b-quote=block quotet<br />
del=delete<br />
ins=labels text considered inserted into a post. Most browsers display as underlined text. (Assigns datetime attribute with offset from GMT (UTC))<br />
img=this creates a tag for inserting an image into your post.  If you have an image stored in your uploads folder, or, on an online album such as Photobucket, you can paste a link into the dropdown window and the image will be displayed on your site.<br />
ul=un-ordered list<br />
ol=ordered list<br />
li=list item on a list<br />
code=Creates preformatted styling of text. Generally sets text in a monospaced font, such as Courier<br />
more=a way for you to contain the beginning of a post on a  page and then include a &#8220;read the rest of this article&#8221; teaser linking to the full post.<br />
lookup=Opens a JavaScript dialogue box that prompts for a word to search for through the online dictionary at answers.com. You can use this to check spelling on individual words.<br />
close tags=closes any open HTML tags in your post.</p>
<p><strong>Step 4: Inserting Media</strong></p>
<p>Once you are satisfied with the text, you can add some media to your post.  Click on where you would like an image to appear and then select one of the choices in the Add Media: menu in the top right corner of the edit window.  The choices from left to right are: image, video, audio and add media.</p>
<p><img src="http://www.jennmearswebdesign.com/wp-content/uploads/2009/06/upload_insert.jpg"/></p>
<p>Depending on the version of WordPress you are using, the upload window may behave in various ways.  Sometimes you can upload images or media just fine, but WP doesn&#8217;t want to actually <em>insert </em>them into the post.  A little frustrating, but luckily there&#8217;s a way around this.  In HTML mode, click on the &#8220;ins&#8221; button and in the dropdown window that appears, enter the image&#8217;s url like so: </p>
<p>http://www.yoursitesname.com/wp-content/uploads/year/mo/day/nameofimage.jpg</p>
<p><strong>Tip:</strong> if you want an easy way to copy and paste your image&#8217;s url, click on add media, then select either &#8220;Gallery&#8221; for images you&#8217;ve just uploaded, or &#8220;Media&#8221; for everything in your uploads folder.   Click on the media you wish to add, and then look for the Link URL listed in the window.  Then you can copy and paste that if needed.</p>
<p>Also, I&#8217;ve noticed that adding Flash movies is a little  tricky.  You can circumvent this by installing the <a href="http://kimili.com/plugins/kml_flashembed/wp/">Kimili Flash embed plugin</a>.  (you&#8217;ll need a way to FTP files for installing plugins)</p>
<p><strong>Step 5.  Tags, Categories, Author and Advanced Options</strong></p>
<p>Now that the content of the Post (or Page) is all set.  You can either save it as a draft, or Publish it.  It&#8217;s a good idea at this point to assign the Post to a <strong>Category</strong> and add <strong>Tags</strong>.  These are how your posts are cataloged in your WordPress database so that your readers can find them.  I like to think of this as like a library&#8217;s way of organizing non-fiction.  Categories are like broad topics such as Music, Art and Science, and then Tags are helpful for breaking down categories further such as Rock and Roll, Opera, Painting, Renaissance, Zoology and Particle Physics. </p>
<p>If your blog has multiple authors, always scroll down to check the <strong>Authors</strong> selection to make sure the right Author is chosen for the post.</p>
<p>WordPress sites can be modified to show only an excerpt of the content to draw readers in for more.  If you have this feature, then you can place an excerpt into the <strong>Excerpt</strong> window.</p>
<p><strong>Trackbacks</strong> are for when you have linked to another blog in your post.  If they have enabled Pingbacks, they will be notified that you have done this.</p>
<p><strong>Custom Fields</strong>, according to WP&#8217;s Codex;</p>
<blockquote><p>offer a way to add information to your site. In conjunction with extra code in your template files or plugins, Custom Fields can modify the way a post is displayed. These are primarily used by plugins, but you can manually edit that information in this section.</p></blockquote>
<p>You can read more about custom fields <a href="http://codex.wordpress.org/Using_Custom_Fields">here</a>.</p>
<p><strong>Comments and Pings</strong> are enabled by default and I&#8217;ve never seen a reason to dis-able them.  If you didn&#8217;t want people to comment on your Post or be notified if someone links back to it, then you could do that here.</p>
<p><strong>Password Protect</strong> is used when you want only certain people to see the Posts content.  You can set a password here for people to use when they are allowed to read this Post.</p>
<p><strong>Step 6. Publish!</strong><br />
Once you are satisfied with your Post&#8217;s content and settings, it&#8217;s time to publish.  This will place your post at the top of your archives and allow others to read it.  Tip: If you want to change the order in which a Post will show up in the Archives(arranged chronologically), click Edit next to Publis and choose a date that will place it where you want in your Archives.</p>
<p><strong>What about Pages???</strong></p>
<p>Pages, (brochure-like info remember?) use the same editing tools as Posts.  Pages, however, don&#8217;t have Categories or Tags, but they do have hierarchy and templates.  If you would like for one page to be a sub-page, or &#8220;child&#8221; of another, you can choose that from the Parent Page dropdown menu on the right.  Page Template is where you can choose a Template that may have been created to give certain Pages on your site a particular layout or &#8220;look&#8221; via CSS styling.  Pages are otherwise set to display the &#8220;Default&#8221; template.</p>
<p>And that is pretty much it as far as getting your content into your WordPress site.  If you have further questions, feel free to send &#8216;em my way!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.jennmearswebdesign.com/2009/06/how-to-use-wordpress-part-1/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Buttons and Chicklets and Badges Oh My!</title>
		<link>http://www.jennmearswebdesign.com/2009/02/buttons-and-chicklets-and-badges-oh-my/</link>
		<comments>http://www.jennmearswebdesign.com/2009/02/buttons-and-chicklets-and-badges-oh-my/#comments</comments>
		<pubDate>Wed, 18 Feb 2009 17:18:43 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Business]]></category>
		<category><![CDATA[Facebook]]></category>
		<category><![CDATA[Lifehacks]]></category>
		<category><![CDATA[social media]]></category>
		<category><![CDATA[tutorials]]></category>
		<category><![CDATA[Twitter]]></category>
		<category><![CDATA[badges]]></category>
		<category><![CDATA[social networking]]></category>

		<guid isPermaLink="false">http://www.jennmearswebdesign.com/?p=316</guid>
		<description><![CDATA[My most recent client is looking to upgrade the blog portion of their site by adding features to increase readership and create an online community. It&#8217;s something that&#8217;s fairly easily done via the web, but it&#8217;s the kind of task that requires a few simple tips to make sure your site makes the right connections <a href='http://www.jennmearswebdesign.com/2009/02/buttons-and-chicklets-and-badges-oh-my/'>[...]</a>]]></description>
			<content:encoded><![CDATA[<p>My <a href="http://kenistoncompany.com">most recent client</a> is looking to upgrade the blog portion of their site by adding features to increase readership and create an online community.  It&#8217;s something that&#8217;s fairly easily done via the web, but it&#8217;s the kind of task that requires a few simple tips to make sure your site makes the right connections with your readers.<span id="more-316"></span></p>
<p>Step 1: Take a survey of sites you find useful.  These days, with everyone and their dog on seemingly every social networking site known to mankind, it&#8217;s a good idea to come up with some simple coping mechanisms to combat the information overload that can result from joining <a href="http://acronyms.thefreedictionary.com/Yet+Another+Social+Networking+Service">YASNS</a>.  Take a few sites that you visit frequently and gather a list of the social networking tools they employ.  Basically, the whole broad topic of Web 2.0 sevices can be broken down into three basic categories:  </p>
<p>Bookmarking Tools:  Those little badges for services like Digg, Reddit and Del.icio.us make it easy for your readers to save a link to your content and then share their links on their profiles.</p>
<p>RSS Tools:  These buttons allow a reader to add a feed from your site to a feed-reader service.  While most blogs and feed-enabled sites already offer this via that little orange button you see in your browser&#8217;s address bar, there are plenty of services out there such as Netvibes and Google that make it easy to track your favorite blogs via a personalized feeds display.  <a href="http://feedburner.google.com">Feedburner,</a> recently acquired by Google, is a good tool for maintaining your feed(s) and the service gives you a feed url to use as well as some button generating tools.</p>
<p>Social Networking Tools: Join a site like Facebook or Twitter and you can get the code to display a badge on your site that links to your profile.  Other services such as Google&#8217;s Friend Connect and MyBlogLog allow blog owners to build an online network with other bloggers.</p>
<p>Step 2: Once you have a sense of the types of services you want to offer and info you want to display,  create a way to keep track of everything.  When I sign up for a site or service, I make sure I keep a record on paper of the username, password, screen name and url of my profile page if necessary.  And, since a lot of these services like t send you a confirmation/activation email, I have a folder in my webmail just for membership-related emails.  (I draw the line at subfolders though.  There&#8217;s only so much OCD I can take.)</p>
<p>Step 3: Now that you have a way to keep track of your various memberships, go create them!  Here&#8217;s a list of popular services, separated by category of service:</p>
<p>Bookmarking Tools:<br />
Del.icio.us<br />
Digg<br />
Stumble<br />
Reddit<br />
Slashdot</p>
<p>RSS Tools:<br />
Feedburner (if you only join one rss service, make it this one!)<br />
Google<br />
Newsgator<br />
BlogRovr<br />
MyBlogLog<br />
My Yahoo<br />
Netvibes<br />
Amazon Kindle<br />
Viigo<br />
Bloglines<br />
Windows Live<br />
Wikio<br />
Blog Networks</p>
<p>Social Networks:<br />
Facebook<br />
MySpace<br />
LinkedIn<br />
Twitter<br />
Flickr<br />
YouTube</p>
<p>Step 4: Now that you&#8217;ve joined everything, you&#8217;ve probably noticed that there&#8217;s a lot of <a href="http://www.jennmearswebdesign.com/2009/02/14/hmmm/">interconnectivity</a> out there between services.  You can post your Twitter Tweets to your Facebook Wall, your Flickr Feed to your Myspace page and put your LinkedIn badge all over creation.  Don&#8217;t stress that yet.  For now, you want to make sure your loyal readers know how to make the most of your site.  It&#8217;s time to add some buttons to your site.  Sign into your Feedburner account and burn a feed for your website.</p>
<p>Step 5: Once you&#8217;ve burned your Feedburner feed for your site, go to their &#8220;Publicize&#8221; page.  Now you can do some &#8220;one stop shopping&#8221; for some feed chicklets!  Click on the &#8220;Chicklets&#8221; tab and then simply choose the feed aggregator services you want from their 24 item menu.  You can also head over to <a href="http://www.toprankblog.com/tools/rss-buttons/">Top Rank&#8217;s blog</a> and get even <em>more</em> chicklets.  Tip: save the code generated by these services in a plain text file for easy access.  You can then copy and paste the code to display these badges wherever you&#8217;d like on your site.  For example, if you are using a WordPress site with widgetized sidebars, then you would go to your Widgets page on your dashboard, select the sidebar you want and then add a text widget.  Then, simply paste in the code and save your changes.</p>
<p>Step 6: Now that you&#8217;ve added a way for your readers to get updates about your blog, you should add ways for them to bookmark and share your content.  <a href="http://www.addtoany.com/buttons/">Addtoany.com</a> is  a great service that lets you grab a selection of bookmarking icons to add to the post template of your blog.  <a href="http://addthis.com">Addthis</a> is another site that lets you get one button that contains all the code for your bookmarking services.</p>
<p>Step 7: Once you&#8217;ve placed some feed chicklets and bookmarking buttons on your blog, you can get to work on your badges.  Log into your account at Facebook.  Then, underneath the left sidebar of your Wall, you should see a link that says: &#8220;Create a profile badge&#8221;.  Simple enough.  Twitter has a couple of ways to make your badge.  If you go to your Twitter page, on the bottom there&#8217;s a link that says &#8220;Apps&#8221;.  Go there if you want  to have a badge on oyour site that displays all your latest &#8220;tweets&#8221;.  If you want a button that says something like &#8220;Follow me on Twitter&#8221; then <a href="http://www.twitterbuttons.com/">here&#8217;s a site</a> that has an easy to use interface for creating your personal Twitter button.  Extra Credit Project: since I can be a bit of what&#8217;s politely termed, &#8220;A Control Freak&#8221;, I created my own Twitter button, uploaded it to my images file and then linked to it in the sidebar with a surrounding hypertext link to a Twitter profile. </p>
<p>Step 8:  If you want your readers to join a network of other bloggers and blog readers, then you can also insert a service for that.  I&#8217;ve used <a href="http://www.mybloglog.com">MyBlogLog</a> which offers an free trial period and then charges $25 for a &#8220;Professional Account&#8221; and they are pretty cagey about what the benefits are.  Therefore, I recommend <a href="http://www.google.com/friendconnect/">Google&#8217;s Friend Connect</a>, a free service which is more user (and wallet) friendly. All you need is a Google account.<br />
#Jenn Tip: I was able to fully customize the code in the Friend Connect badge to fit into a narrow sidebar and also switched out the hexcodes for ones that specifically matched a client&#8217;s logo colors.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.jennmearswebdesign.com/2009/02/buttons-and-chicklets-and-badges-oh-my/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

