scriptygoddess

12 Jan, 2005

Above The Fold

Posted by: Jennifer In: Announcements|WordPress: Lessons Learned

I've been a little absent around here lately, and part of the reason is that I've been working on a project that I can now formally announce here! I'm starting up a little side business. You see, I've always loved doing origami – from the time that I was a kid. I can't even remember when I started. And now I've decided to turn some of my creations into things I can share. Ok… sell. 😀 My little side business is called Above The Fold (AboveTheFold.org) and it's an online store for (at the moment) origami earrings, cards, and magnets. (More things will be coming).

(As for the .org – instead of the .com – the squatter "owner" of the .com is willing to sell it… for a mere $7K! heh. I'll be lucky if I sell 5 pairs of earrings this whole year!! LOL! I don't think it's in my budget!)

This may not seem very "scripty" related – but actually it is. When working on my ecommerce site, I briefly looked into some pre-made web-shops, but they were all a little "too big" for what I wanted to do. I wanted to add products easily. I wanted to have "add to cart" buttons automatically generated.. etc. etc. I thought I'd just start writing something on my own – but then realized that I could probably do A LOT of what I wanted with WordPress!! Not sure how many ecommerce sites are WordPress driven – but I did it quite easily. Now that it's up and running, I can see more "ecommerce" type "plugins" I can add – but for now, I'm busy making origami.

But I thought, for those interested, I might share some of my little tricks that make the site run. Many of them are take-offs on what I did for Christine with Pixelog.

First thing – I'm using WP 1.5 (formerly known as 1.3) for the site. Up until now, I hadn't had too much opportunity to play around with it – but I gotta tell you. This version KICKS BUTT!!! I've really been enjoying working with it and can't wait to upgrade my other blogs!

So, now on to the geeky-under-the-hood talk…

Product Setup.
Each product is essentially a post. The "Product Name" is the "Post title". In the "excerpt" field, I put the thumbnail image of the product. In the main post field I first put the full size photo of the product, then the "more" tag – then I put the product's description.

I store the price in a custom field. As well some products may come in gold or silver, so I have another custom field to indicate if it's one of those (and which one). I have another custom field that stores available sizes.

Home Page.
I wanted to show the most recent products that I had added to the store. (Just the thumbnails). To list just the excerpts (there may be another way – if so, please tell me!) I access the raw data from the database. Right BEFORE the WP Loop start I initialize my count variable:
<?php
$count = 0;
?>

After the loop start, here's what I have:
<?php
//each time we loop through - get JUST the post excerpt
$postdata = $wpdb->get_row("SELECT post_excerpt FROM wp_posts WHERE id = $id");
$count++;
if ($count == 1) {
echo '<ul class="itemlisting">';
}
?>
<li><a href="<?php the_permalink(); ?>"><?php echo $postdata->post_excerpt; ?></a><span class="title"><?php the_title(); ?></span><?php edit_post_link(__('Edit This')); ?>
</li>
<?php
if ($count == 4) {
echo "</ul>";
$count = 0;
}
?>
<?php endwhile; ?>
<?php
if ($count < 4 && $count > 0) {
echo "</ul>";
$count = 0;
}
?>

(I'm creating two lists of products – you may ask why I'm not making just one list. I did have it that way at one point – but had some cross browser compatibility issues. This method meant less code than some other options I was working with.)

Categories.
I have my "category" (product type) pages set up very similarly as the home page.

Post Pages.
This is where the fun gets started. My shopping cart is handled through paypal. WordPress itself is generating the product ID numbers. The product names are derived from the "post titles". Prices are grabbed from the custom field. I also display some customized text depending on that "gold silver" option.

So first, I want to extract the full size image – but not the product description.
$content = explode('<!--more-->', $pages[0]);
That breaks up the content into the two pieces. So to echo the first part (the part with just the full size product image) I do this:
echo $content[0];
To display the rest of the product description (formatted as you'd expect with paragraph and "br" tags) I do this:
echo apply_filters('the_content', $content[1]);
To get the custom field values:
$price = get_post_custom_values('price');
$sizes = get_post_custom_values('size');
$goldsilver = get_post_custom_values('goldsilveroption');

To echo the sizes in a drop down menu:
Size: <select name="os0">
<?php
$sizes = get_post_custom_values('size');
foreach ($sizes as $size) {
echo '<option value="'.$size.'">'.$size.'</option>';
}
?>
</select>

To echo the price, simply:
<?php echo $price[0]; ?>
I display the appropriate text for the gold or silver by doing this:
<?php if ($goldsilver && $goldsilver[0] == "gold") { ?>
Earrings are made with 14k gold filled posts and earwire.
<?php } else if ($goldsilver && $goldsilver[0] == "silver") { ?>
Earrings are made with sterling silver posts and earwire.
<?php } ?>

So that's it. I'm not completely done (is anyone EVER done tweaking their site??) I still want to add a few additional features. But at the moment, the site does everything and more that I wanted for a first release.

Sooo….Wanna buy some origami earrings? :)

9 Responses to "Above The Fold"

1 | Mark J

January 12th, 2005 at 1:33 am

Avatar

That "Shirt and slacks" one is one of my personal favorites… I often leave them when leaving a tip at a restaurant, as it can be done with bills.

2 | teli

January 12th, 2005 at 1:46 am

Avatar

Wow! I want to say your origami site is awesome (and I'm not just brown-nosing either) :)

I will definitely help to spread the word as much as I can for you and I truly hope it's a huge success…if only I had pierced ears…but I'm definitely keeping my eyes on those cute magnets

3 | Michael Moncur

January 12th, 2005 at 2:21 am

Avatar

Nice design, I love to see tools like WordPress stretched beyond their intended purpose. It doesn't look like a weblog at all.

And the products look great, from a fellow Origami enthusiast.

4 | susannah

January 12th, 2005 at 2:43 am

Avatar

jenn, that's so awesome! i remember your earrings from the NYE party! they're great! the site is looking fantastic, and i must say — you're products are beautiful! congratulations on such a wonderful project! :)

5 | Michael Moore

January 12th, 2005 at 5:56 am

Avatar

Caught your article about the AboveTheFold.org site from WordPress Planet and it really reminded me of something a local blogger ( Richard Soderberg ) set up for a local hat maker ( Corona Hats ). Now I'm off to buy some origami. Good luck with the new enterprise.

6 | j-a

January 12th, 2005 at 1:16 pm

Avatar

your origami website is awesome! congrats on making something extra!

7 | beth

January 17th, 2005 at 9:38 pm

Avatar

aww – my grandmother made me a pair of earrings exactly like that for me one xmas about 10 years ago – very cool!

8 | Alderete

February 16th, 2005 at 3:41 am

Avatar

Terrific article. I've started working on my own e-commerce site, and this has really helped me get started.

Regarding your method to extract the excerpt, did you try using the tag "the_excerpt()"? That's what the default WP 1.5 template is using for the Archive page, and that seems to just pull the image for me.

I am looking forward to your follow-up article(s), I think this is an unexplored area of WordPress. I especially would like to know more about how PayPal is integrated, etc.

9 | Stephen

March 2nd, 2005 at 4:04 am

Avatar

We made a store using WordPress and CCNow. I kind of had the same revelation as you when I realised WordPress can do much of what I need.

Would like to make the CCNow more integrated than it is but CCNow are awful at implementing useable code.

Featured Sponsors

Genesis Framework for WordPress

Advertise Here


  • Scott: Just moved changed the site URL as WP's installed in a subfolder. Cookie clearance worked for me. Thanks!
  • Stephen Lareau: Hi great blog thanks. Just thought I would add that it helps to put target = like this:1-800-555-1212 and
  • Cord Blomquist: Jennifer, you may want to check out tp2wp.com, a new service my company just launched that converts TypePad and Movable Type export files into WordPre

About


Advertisements