Simplepie + WordPress Blog + Lightspeed Webstore = :) !

Getting SimplePie and WordPress together and whomping a few snippets of code into your Webstore tpl files is darn near close to an actual “integration” of WordPress and Webstore as I have been able to get. OH HOW I HAVE TRIED EVERYTHING ELSE! Sorry for yelling.

My tests so far have gone really well, especially for my client’s sites that use Webstore as the main site. Which most people do. Although perhaps many have not bothered with WordPress at all because it’s been extremely difficult for the medium level coder (that’s me) to get WP and LS to “talk” to each other ever since the upgrade from Webstore 1 to Webstore 2 series. Webstore 1 series was so slight it didn’t really mind what you put into the tpl files.

WP to WS Trying to use wp-blogheader.php=fail.

WS to WP trying to use a php include=fail.

Lord Knows I spent hours trying to use include wp-blogheader.php to get WP posts into a Webstore template. And I long ago gave up trying to get WS into a WP theme. I read up on it. And I tried installing the WP tables into the same DB as WS and the Webstore and WP files into the same directory. No luck. This may be a testimony to the limits of my coding skills!

But what can I do? I keep working until I find a solution. And I did: RSS & Simplepie!

Simplepie is a PHP RSS Feed Parser. And as it turns out SimplePie can pull in any RSS feed local (your own feeds) or external (anybody’s feeds) and you can craft these feed items to look like a full blog post, post excerpt, a product on your Webstore (yes, you can create a post that looks exactly like a Webstore produc-it’s a bit more extra work and not for the lazy post-er) or an image feed from Flickr, for a dynamic photo gallery maybe, if that’s what you want.

If you don’t know it: WordPress generates feeds for everything! And Simplepie has been integrated into the WP core. They really are made for each other.

Anyway, even though Webstore templates are a bit of a maze you can easily add feeds from your WordPress blog. Because while Webstore gives us the option to make as many custom pages as we want in almost a CMS (content management system) capacity – as of yet it is not nearly as beefy as WordPress as a CMS. So think about all the fabulous things you can do with a WP page or Post and then think how you can craft special posts and excerpts & use specifc categories to feature items of your choice on your Webstore home.

Safety First!

Its been tested. You can safely embed the Simplepie include code in index.tpl.php and the code for the feed items in any Webstore tpl file. More about this later. Please have backups of your files before beginning this project!.

I’m not going to explain how WP works or how to start customizing the Webstore templates because that would make this post really long. So please have a basic knowledge of WP and editing Webstore files.
Thanks!

Getting Started

First you need to have WP installed and a category in mind to use for the feed items.

I made a new category called Featured and I excluded it from the main index.php (in my WP theme) so they don’t get displayed on the blog home.

If you already have categories up and running that are suitable to be displayed on the Webstore home page then you can skip that step.

The feed gets called very simply: if your WP is in a folder called blog and you have a category called New Products you’d type this: (I’ll show you where this goes later.)

‘http://www.mydomain.com/blog/category/new-products/feed/’. And if you have another category you’d like to feature — maybe an events category–

‘http://www.mydomain.com/blog/category/upcoming-events/feed/’. You can add that too. Simplepie doesn’t limit how many feeds you can grab.

Next download Simplepie. You can upload everything in the unpacked zip but all you really need is simplepie.inc.

Upload simplepie.inc to a folder in your root directory of your server. Name the folder inc because that’s easiest.

So now you should have a folder called inc with the file simplepie.inc in it.

Create another folder called cache and set the permissions to at least 755. This may not be enough for some servers. 777 is as high as you can go.

The Simplepie Include

Open index.tpl.php and paste this code at the very top of the file.

All LS Webstore templates have a big notice at the top so paste this right under it after the last ? > of the notice.

Make sure you don’t have any spaces before the new code, too.

More code-liciousness after the link!

Just One Feed

[php]<?php
include_once $_SERVER[‘DOCUMENT_ROOT’] . ‘/inc/simplepie.inc’;
$feed = new SimplePie(‘http://www.yourdomain.com/blog/category/new-products/feed/’);
function image_from_description($data) {
preg_match_all(‘/<img src="([^"]*)"([^>]*)>/i’, $data, $matches);
}
?>[/php]

Show 2 Feeds

