Create a <div> to hold your tour and add a unique id. Place the <div> wherever you want your tour to show on your web page.
<div id="PSTour"></div>
Style your <div> with some custom CSS. Below is a sample CSS snippet.
<style> #PSTour {
width: 100%; height: 562px; /* Adjust height as needed */ max-width: 900px; /* Adjust max-width as needed */ margin: 0 auto; } </style>
Add the following JavaScript snippet to your page. Make sure to replace TOUR-ID with your tour's ID. Where can I find my tour id?
<script src="//lcp360.cachefly.net/panoskin.min.js"></script>
<script>
PANOSKIN.createViewer({
id: 'PSTour',
tour: 'TOUR-ID', /* Replace TOUR-ID with your tour's ID */
});
</script>
Interested in some advanced embedding options?
Check out our Advanced Embedding Options Tutorial
Sample JSfiddle for how to embed a tour below:
Embed your Panoskin tour into Facebook so prospects can interact right from your business page.
Learn More →
Panoskin offers the flexibility to control specific options while embedding.
Learn More →
Learn how to identify and use your Panoskin Tour ID as you embed your tour in various places.
Learn More →