For the most part, I don’t think the readers of my sites care. If you’re at my photo blog, you could care less about the code that goes into the back end, you’re there to look at pictures. If you’re on jamesrlee.info, it’s probably because I wrote a tutorial that you need. It’s about the content – not the theme that styles the web page.

But I care about the style, because I know that the way information is presented makes it easier (or harder) to use. As such, I strive for clean designs that are unobtrusive.

Quite frankly, it’s how I design everywhere. For example, I’m designing a new web site for work right now. I’m trying to keep it very simple and easy to use. The site has two main purposes, and I want them to pop when you view the page. I don’t want users to get lost in a bunch of details that have nothing to do with my message. I’m not a professionally trained designer, so I am actually using someone for help on that project. Steve Sicherman is really good, and reasonably priced – I highly recommend his services.

Sorry – I’m getting off topic. I switched themes, which means I am changing the design of my web sites. I was using Thesis, I am now using Canvas.

It started with a very public spat between Chris Pearson, the author of Thesis, and Matt Mullenweg, the creator of WordPress. They argued, quite publicly, about the way Thesis was licensed, and whether Chris was violating the software license that WordPress issues. If you want to know more about that, there are – several – great – resources. In the end, Chris capitulated somewhat, but along the way he lost his business partner. And some customers.

Including me.

Matt Mullenweg famously offered to buy anyone a copy of another Premium theme. I haven’t received any of that money, but I did buy into Canvas from WooThemes, and so far, it’s an improvement for me.

jronaldlee.com now looks like this:

It used to look like this:

Smaller photos on the home page, with just a snippet of text. Still, the individual post pages are almost the same.

So what’s my take on the two themes? Which is better?

If you really know what you’re doing with PHP and CSS, Thesis is amazing. It’s really complicated, but that’s because it has so much power. If you know what you’re doing, you can make a Thesis site look like anything you can think of.

If you’re not a coder or designer, you should stay away from Thesis. I’m officially endorsing Canvas for 99% of the world… it’s just that much easier to use, and not very hard to customize, either.

Because there are more people using Thesis at this point, the support forums are a little better, but again, unless you’re doing some high level customizations, you’re better off with a theme like Canvas and making your site yours via built in controls.

In the end, it wasn’t the GPL spat, or the ease of use that pushed me to Canvas. What pushed me over the edge was Chris himself.

Read The F—— Manual

If you want help with anything in Thesis, your first bet is go read the manual. The URL for the manual? RTFM.

It’s here: http://diythemes.com/thesis/rtfm/ – though this is a members only site, so you won’t be able to access it unless you’re a paying customer. As a business person who works in a professional environment, that URL bothers me. As someone with kids, it bothers me. If I want to teach a thirteen year old how to use Thesis, I have to tell the kid to “RTFM.” So I went to Chris’s forum and said it bothered me.

After taking a cheap shot from the staff about me taking their URL as a “personal insult” (I’m not dumb – I know it’s not directed at me), I explained that I was just trying to offer a different perspective on how they could run their business without alienating a portion of their customer base. That’s when Chris weighed in. He doesn’t participate in the forums that much… in fact, it’s only the 22nd time he has deigned to leave a response on his own forums, and here’s what he had to say:

If I want to run a lighthearted business, I have a right to do so. By the same token, you have control over how you choose to let things affect you. No harm or negativity is intended on our end, so as far as I’m concerned, this is something you need to address with yourself!

By that logic, I can use racial slurs, and as long as I mean no harm, and it’s all in good fun, the problem is with the people who get offended – not me.

So I reached back out again. Tried to tweet to Chris – no reply. Left a message on his forum – no reply. I have been labeled, and can now be ignored.

I don’t get a refund with this change. I’m just doing what I think is right… taking my efforts and putting them into places that don’t ask me to compromise my values. So it’s costing me a few bucks, but what can you do. In the end, it’s about how I want to live my life. If Chris wants to run a light hearted business that strains the boundaries of common business standards of polite behavior, he can.