[php]<?php
include_once $_SERVER[‘DOCUMENT_ROOT’] . ‘/inc/simplepie.inc’;
$feed = new SimplePie(‘http://www.yourdomain.com/blog/category/new-products/feed/’);
$feed2 = new SimplePie(‘http://yourdomain.com/blog/category/up-coming-events/feed/’);
function image_from_description($data) {
preg_match_all(‘/<img src="([^"]*)"([^>]*)>/i’, $data, $matches);
}
?>[/php]

Notice the second feed is called $feed2. If you want a 3rd feed just keep adding in the same lines and naming them $feed2, 3, 4, 5 etc. This is so we can pull feeds into different blocks in separate areas of our templates. And it is as sweet as candy.

WP Categories and Category Base and ETC.

By default all WP categories have the same base: /category/.

But if your WP Permalink settings use a custom category base make sure to replace “category” in the simplepie include code with this name.

Also you may not be using Webstore as the home page. Or your WP is not installed in another directory besides the root.

For example, my blog is installed in my root and I have a category page on my blog called Brooklyn ♥ so the category path is just /brooklyn/.

If I wanted to pull all my posts for this category I’d just use ‘http://mccormicky.com/brooklyn/feed/’.

If your blog is on a sub domain use ‘http://www.subdomain.domain.com/’ (usually it’s blog.domain.com).

Where to show the Feed?

Probably the hardest part of this process is figuring out how to work the feed items into your template. Keep in mind that depending on which tpl file you choose this block will get displayed on each and every Webstore Page. This is another reason I created my own left or right sidebars for most of my client’s Webstores. When I placed the feed item block under the main content panel in index.tpl.php I found it a bit distracting to see non-product content displayed under the product list or check out pages. One solution is to paste the feed item block code into custom_page.tpl.php. This means the feed items will only show up on your custom pages. But once again it will show up on ALL your custom pages!

Here are some likely tpl files we can put feed blocks:

index.tpl.php (block will be displayed on all pages)

sidebar.tpl.php (block will be displayed on all pages)

minicart.tpl.php (cool because the minicart doesn’t show up on the checkout pages!)

custompage.tpl.php (cool because your feed will only show in custom pages!)

The rest is just a mix of simple PHP foreach statement and HTML & CSS.

One Feed

[html]<div id="feed-block">
<h2 class="featured-products">Featured Products</h2>
<?php foreach ($feed->get_items(0, 3) as $item): ?> // 3 will be the amount of feed items shown. You can have as many as you want.
<div class="feed-item">
<h2><?php print $item->get_title(); ?> </h2>
<p><?php print $item->get_description(); ?></p>
</div>
<?php endforeach; ?>
</div>
[/html]

But Holy Smokes! you say. “I don’t want all 1,125 of my posts from my New Products category in my WP blog to show up on my Webstore. Right you are. Quick as a flash I have an answer for you: in the code block above you can limit how many get shown. 3 equals the feed item limit. If you can find room for it you can include 1,125 feed items.

Creating the Perfect Feed

Linkage

You might have noticed I didn’t include a link to the blog post in the feed title. Why? Well, it might not be that useful to have the feed item link back to the blog, I thought. And if you were a good post-er you already linked the post to the product on the Webstore with either text links or image links. If you are not in the practice of linking your images to products on your Webstore you had better start!

Content

If we are building a feed that will consist of our New Products category Posts we can use a few simple guidelines to create a perfect feed item:

The Title: short but descriptive.
The Image: linked to a product, small to medium-sized
The Text: short like Twitter, 140 characters or less.

The example image above shows 3 feeds with very small images and very little text. You don’t have to be that curt.

Remember to use the right Category! If you are using a specific Category for the feed please remember to choose it before you publish the post.

Testing your Feed

Each feed gets cached to a file in the cache folder you made so if you make changes to the posts that are in the feed you’ll have to delete the files in the cache folder then refresh the page to see the changes. By default feeds are cached for about an hour.

Troubleshooting:

I made this mistake so I can tell you not to do it. Don’t use the trim excerpts function if you want to use your excerpt contents to be the feed items. You know those little […] at the end of your excerpts? That’s what it gets rid of. But it will also will strip tags like < / a> in the excerpt. The excerpt displayed on the blog will be fine but the one in the feed item will not. Luckily this function is a snippet you have to add to the Theme Functions file and is not there by default. But here it is anyway so you can know what to avoid:

[php]function trim_excerpt($text) {
return rtrim($text,'[…]’);
}
add_filter(‘get_the_excerpt’, ‘trim_excerpt’);[/php]

I always view the source of my sites even if they look ok and I caught this one excerpt/feed item getting its tags hacked off.