WordPress and other CMS’s and frameworks are great tools for speeding up website development, but when it comes to integrating shops into websites, the options stink. You can go with plugins like WP-Ecommerce, but it’s such a pain in the ass there are professionals who do nothing but get that plugin running for civilians. You can pick e-commerce framework CMS thingies like OSCommerce or ZenCart, but they’re a bear to get working and a bitch to make look nice. I’m a developer, which means I’m kind of lazy and want to do things the easy way whenever I can, and make the computer or website I’m working with do as much of the work for me as possible.

Most self-hosted e-commerce solutions are overkill for most people, but the other end of the spectrum, the humble Paypal Buy It Now button, isn’t quite enough. It works, but it’s not especially professional looking. Here’s a good compromise that I love: using custom fields, you can integrate a Paypal shopping cart into your WordPress theme.

The first thing you do is go to Paypal, log in, and go to Merchant Services. There, you generate an Add To Cart button. The button type should be “shopping cart”, and then you fill out the item name, the price, shipping, and whatnot. Paypal also provides a feature for inventory tracking that I won’t go into here, but you should check out some time. Don’t worry about customizing your paypal button, because we won’t be using it.

Finish filling out your item details, and click the “generate button” button, and you should end up with something that looks like this (click images to embiggen):

THIS IS NOT THE CODE YOU’RE LOOKING FOR. See that little Email tab? Click that.

This is the code we need to use. Snag that URL and save it. This is your item code.

Next, scroll down and click Create A View Cart Button. Don’t worry about the details, just click Create Button. Just like last time, you’ll get a two-tabbed output, so select Email and save that code as well. This is your cart code.

Now we have the information we need in a format we can easily use. For the sake of this tutorial I’ll be using pages, but if you are so inclined you can use the same technique in posts as well.

Open up WordPress, and add a new Page. Give it a title and some content, then scroll down to Custom Fields. If you’ve never used Custom Fields before, they’re not as scary as you think. All Custom Fields do is provide free-form values you can use in your themes as key/value pairs.

Now, I know I said it wasn’t scary. It’s not. Honest. Here’s my review of custom fields. Go read it. I’ll wait.

Feel better? Ok, great. Now, in your new page, go down to the Custom Fields area and create a new custom field with your add-to-cart code. Lets call the new field “addtocart”. Click Enter New, and make it look like this:

Click the “Add Custom Field” button, and you get this.

You did it! Make sure you save your page.

So, now that we have the information in our page, we need to display it. Everything I know about conditional custom fields I learned from Jeff at Perishable Press, so we’re pretty much exactly using his code.

Displaying the content of a custom field is pretty simple, but I find it much more useful to display custom field information only if the custom field is filled out, so that’s what we’re gunna do. First, lets start with the code:

View Code

Here’s what’s going on. First, where WordPress has a key called “addtocart”, PHP should make a variable called $addtocart. Then, if $addtocart has a value (meaning, if the custom field is filled out and there’s a value associated with the key), then display a hyperlink pointed to the URL in the custom field, and make the link say “Add This Item To The Cart!”. Otherwise, if $addtocart is null (there’s no custom field filled out), do nothing.

You can obviously customize this to say anything you want, or to show a little image, or do anything else you like, but that’s the whole thing. Now all you need to do is take that code and put it in the page.php file in your theme, probably right after “the_content”.

All that’s left is the View Cart button, which is as simple as putting the link that Paypal gave you in a sidebar widget.

And that’s it, folks. I’m not going to go into the details of tweaking your theme, if only because this post is already long enough. Now, when you make a page, and you fill out the custom field with a Paypal button URL, you’ll get a link to add the item to your cart.

It doesn’t get much more simple than that, does it?

Question me in the comments!

View Code

But since we’re using the swfobject embed method for this particular SimpleViewer implementation, that wouldn’t cut it. Fortunately, I eventually ran across a post in the SimpleViewer forums that implemented the same parameter in a slightly different way, by adding ‘params.wmode = “transparent”‘ to the header script. Here’s the script pulled from my updated header:

View Code

Et voilà – SimpleViewer behaving nicely and obeying z-index rules.

Right now, I’m working on a minor redesign of our website. I say minor because the colors and structure will remain the same, while the content area – and possibly the back end – will be changing. I wanted to incorporate a bit of flashiness (not capital-F Flashiness!) into our portfolio, so I started looking around at all the jQuery slideshows, scrollers, carousels, and galleries out there.  I wanted something lightweight and customizable – both things that jQuery excels at – and something that wouldn’t scream “this site was designed in 2010″.

