Publitas offers an embed code to display online publications as part of a landing page. This is a great way to make the publication part of the website's experience and generate more traffic to your site directly. Alternatively you can also use HTML to embed your online publication, using a iframe.
Both solutions work just fine but there are some important differences to look out for when selecting a method to embed your online publications.
- Clean and integrated look
- Optimizes dimensions automatically to reduce white space
- When 800x500 or smaller, or loaded on mobile, clicking the pages will load the publication in a lightbox
An Open button will be added below the pages that allows the visitor to load the content in a bigger lightbox creating more space for the pages to load and show more details, including the original menu and background settings.
On mobile, the embed will display an Open button that will open the publication in the lightbox to start interacting with the content without leaving the website and without impacting the website's navigation*. The same interaction is applied on desktop when the embed code is 800x500 or smaller (see Banner mode).
- HTML based
- Embeds the original reader, including all elements
- Dimensions can be optimized manually to reduce white space and become responsive
- When 800x500 or smaller, or loaded on mobile, clicking the pages will load the publication in a new window
An iframe created a window within a website where you can load any external address. When using a publication URL in the iframe it will basically show the publication the same way it would be seen when loaded directly into a browser window. As such, you'll find the menu and the usual navigation components in the iframe, but also the logo and background settings will be applied.
On mobile, the iframe will display an Open button that will open the publication in a new window*. The same interaction is applied on desktop when the iframe code is 800x500 or smaller.
When you select the iframe for your embedding needs we recommend to set a height that is least 510 pixels high, apply the title parameter for SEO and consider adding the allowfullscreen parameter which will enable the full-screen option in the menu of the publication.
width="100%" height="670px" title="Spring 2019 Catalog" allowfullscreen>
*Visitors can interact with the publication by dragging the pages sideways, pinching and double tapping to zoom in. These gestures are also used by the website for scrolling and zooming which is why publications load full screen on mobile to avoid conflicting gestures on the website's and publication's areas.