And I can take my sites in a different direction if he wants to be sophomoric about the whole thing.

EDIT: I’ve since moved again… at this point, I’ve tried all three of the big dogs (DIY, Woo!, and StudioPress). I’ll write more about it later…

Your first step is choose the content you wish to embed. Many media services have embed code available to you. In this example, you will access the embed code by pressing the “Embed” button on the bottom right of the web page.

Next, it will be time to select your options. In this example, I have chosen the following:

• Not to include related videos. This prevents a bunch of other videos showing up after people watch the one I selected.
• I am showing a border (I choose the red color scheme).
• Privacy mode is enabled, which controls how YouTube stores cookies on my guest’s computer.
• I am not using iframe code (not compatible with all browsers).
• I’ve chosen a size of 500 x 405 pixels.

Once you’ve selected your options, you copy the code in the box.

To paste it into your blog post you must be in HTML view. If you paste embed code while in visual mode, it will not work.

After you have entered the embed code, you can go back to visual view and add text around the place holder for your video, which shows up as a yellow box.

The end result: here is the video!

• Format Text – Using the drop down list here, you can select from a list of formatted text options. Your blog likely has a uniform look and feel to its text, by modifying it using predefined options, it is easy to maintain that look.
• Underline – Unlike the more popular bold and itallics, underline is relegated to the kitchen sink.
• Align Full – You may know this button by its more popular name, “justify.” Simply a way of making the text use all the space from one margin to the other.
• Select Text Color – Use the drop down to select custom text colors for your post.
• Paste as Plain Text – Pasting text into WordPress can be tricky. In today’s software, text almost always has formatting code with which it is associated, and pasting directly into WordPress can have unintended results with your post’s appearance. If you have copied text from another program, you can paste it as plain text into your blog post by pressing this button.
• Paste from Word – The makers of WordPress did simplify pasting text that has been created in Word, and you can use this button to make its insertion relatively pain free.
• Remove Formatting – Your fastest method for removing formatting code that doesn’t quite seem right… a sort of get out of jail free card.
• Insert/Edit Embedded Media – Unless your blog’s administrator has added a plug-in to make media insertion easier, this button is intended to help in the task. Flash, Quicktime, Shockwave, Windows Media, and RealTime formats are all supported.
• Insert Custom Character – Whether you have need for an áccent over a letter or a © symbol, this button gives you access to non-ASCII characters.
• Outdent – In Word, this button is called “Decrease Indent.” It is only available if you have already indented your text, and may be used to reverse that decision.
• Indent – Used to indent the text you are entering by about five spaces.
• Undo – Reverse your most recent changes to your post.
• Redo – Undo’s undo. If you decide you didn’t want to undo something after all, click here.
• Help – When all else fails, you can try the help file to search for more pearls of wisdom for use in your WordPress text editing.

This concludes our tour of the Kitchen Sink. If you have any questions, or would like to learn more, please drop me a note.

One of the primary reasons businesses implement blogs is because it creates new content on their Web site. That only helps if people can find your content. As such, WordPress, different themes, and plugins all offer tools you can use to improve your sites ability to be found on the Web. This is the dark art of search engine optimization, or SEO. If you’re going to blog regularly, you can and should become more familiar with SEO, but that is not what this post is about. A good place to get started is here.

When you first visit your WordPress blog, you may or may not be logged in from your previous visit. If you are not logged in, you will likely find a “Log In” link in the “Meta” section of the front page.

If you’re already logged in, you will find an “Admin” link instead of a “Log In” link. In order to create your first post, you will need to either log in or click the Admin link. Either way, you will be taken to your site’s “Dashboard” view. Your Dashboard may look different than this depending on how your blogmaster has the site set up. For this lesson, we’re going to concentrate on adding a new post.

Click to enlarge - new post screen

After clicking “Add New,” you will be taken to the “Add New Post” screen. There are a lot of options you can customize here! The more you know, the more you’ll be able to customize your posts. It’s important! If your copy doesn’t look good, who will read your posts?

