Embed product box in another website.

I would like to embed a "product box" like on the categories page in another website/bog with the price and add to cart button that redirects to the nop site.. Is there an easy way to do this?

Have you tried using an iframe?

iframes are not an option.

see: http://braveclients.com/code/iframes-why-are-iframes-bad/

The only other option I can think of is that you would need some of the development that went into

https://www.nopcommerce.com/p/715/facebook-shop.aspx

Thanks for you help JonNopper, but paying for a 3rd party solution specifically for facebook isn't what i'm after.

What i'm looking for is similar in function to how olark embeds a chat dialog in a website.

Except that where I put the <div>'s is where I want the product box to show up.

<!-- begin olark code -->
<script data-cfasync="false" type='text/javascript'>/*<![CDATA[*/window.olark||(function(c){var f=window,d=document,l=f.location.protocol=="https:"?"https:":"http:",z=c.name,r="load";var nt=function(){
f[z]=function(){
(a.s=a.s||[]).push(arguments)};var a=f[z]._={
},q=c.methods.length;while(q--){(function(n){f[z][n]=function(){
f[z]("call",n,arguments)}})(c.methods[q])}a.l=c.loader;a.i=nt;a.p={
0:+new Date};a.P=function(u){
a.p[u]=new Date-a.p[0]};function s(){
a.P(r);f[z](r)}f.addEventListener?f.addEventListener(r,s,false):f.attachEvent("on"+r,s);var ld=function(){function p(hd){
hd="head";return["<",hd,"></",hd,"><",i,' onl' + 'oad="var d=',g,";d.getElementsByTagName('head')[0].",j,"(d.",h,"('script')).",k,"='",l,"//",a.l,"'",'"',"></",i,">"].join("")}var i="body",m=d[i];if(!m){
return setTimeout(ld,100)}a.P(1);var j="appendChild",h="createElement",k="src",n=d[h]("div"),v=n[j](d[h](z)),b=d[h]("iframe"),g="document",e="domain",o;n.style.display="none";m.insertBefore(n,m.firstChild).id=z;b.frameBorder="0";b.id=z+"-loader";if(/MSIE[ ]+6/.test(navigator.userAgent)){
b.src="javascript:false"}b.allowTransparency="true";v[j](b);try{
b.contentWindow[g].open()}catch(w){
c[e]=d[e];o="javascript:var d="+g+".open();d.domain='"+d.domain+"';";b[k]=o+"void(0);"}try{
var t=b.contentWindow[g];t.write(p());t.close()}catch(x){
b[k]=o+'d.write("'+p().replace(/"/g,String.fromCharCode(92)+'"')+'");d.close();'}a.P(2)};ld()};nt()})({
loader: "static.olark.com/jsclient/loader0.js",name:"olark",methods:["configure","extend","declare","identify"]});
/* custom configuration goes here (www.olark.com/documentation) */
olark.identify('XXXX-XXX-XX-XXXX');/*]]>*/</script><noscript><a href="https://www.olark.com/site/XXXX-XXX-XX-XXXX/contact" title="Contact us" target="_blank">Questions? Feedback?</a> powered by <a href="http://www.olark.com?welcome" title="Olark live chat software">Olark live chat software</a></noscript>
<!-- end olark code -->

You will need to connect to the nop database from the site you wish to embed the data in and pull out the required product/ productvariant information.

You could do that using a webservice that you would have to add to nop.

Then format the data and display.

Which brings us to why iFrames are good - you don't have to do the above ;)