This blog is all about embedding 42&Park widgets in web sites, giving a number of different examples. Below is a store Christine built for HY's Steakhouse & Cocktail Bar. This is an example of embedding the store inside a typical web site. Here is the line of HTML that you can paste into your blog or website right now to get the same thing:
<iframe frameborder="0" width="100%" height="330px" scrolling="no" seamless="seamless" src="http://publishers.42andpark.com/product-info.jsp?partnerId=53443"></iframe>
Let's walk through the various parts of this HTML code:
- <iframe frameborder="0" - This tells your browser to embed an iFrame
- width="100%" - We want the iFrame to take up 100% of the width it's embedded in
- height="330px" - This is your actual width / 9 x 16. In this case, our actual width is 653 pixels across. This gives you a perfect 9x16 aspect ratio optimized for video and wide brand imagery.
- scrolling="no" seamless="seamless"
- src="http://publishers.42andpark.com/product-info.jsp?partnerId=53443& - Specifying the partnerId like this tells the system to choose the initial mode (product, slide, video) and which slide to show first.
To get the partnerId of a capsule, you can open it in full screen mode and look at the partnerId parameter in the URL of your browser. You can also see this in the Embed code screen.