Your initial view shows you in “Visual” edit mode. Next to the “Visual” tab you’ll see the “HTML” tab; something we’ll cover in a future lesson. This lesson will focus on your initial tool bar and what tasks the following buttons perform.

• Bold – Switches your editor to bold text.
• Itallics – Switches your editor to itallic text.
• Strikethrough – Switches your editor to strike through text. In blogging ettiquette, it is considered bad form to remove text from a post once other people have had the opportunity to read your posts. While there are obvious exceptions to this rule, it is most common for editors to leave text in place but use the strikethrough option if a published post needs to be edited.
• Unordered List – This is Web speak for bullets; a list that is not in specified order. This section of the post is an unordered list.
• Ordered List – Also known as a numbered list.
• Blockquote – Commonly used to differentiate your text from another source.

For example, if you are blogging about an article you read, and you want to include some of the text from that initial article, you should utilize the blockquote feature to differentiate the other person’s content.This text is added using the blockquote function. Most blogmasters will have this text automatically formatted to look different than the rest of your post – makes it easy for you to write and quickly publish. While you’re typing in “Blockquote” mode, your text will look indented in your text window, but when you publish, the text will be formatted as a quote.

• Your basic alignment controls; left, right, and center.
• Insert/Edit Link – Use this button to insert a link. This button will be inactive by default unless you have some text highlighted in your post, or your cursor is on an existing link within your post.

Insert/Edit detail

Clicking the Insert/Edit Link button will bring up the following box.

The Link URL box should include http:// at the beginning of each Web address.

The Target setting determines if your link will open up in the same window or a new window. It’s common practice to set this to “new window” on a corporate blog when the link takes your visitor to another Web page.

The Title setting is text that the user will see when their mouse is pointed at the link. Think of it as “pop-up” help to describe your link.

For text links, leave the Class as “Not set.”

When you want to add a link, type the words you want to show up in the post that will be the link, then click the Insert/Edit Link button to access this menu. Add the Link URL, set the target, and add a “title” (optional), and click Insert. That’s all there is to it!

• Unlink – To remove an existing link, place your cursor in the link (no need to highlight), and press unlink. The entire link will be removed.
• Insert More Tag – This adds a dividing line in your post. In the main page of the blog, only the portion of your post before the “More” tag will show up, and your readers will be invited to [click to continue...]. This is a good practice for posts of more than a few hundred words; it keeps a single lengthy post from overpowering your blog’s home page.
• Toggle Spellchecker – Clicking this will turn the spellchecker on and off. Using the drop down you can choose the default language for your post.
• Toggle Fullscreen Mode – Clicking here will expand your text window to cover most of your Web browser’s window. Very handy for longer posts.
• Kitchen Sink – The Kitchen Sink opens up an extra set of buttons. This will be the topic of another post.

The fun is not over once you finish writing your post. Assuming you have everything to your liking, you’ll want to at least save your post, and maybe even publish it.

The Publish Box

At the top right corner of your Add New Post screen is the Publish box. Some of the highlights here include:

Save Draft allows you to save your work so you can come back and continue your post later.

Preview shows you a sample of what your current post will look like by opening it in a new window.

If you routinely write posts that someone else will review and edit before they are posted, you can change the Status from Draft to Pending Review. This is not a common selection.

In the Visibility section you can set a post to utilize a password or remain private. Most users will not use this option. You can also set your post as a “Sticky,” meaning it will stay at the top of your blog’s home page.

You can also select when your post should be published. Clicking the Edit link next to Publish Immediately will allow you to set your post to publish in a few days while you’re on vacation, or you can back-fill a gap in your post history by setting it to publish before you even wrote it.

It’s a good idea to save your posts as drafts when you first start out. By doing this, you can then get the opinion and advice of more experienced bloggers within your company before you publish your content. Once you are completely satisfied with all of your selections in your post, and get to thinking about the content of your next post.

This tutorial continues with the kitchen sink explained.