I found a *fantastic* little jQuery plugin called Tiny Carousel. It works off an unordered list, as most sliders/carousels do, and has a good amount of options for such a wee little plugin (just over 2 kb!). Bonus? It works (and looks fantastic) on my phone.

Bottom line: if you’re looking for a kick-ass jQuery Carousel plugin, check out Tiny Carousel.

One of the big freaking deals made over WordPress 3.0 was the introduction of Custom Post Types and its partner in crime, Custom Taxonomies. These are amazing wonderful things that will help make WordPress even more customizable! It’ll be even more like a CMS! Amazing! New! Oh Frabjous day! It’ll be so easy!

“That’s funny,” I thought to myself when I installed WordPress 3.0 for the first time, “I can’t find anything in the admin area anywhere about Custom Posts or Custom Taxonomies.” So I Googled these amazing new features to see where they were hidden, because surely they couldn’t be missing from the interface.

Turns out, I was entirely wrong. These features were missing from the interface entirely, because they’re not supported natively in WordPress 3.0. In fact, if I wanted to play with these “new features”, I’d have to hack core with entirely new code to make them work.

Whut?

Why don’t we take a closer look at these “features”?

Custom Taxonomies were introduced in WordPress 2.3. (Do you remember that? No? Neither does anyone else.) They started out as a hacky, but serviceable, solution. Here’s a good example of what you needed to do in WordPress 2.3 and above to enact custom taxonomies on your blog. Lots of coding. Lots of advanced coding, especially for a WordPress site. And check out the article: it’s for WordPress 2.8. Even taking into account that between WP 2.3 and WP 2.8 was The Era Of Hackiness, this clearly isn’t a feature that evolved much.

But then, Custom Taxonomies were refreshed for WordPress 3.0! What did we get? An incredibly inelegant and entirely code-based solution that’s exactly the same as it’s always been. Nothing has changed. There’s no easy way to do this, folks.

I hear you cry “Custom Post Types! They will liberate WordPress to take over the CMS world filled with Tumblr and Expression Engine!”

Ok, first? Shut up. Second, if you want to use WordPress for tumblogging, you’ll save yourself a lot of time if you install the Custom Post Template plugin and use that, and you’ll save even more time if you just get a Tumblr account. Third? Shut up, Expression Engine, stop being so unfinished and completely overpriced at the same time.

Custom Post Types, you say? What does my favorite WordPress codemeister Justin Tadlock have to say about it?

In WordPress 3.0, we’ll have the capability to easily create and manage content via custom post types. Not only that, but you won’t have to rely on a plugin to do this for you. It can be done via your theme’s functions.php file with a few lines of code.

Really, WordPress? Thank you for hyping the ever-living crap out of a feature that is effectively unusable for the average user and lives completely in the domain of the professional WordPress geek, like me. I appreciate it, I do. I could always use the work. I mean, look at this. And this. And this. And here’s what WordPress has to say about it, with their characteristic lack of practical, working examples. Clearly, not rocket science, and quite a powerful hack for those in the know.

Just as clearly, this is beyond your average WordPress user.

Maybe I shouldn’t bother getting so worked up about this, but WordPress is what it is because it’s supposed to combine a relatively easy-to-use interface with powerful power for power users. WordPress has a (relatively) long history of consistent growth in power and usability, with both elegant solutions and powerful public hacks, all available for everyone, everywhere.

Never have I seen such a cockup between an elegant feature and a hackity hack job hack as we have here. There’s a difference between features and hacks, and Custom Taxonomies and Custom Post Types are hacks, and it’s utterly ridiculous that the Automattic team has forgotten the difference.

Still don’t believe me? Check this out. If an average user wants to take advantage of these features, they need to install a third-party plugin. Do you understand how wrong that sentence is?

The Custom Post Type UI plugin is a marvelous little tool, by the way.  It automates the creation of custom post types and taxonomies for you. In other words, it does what WordPress really should be doing for you already and doesn’t.

So! If you want to take advantage of Custom Post Types and Custom Taxonomies but just can’t figure out how to make it go? Drop me a line. Obviously, when using some of the most populist software on the internet, this is a job for professionals.

Challenges

This project presented a wide range of challenges beyond a typical logo/brand design project (if there is such a thing). The original logo, shown at right, was well-liked by board members and committee members, but there was a fair amount of dissenting opinion regarding why the logo needed to change, if at all. We worked with the committee to focus on the reasons for undertaking an organization-wide rebranding. The resulting points of focus were:

