Embedding a Flipbook
I have several moving-piece items on the site (calendar, carousel...), but when it comes to embedding a flip book application to the page, it al falls flat. Please help me fix this!
Discussions are closed to public comments.
If you need help with Cascade CMS please
start a new discussion.
Keyboard shortcuts
Generic
| ? | Show this help |
|---|---|
| ESC | Blurs the current field |
Comment Form
| r | Focus the comment reply box |
|---|---|
| ^ + ↩ | Submit the comment |
You can use Command ⌘ instead of Control ^ on Mac
1 Posted by Ryan Griffith on 16 Feb, 2016 02:21 PM
Hi Alex,
To confirm, are you attempting to insert embed code somewhere within your page structure, or are you trying to build out the embed code dynamically using a Format?
Can you elaborate a bit more on "it falls flat"? If you view the source code of the page render frame, do you see your embed code? If you do, check for issues such as JavaScript errors or an insecure content error (ie loading
http://content while Cascade is running onhttps://).Please let me know if you have any questions.
Thanks!
2 Posted by Alex Padilla on 16 Feb, 2016 04:31 PM
I can often see the yellow placeholder that represents the object and the code in the editor. But the preview after pushing "submit" disappears. The code is straight form a Flipbook service, so I'm not sure how there would be Javascript errors. Maybe you could see the code and decide.
3 Posted by Ryan Griffith on 16 Feb, 2016 06:47 PM
Hi Alex,
I'd be happy to test this out locally. When you have a moment, please attach or paste the embed code you are entering and describe how/where you are entering it.
For example, is this being added to a WYSIWYG field or an XML Block. If a WYSIWYG field, are you simply pasting the code into the HTML source editor or using the Insert Media feature?
Thanks!
4 Posted by Alex Padilla on 16 Feb, 2016 07:14 PM
Here is an example of the types of flip books that I've tried. As for how I have attempted to embed them, I've tried Insert Media, Ive tried doing it directly into the HTML editor, and I've tried to make a content block out of it. None have worked.
<iframe src="http://files.flipsnack.com/iframe/embed.html?hash=fdn3b5aiz&wmode=window&bgcolor=EEEEEE&t=1455309301" width="100%" height="100%" seamless="seamless" scrolling="no" frameborder="0" allowtransparency="true"></iframe>
________________________________
From: Ryan Griffith <[email blocked]>
Sent: Tuesday, February 16, 2016 11:47 AM
To: Alex Padilla
Subject: Re: Embedding a Flipbook [How Do I... #21371]
// Please reply above this line
==================================================
From: Ryan Griffith (Support staff)
Hi Alex,
I'd be happy to test this out locally. When you have a moment, please attach or paste the embed code you are entering and describe how/where you are entering it.
For example, is this being added to a WYSIWYG field or an XML Block. If a WYSIWYG field, are you simply pasting the code into the HTML source editor or using the Insert Media feature?
Thanks!
On Tue, Feb 16 at 08:31 AM PST, Alex Padilla wrote:
I can often see the yellow placeholder that represents the object and the code in the editor. But the preview after pushing "submit" disappears. The code is straight form a Flipbook service, so I'm not sure how there would be Javascript errors. Maybe you could see the code and decide.
5 Posted by Wing Ming Chan on 16 Feb, 2016 08:32 PM
Hi Alex,
You can wrap the iframe code up using a div and put the code directly in a WYSIWYG. But I want to point out one thing: the iframe requires flash to run. This is running against the trend of the technology since your page won't work on many gadgets.
Wing
6 Posted by Ryan Griffith on 16 Feb, 2016 08:53 PM
Hi Alex,
I was able to successfully insert the embed code in my local Cascade 7.12.5 instance and preview it after submitting the page.
One thing I noticed is the Flipbook URL begins with
http://. Is your Cascade instance behind SSL by chance (iehttps://)? If it is, check your browser to see if it is blocking the insecure content from loading. If you are using Chrome, this is generally a red icon to the right of the URL.To avoid this issue, it looks like you can go scheme-relative, which is to replace the protocol with
//. So your embed code would look like the following:Please let me know if you have any questions.
Thanks!
7 Posted by Alex Padilla on 16 Feb, 2016 08:58 PM
That is a little bit closer, but the object still appears with this image,
________________________________
8 Posted by Ryan Griffith on 17 Feb, 2016 03:01 PM
Hi Alex,
Couple of questions to see if we can narrow things down a bit:
<iframe>code look correct?//files.flipsnack.com/iframe/embed.html?hash=fdn3b5aiz&wmode=window&bgcolor=EEEEEE&t=1455309301? It would most likely be a 404 error.Please let me know if you have any questions.
Thanks!
Support Staff 9 Posted by Tim on 09 Mar, 2016 04:17 PM
Hi Alex,
Just wanted to make sure you saw Ryan's comment above. Let us know how things are going.
Thanks!
Tim closed this discussion on 23 Mar, 2016 05:12 PM.