How to Embed Flipboard Magazine on your Blog or Website

You may have noticed Flipboard magazine widget in our blog which we recently added it so that we can share our article on it using the flip button. This is quite good to gain visitors from Flipboard to our blog and read our post.


The Flipboard magazine is available to everyone and can be easily added to your blog or sites using the IFRAME tags, Thinks to know before adding magazine to your blog

1. Flipboard has just come up with its desktop widget and is still no optimized for mobile devices yet.

2. The Flipboard widget is too big enough to add so you can use Pages or can add it before the footer of your blog or site.

Lets add it:- Step by Step to your blog:-

1. Add the <div> tag in your template or gadget where you want the Flipboard magazine to appear.

<div id="flipboard"></div>

2. Lets add the Javascript in your template for this you need to go to your blog template and before the </body> you need to place this code.

<script>
(function () {
var width = 0,
flipboardtnb= document.getElementById('flipboardtnb');
width = flipboard.getBoundingClientRect().width ? flipboard.getBoundingClientRect().width : flipboard.offsetWidth;
if (width > 300) {
flipboard.innerHTML ='<iframe width="100%" frameborder="0" height="250px" marginheight="0" marginwidth="0" scrolling="no" src="https://flipboard.com/section/the-next-blogs--__YXV0aC9mbGlwYm9hcmQvY3VyYXRvciUyRm1hZ2F6aW5lJTJGemdoV1V4WklTSkMyTEhJVkY3V2hNQSUzQW0lM0ExNTg5NTg0MjY"></iframe>'
}
})();
</script>

Note:- You need to replace the in blue with your own, we have even changed the width and height of the magazine.