Community AI

NOTE: This is a hack to Embed PDF

The idea here is to learn how to embed a flippable PDF uploaded to issuu with a fully responsive layout without ads which opens full screen.

Example of Magazine (PDF) Embedded without Ads

Entire Result as Demo

See the Pen iFrame CMS Responsive hack for Issuu by JFarrow (@JFarrow) on CodePen.

Use ImportDoc

Read the blog post here

Follow Ning Powered Events

Are you curious about the ways you might be able to use AI for community management tasks?

Let's explore this topic together

Follow this Group to Unlock More Tools Inside...

56 AI Powered

Join Us!

Example of Sidebar Magazine

Code Needed to Embed Magazines

HTML
CSS
You'll Need...

Add the following to your HTML Module in Sites and Pages:

Add the Following to your Design Studio:

.embed-box {
position: relative;
padding-bottom: 75%; // This is the aspect ratio
height: 0;
overflow: hidden;
}
.embed-box iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}

an account on issuu.com and a pdf uploaded to your account. You'll go to your list of published documents and click embed under any of them..

to replace the XXXXXXXX in the code go to the embed page for your document uploaded to issuu.com

Did you find this useful?

You need to be a member of Ning Creators Social Network to add comments!

Join Ning Creators Social Network

Comments are closed.

Comments

Carrie Carolin July 13, 2018 at 5:30pm

This is going to be a lifesaver, thank you!
- NC for Hire
  
  ⚡JFarrow⌁ > Carrie Carolin July 14, 2018 at 11:05am
  
  my pleasure

This reply was deleted.

Get Help With Ning

Contact JFarrow to help professionally set up your Ning Community