• The organization lacks community recognition. A new logo, in combination with the forthcoming capital campaign and move to a new facility, can be used to increase awareness of the organization among three distinct groups: current and potential donors (primarily local businesses); community members who may be in need of the organization’s services, now or in the future; and potential volunteers.
• Among those who are aware of the organization, including volunteers, donors, and Board members, there is no common name by which the organization is referred; common names include “The Cluster”, “Cluster Outreach Center”, and “PCRC”. The rebranding offers an ideal opportunity to present a cohesive “short name” to the community at large, while maintaining a connection to the organization as community members may know it.
• The existing logo is outdated and is used inconsistently throughout the organization. In addition, the tagline “A Hand Up, Not a Hand Out” does not sufficiently communicate the organization’s mission. The new logo should be more modern, incorporate a new tagline, and guidelines should be provided for its use.
• The Board and Committee stressed the importance of maintaining a spiritual motif within the brand, in accordance with the organization’s mission and spiritual foundation.  However, because this is an interfaith organization, the imagery should not be specific to or exclude any one religion.

Process

Before hitting the sketchbook, I started with a hefty amount of research to find out how interfaith organizations represent themselves. The common theme seemed to be overlapping or interlocked symbols, usually circles, to display cooperation among groups. I also researched logos for non-profit organizations and religious organizations such as churches and youth groups.

I pursued a number of different routes and associated taglines with my sketches (above; click to view full). Of all the sketches, one that was purely a brainstorming throwaway – a stylized hand – started to stick out. (More on that in a bit.) I met with the Executive Director to review a select number of the sketches, and during an impromptu brainstorming session, the new tagline was born: “Nourishing Lives. Strengthening Families.”  The new tagline, with two still-rough logos, as presented to the Committee:

A number of type and color options were presented, including a crisper, less hand-stroked option for the heart/hand, but in the end, it was option A, in bright tones of purple and raspberry, that won over the Committee and the Board. Not bad for a throwaway sketch. It grew out of the existing “heart in hand” logo that they liked, and was originally nothing more than an exploration of an existing idea; an exploration that came to represent the evolution of their organization. The tagline, in cooperation with the evolved hand/heart, communicates their message and mission. The name of the organization was purposefully set to bring attention to the “short name” “Pottstown Cluster”, with emphasis on the commonly-used term Cluster, to enforce the connection between this logo and the existing organization. The inclusion of “Of Religious Communities” underscores the spiritual aspect of the organization, while simultaneously clarifying the organization’s name and purpose.

A look at the final logo and some of its implementations:

The logo and branding guide have been passed along to their marketing team, who will be implementing the logo for their capital campaign and website, and their new stationery, business cards, and brochures have been submitted to the printer. I look forward to seeing this design implemented throughout the organization as they proceed with their capital campaign and move to their new location.

To learn more about the Pottstown Cluster and their mission, learn more about the capital campaign and new building, or get involved in their support of the Pottstown community, visit their website at PottstownCluster.org.

