Tag: Xsilva

Simplepie + WordPress Blog + Lightspeed Webstore = :) !

feed items using webstore,wordpress and simplepieGetting 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!

Continue reading Simplepie + WordPress Blog + Lightspeed Webstore = 🙂 !

Webstore Main Column

For this one design of Webstore I’m using a horizontal dropdown menu instead of a vertical one. When a category tab in the menu is selected, if that category has child categories, a submenu is displayed, floated to the left of the main column that has the product list. I really needed to be able to use a narrow column if the subcategory list was shown and a wide column if it was not. I needed to use an if, else statement.

I added an else statement so that after the first if fires off and the submenu is to be shown, a div named main will be used. If it wasn’t to be shown div.mainwide was to be used. It’s a small change but it solved the issue of having one style for the product list pages just because of a submenu that is visible only when when a category has child categories. Now instead of 2 views and 1 style I have 2 views and 2 styles.

Original code in productlist.tpl.php.

[php]<?php if($this->subcategories && (count($this->subcategories) > 0)): ?>
<div style="display:inline; float:left;"><br />
<p style="font-weight: bold; margin: -10px 0 8px 15px; "><?php _p("Browse subcategories"); ?></strong></p>
<ul style="margin: 0 0 15px 0;">
<?php foreach($this->subcategories as $categ): ?>
<li style="margin: 0 0 3px 15px;"><a href="<?= $categ[‘link’]; ?>">&#62;&#62; &nbsp;<?= $categ[‘name’]; ?></a></li>
<?php endforeach; ?>
</ul>
</div>
<br style="clear:both"/>
<?php endif; ?>
</div>
<div id="main_panel" class="rounded {2px transparent}">
<?php $this->dtrProducts->Render(); ?>
<br style="clear:both"/>
</div>[/php]

My code:

[php]<?php if($this->subcategories && (count($this->subcategories) > 0)): ?>
<div class="subcatlist">
<ul>
<?php foreach($this->subcategories as $categ): ?>
<li><a href="<?= $categ[‘link’]; ?>">&nbsp;<?= $categ[‘name’]; ?></a></li>
<?php endforeach; ?>
</ul>
</div>
<div class="main">
<?php $this->dtrProducts->Render(); ?>
</div>
<?php else : ?>
<div class="mainwide">
<?php $this->dtrProducts->Render(); ?>
</div>[/php]

**edited Nov19th,2009**
In case you are scratching your head about this post I don’t blame you. I sometimes publish a post without proofreading that much!
To clarify what I am rambling on about above: I am trying to present a workaround if you have removed the left or right column of webstore because you only need to show a left or right column when the sub category list is being shown.

Perhaps you decided to use a horizontal menu or feel no need to have any other columns but the main content panel? How then might you show the subcategory list without needing to use an inline style?

By default the template uses an inline style to show the subcategory list. I happen not to like using inline styles because I find them hard to manage and they can end up giving code bloat. Besides with 76 template files, you’re going to want to streamline as much as you possibly can!

Because it is sort of hard to style one div for 2 views (one with a left or right column and one without), I used a php statement to show one div if we are going to be seeing the subcategory list and another if we are not. When we see the subcategory list we use a narrower px div. When we don’t see the list we can use a wider px div. This frees us up from having to use a div sized to accommodate another div that is only visible if we are browsing a category that has subcategories.

Accordion Menu for Lightspeed Webstore

Lightspeed Demo Store

Where have I been? Chained to my desk customizing Lightspeed Webstore templates. Lightspeed is Point of Sale software exclusively for Mac. And Webstore is Lightspeed’s shoppingcart. Webstore is not “standalone” you have to have Lightspeed — it makes sense for people who have real stores–and it is an additional cost to the POS.

The Webstore 2 series is much more advanced than the Webstore 1 although the new templates are harder to customize and therefore many people opted to use it as is rather than DIY or pay someone like me to do it. Luckily a few people have hired me to do it for them… In the course of all this work I found it necessary first of all to redo the Product Category navigation menu. It used to drop down a large category tree menu from one tab. Once you made your selection the menu snapped back up into the one tab leaving you to use the breadcrumbs to know where you were. I redid it to show all top level cats instead and click open to reveal child cats, accordion style. Building an accordion menu from a nested list of static links is super easy. The hard part was integrating it with the template php so that it would be dynamic.

Here are examples of 3 different menus, all using similar markup:

This is not a complete Deluxe template package download, it only contains the files needed to build an accordion menu. Plus the markup is ugly. But it works in Opera, Safari, Internet Explorer (6,7,8) and Firefox.

Download includes:

  • menu.tpl.php
  • index.tpl.php
  • Snippet from webstore.js
  • Snippet from webstore.css

Download here: [download id=”6″]

**edited Nov19th,2009**
I hope you noticed my menu adds in a “view all Category” link under the main category title/tab.
The reason I did this is – my menu disables the original Category tab/link so it becomes just a toggle open/close tab. This took even more usability away from an already usability-beleaguered menu! Older versions hoped that the Breadcrumb function would be enough but a client pointed out that users should be able to browse the top level categories as well as their subcategories. And the reason I used < h2 > tags instead of < li >for the main category tabs is…did you look at menu.tpl.php? That’s why! The subcats are in proper lists, don’t worry.