If you’re someone who does this kind of thing (customizing LightSpeed Web Stores) and you also like to use WordPress to run the “main site” – main site being everything else in the Web site that is not the actual Web Store – you’ve probably often been disappointed at the rule that you can’t install WordPress on a LightSpeed hosted server.
LightSpeed offers great hosting & support packages, but just for their native eCommerce solution, Web Store. The hosting plan they offer will not provide email@yourdomain.com and will not host a Content Management System like WordPress which requires a MySQL database (and runs tons of queries and could get hacked if it is aged-out:very old and out of date and/or uses a theme that is very old and out of date. Age-ing out can happen since not all WordPress users know the dangers of letting their install or themes get all old and sit there begging to be hacked).
Again, LightSpeed offers hosting for Web Store and that is all they host. I do not blame them or think they are being too strict or whatever. They have to protect their servers.
Which means if you want a Web site (not “just” a Web Store) and have email@yourdomain.com and all of that, they assume you will buy an additional hosting plan with another Web hosting company.
The thing is, although most business already have a site with a server that can probably run Web Store, they’re sold the hosting package for Web Store when they purchase the license for it. And then a good amount of my clients come to me with their Web Store hosted by LightSpeed and their Web Site hosted by whatever hosting company. I either end up letting them know that their Web Store will have to be kind of not as awesome or I tell them that in order to get WordPress stuff in a Web Store they have to be on the same server – then let them decide if they want to make a change in hosting.
My latest project was set up exactly as described above. I’d gotten so many project requests that I mixed up how their hosting was set up. So I’d quoted them the cost of a WordPress/Web Store integration. I would not have minded reducing the quote to just a LightSpeed Web Store customization but I felt bad that I had promised them all this other good stuff. Forget money, I wanted to see if I could actually do it. I got into this business because I enjoy challenges and problem solving and what is Web site development if not a series of challenges requiring problem solving?
So, The Problem:
How to get WordPress stuff (pages, posts, custom post types, sidebars and menus) to show up in a Web Store?
I tried my usual Simple HTML Dom but it didn’t fly. SHD is what I usually use to get Web Store stuff in WordPress. But the other way around was always a bit of a mess. So I gave up on Simple HTMl Dom. I’ll still use it when I can, though.
What about JSON? Can’t you use JSON to get content from somewhere and spit it into a div? Sure you can but what about Same Origin Policy? Oh, right. Has to be JSONP, then. To test JSONP, I used a service offered by Any Origin and it worked, sort of. I mean it worked swell: it spit the content into a div and blah blah. The issue was really the content it was getting also included the WordPress Header & Footer and everything else in the theme file the page,post or whatever was using. I’d like to avoid getting into a whole WordPress theme tutorial here but basically the way around this was to make a page and then make it use a theme file that only had the content I wanted to show, no sidebars, headers or footers.
So by now you’re probably guessing that I don’t know JSON from a hole in the ground. If I did wouldn’t I be able to target the div I wanted to show the content from? Yeah, but I didn’t know how to do that. 20 minutes into my 1st test case using JSON I was just happy to get something working. I figured I’d have time later to make things more suited for a production environment.
Sooo, the thing I did know how to do was to make a theme file that only had the template tag for the thing I wanted to get. For example, a custom menu. I made a Custom Page file and put the template tag for the specific menu I wanted and saved it as json.php. Then I made the Page and made it use the Custom Page. When I viewed the page all I saw was the plain list of menu items. Great! Wouldn’t work stand alone but would work as a way to only show the menu:
[php]<?php
/**
* Template Name: getwpmenupleeez
*
* A custom page template to get a custom menu.
*
* The "Template Name:" bit above allows this to be selectable
* from a dropdown menu on the edit page screen.
*
* @package WordPress
*
*/
wp_nav_menu( array(‘menu’ => ‘my-pages’ ));
?>[/php]
My-pages being the custom menu I created by going to Dashboard > Appearances > Menus and making a menu named My Pages. In Dashboard > Pages, I created a Page called Just the Menu which had a slug just-the-menu. When I viewed http://myawesomeproject.com/just-the-menu/ all I saw was just the menu. myawesomeproject.com is not a real address.
So in Web Store land I went to templates/my-template/index.tpl.php and located the area of the document into which I wanted to embed Just the Menu.
Like this:
[php]
<script type="text/javascript">
$.getJSON(‘http://anyorigin.com/get?url=myawesomeproject.com/just-the-menu/&callback=?’, function(data){
$(‘.the-menu’).html(data.contents);
});
</script>
<div class="the-menu"></div>[/php]
myawesomeproject.com is not a real address.
The beauty of this is that I’d already styled the menu in my WordPress theme style.css. I didn’t have to make new style for .the-menu because it inherited the style from the theme. If there’s anything I hate it’s doing the same work 2 times.
Anyway such triumphs may seem small but add them up and they’re very big. Nothing makes me happier than to be able to get around a problem.
Have fun!