Question

I’m in a dilemma here. I need to setup a magento and a WordPress page to function like this example:

Layer 1: Is the main nav, thats fine.
Layer 2: Is the default products listings page in Magento showing all the products in a grid…
Now comes the hard part,

Layer 3: Once a product is clicked Layer 3 slides in from the right revealing the product detials page

This is pretty much going to be the same setup for wordpress pages aswell

Im thinking about using iframes, but will there be an issue with SEO, because I need the URL to change to the details page on click :X

I just need someone to point me in the right direction.

Answer 1

You can do by jQuery load() function but you should get product url’s into layer2 like :

lets say LAYER3 div id #product-content

$("#product-content").load("http://example.com/catalog/product/view/id/23");

other ways, you should make an extension like in here :
Magento Quick View Ajax

+++++ EDIT +++++
you want to get target URL path, so :

$product = Mage::getModel('catalog/product')->load($productId);
$rewritePath = Mage::getModel('catalog/url_rewrite')->loadByRequestPath($product->getUrlPath());
$targetPath = $rewritePath->getTargetPath();

thereby, always the product URL going to same.