The easiest way

If control of the size isn’t important, just browse to the photo’s Flickr page, copy the URL, and put square brackets around the URL in the comment box. Here’s what it looks like, both in the comment box, and in preview mode. Your image will always be the “small” version, but Flickr will automatically display the image, and the image will be a link back to the picture’s Flickr page.

There are two downsides to this method. One, you’re stuck with that size. Two, it only works in Flickr. What if you want to control the image size? Or display a picture anywhere outside of Flickr?

The mostly easy way

1) Browse to the picture, then select All Sizes.

2) Choose which size image you want (usually small or medium), then scroll down to the bottom to grab a link. There are two options down there, but only the top one will link back to the photo’s page, so that’s the right one to use.

3) Paste the code into your comment box.

4) I like to “Preview” to make sure I did it right.

If I had been viewing Medium or Large when I copied the URL, I would have gotten a different size to display. Easy, huh?

Usually that’s it… but sometimes that handy box at the bottom of the page isn’t there. Are you out of luck? No, but it takes a little more work to get the URL of the image and format it to display.

The Hard Way

First, you need the URL. You’re still going to need to browse to the size you want to embed by visiting “All Sizes. To get the URL, begin by right clicking the image. Depending on your Web browser, select the option that will get you that image address. Those options are:

• Chrome: Copy Image URL
• Firefox: Copy Image Location
• Internet Explorer: Properties (which will display a box with the address which you then must copy)
• Safari: Copy Image Address
• Opera: Image Properties (which will display a box with the address which you then must copy)

Next, you have to know a very small amount of html to get your image into your post.

If you aren’t bothered by those pesky rules that say you must link back to the original image’s page, it’s pretty easy. Here’s the syntax:

All you’re adding is in red. Everything else is the URL of the picture. The result is the same as the previous, easy method, except the image is not a link. What to do?

If you want to be a good Flickr citizen, and link back to the image’s page, you’re not quite done. You have to add link code around the image code. Fortunately, that’s not too hard.

First, go back to the image’s regular page, and copy its URL:

Next, we add the link text around our previous code. Here’s the syntax:

• Green text is the link code
• Blue text is the URL of the image’s page
• Red text is the image display code
• Black text is the URL of the size image you want to display

Again, I like to preview before I post it, but it looks pretty much the same as before:

There are other ways to do this, but they do not give you the same control of the image size that it displays.

If you like the clock tower picture, you can find it both on my blog and on Flickr.

Fast forward 290 years, and the desert Scott now lives near by. I am pleased to find that the Nutfield Networking Group, which in recent years has been been a networking group primarily via Yahoo! groups, is beginning regular meetings again. In a recent e-mail to the group, Vincent Pelliccia (Co-founder & director) wrote,

I cannot tell you how excited we are to approach the restart of our regular meetings. The Yard’s facilities are near perfect for our group with room for nearly 300 people. The energy and heart of the group, recalling the many compliments we received, will be rekindled and reenergized soon. Marty, Jeanne, Steve and I are very enthusiastic about the upcoming meetings and those to follow. As you know, we had an incredible series of events with quality presentations and activities. Jeanne is working diligently to line up like talent and the meetings should be as strong as ever. We hope to see old and new friends next Tuesday at the Yard. Again, 4/7/09 7PM to 9PM at the Yard Restaurant in Manchester.

I had a chance to speak with Vincent, and I can tell that he is deeply committed to this cause. The Yahoo! group has been growing at a rapid clip since the resumption of meetings was announced, so it promises to have a good crowd and plenty of opportunity to network. Practice your elevator pitch, grab your business cards, and head on over to The Yard. In addition to the networking opportunities, a pretty good presentation is lined up. Peg Savoia, Account Manager at Bostonpost Technology, will be speaking about “The Versatile Job Seeker in Today’s Job Market”

This is a great opportunity for both the employed and job seekers alike. I hope to see some of you there. Learn more by visiting the Nutfield Networking Group‘s Web site.