I asked the internet what to do about this, and the internet suggested that there might be an issue with my custom permalink structure. (My website was set up to display as http://www.mysite.com/%postname%/.) To diagnose a permalink issue, you go and set your permalinks back to the default. I did that, and my post showed up. So, I reset my custom permalinks to http://www.mysite.com/%category%/%postname%/, and my post went back to 404.

Clearly, there was a permalink problem, but I didn’t know what it was.

The weird thing was, if I manually edited the post slug in the permalink in the post to, say, Green1, it showed up on my site just fine right where it was supposed to.

Then, I realized that I tried to write this post before, but as a page. It was a fail page, though, so I trashed the page. Since WordPress has integrated trashcans in their admin area, that means that the program holds onto deleted content until you empty your trashcan. Turns out, there was a page in the trash also called “Green”, and it was conflicting with my current live page called Green. I deleted the old page permanently, and my post showed up immediately.

The moral of the story is: If you have a mysteriously missing page or post, check the trashcan to make sure you’re not duplicating a title (really, a post/page slug) isn’t conflicting with your new post. Trashed items are apparently not segregated from the rest of your content, and exist in the site’s navigation structure.

The moral of the moral is: take out the damn trash.

The payoff will be my next post on how to use Paypal and WordPress Custom Fields to create simple, elegant and fast e-commerce pages. Stay tuned for that.

So, what is a custom field? It’s a key/value pair. What the hell does that mean?

In WordPress, there is a fundamental divide between data and display (it’s a simplistic view, but if that bugs you, you probably don’t need to read this article, then). If you’ve ever installed WordPress before, you know that it’s a two-part operation: you upload .php files to your server, and you connect those files to a mySQL database. The parts that display live on the server, and the data lives in the database.

Imagine making 100 people fill out a form. Each person fills out the same form with different information. Think of it as 1 form filled out 100 times. Now, go find a magician, and give him your stack of 100 forms. He will shake them over a box so all the words fall off into the box, hand you the box, and leave. Now you’ve really got something interesting.

Sit down with your box-full-of-words and declare “Show me the name and age of the 61st person!” Out of the box flies “Margaret V., 34″. Next, declare “Show me the name, age, and eye color of all the people named John!” The details for four different Johns appears. “Show me the last form filled out!” and the information person 100 put down appears.

Are you getting the idea? The magical box-full-of-words is your mySQL database, and your commands are the .php files on your server. When you look at a .php file on the internet, the .php files say “TITLE goes here, DATE goes over there and the CONTENT goes underneath that”, reaches into the database, pulls out, say, post #34, and populates TITLE, DATE, and CONTENT with the information saved under that post.

It might be something like:

My Day

posted 3/04/2010

Today was wonderful! I got icecream!

So, are you starting to get an idea of how the data is stored? For post #34,

• TITLE:My Day,
• DATE:03.04.2010
• CONTENT:Today was wonderful! I got icecream!

For post #35, it could be

• TITLE:I have a Cat
• DATE:03.26.2010
• CONTENT:My cat is really cute when she lays on her back

We have defined information types, and the various information filed under them. The information types are KEYS, and the various information under are the VALUES. Collectively, we make KEY/VALUE PAIRS.

WordPress comes with tons of pre-defined key/value pairs already. Why do you care? Because you can take those KEYS, and put them in the .php files in your WordPress theme and make them display VALUES.

One of the things that’s awesome about WordPress is that, if you like, you can make up your own keys on the fly, and display them in your themes. That’s what a custom field is. (We’ve finally come back around to what a custom field is, yay!) A custom field is just an arbitrary key/value pair that you make up and use for your own sinister purposes.

For example, say you want your blog posts to display your mood. In your post, you go to your custom field, create a new key called “mood”, then set it to “bouncy”. Then, in your theme, under TITLE, DATE and CONTENT, you can add MOOD, and for every post you put a “mood” custom field in, it’ll output your mood in the blog.

Cool, huh?

I’ve tried to make this really simple, but what I hope was conveyed is that custom fields can be a powerful tool. In my next post, I’ll show you how you can use custom fields to create a quick-n-dirty e-commerce application for your WordPress website.

If you have any questions at all, please hit me up in the comments. I would HATE to have gone through all that and still be unclear.

Ok, so, it’s the Magnatune promotional ambient music podcast, so it’s not THAT big of a deal, but still. Kinda cool.

Hyphen hasn’t made it out to iTunes or the Amazon music store yet, that takes a couple of weeks, but if you want to purchase a copy now, I’ve published a copy of Hyphen at Bandcamp. The individual tracks are a buck a piece, and I’ve set the album price to “whatever you like, as long as it’s 8 bucks or more”. Why would you want to pay more? You might love me, and be excited to know that this money is direct artist support, or if you pay $15 or more I’ll send you a physical CD to go along with your digital download. Shipping and handling will even be included. Ain’t that cool?

That’s not the only option, either. You can also go to Magnatune and subscribe as a member, and for $15 a month you can download Hyphen and every other album available on the website, DRM-free.

If you want to license a tune from this album, and use it attribution-free in whatever wacky project you have going on, Magnatune can help you out there. (And then send me a note. I love wacky projects.)

If you’ve got a podcast or a blog and you want to review Hyphen, kill some time talking to me, or play some of my music, just drop me a line, and I’ll be happy to work with you.

And, finally, go to Braindouche! and subscribe to the goddamn podcast already. It’s music and stuff. Some of it is quite pretty. It’s free.

So, to review:

Buy Hyphen from me.

Buy a subscription at my label.

Subscribe for free to my podcast.

Drop me a line.

Click that link, and poof! You know where your package is.

I’ve been using this trick for years – probably read about it on Lifehacker or something – but I find that it’s something a lot of people don’t have in their database-o-internet-tricks. Enjoy!

How freakin’ cool is that?

The short version of the story goes something like this: I started 4 years ago, noodling around with sound software and publishing it on a podcast, and then one day listened to a new Magnatune dark ambient album and thought “hell, I make music like this, and better”. I sent off some tracks to the label, they came back with a yes, and here we are.

The album cover is Dani’s work, and it’s a confirmed awesome.

As I get to it, there will be more information on the podcast site, braindouche.net, but here’s what we know now: the release won’t be for a little while yet, but I’ll let you know when it’s live. It’ll be available for purchase on iTunes, Amazon MP3, and a few other places too, you can choose to get a subscription to Magnatune and get my album and a boatload of other great music for not a whole lot a month, and in the not-too-distant-future I will get some physical CDs printed up and let everyone know ahead of time, so we can have fun with preorders and whatnot.