InDesign CC Epub - Create a Video Popup

[@joannleger]

I have been doing research on interactive books for about a month, and this video is by far the best step by step tutorial I have seen. Now all makes so much sense. Thank you so much Elias!

[@EliasSarantopoulos]

Joann Leger Thank you for your kindest feedback Joann, much obliged! 🙏 😀

[@bryanscholes5218]

What a wonderfully clear and concise explanation!! Now let's see if I can get it to work. Thanks

[@EliasSarantopoulos]

Bryan Scholes Thank you Brian, much appreciated! 🙏

[@nguyennuong1234]

Thank you so much for tutorial. I'm having so much trouble button pop-up setup, after watching your video. I solve all my problem.

[@EliasSarantopoulos]

The multi state objects are so amazing! Thank you! 👋😊

[@alejandrogutierrez2310]

Thank you so much this video was so helpful, great step by step!

[@EliasSarantopoulos]

You are quite welcome Alejandro, my pleasure! 😀 👋

[@mopopisa]

Thank you so much Elias! This was incredibly helpful, given that the tutorials on Indesign CC are very limited in detail for Interactive features.

[@EliasSarantopoulos]

Evan Adler Thank Evan for your feedback, more to come. 🙏

[@MrPaul181169]

Hi Elias, This was a great tutorial, just one question, I substituted the video for a KZbin video by inserting the HTML snippet. My issue is that if you close the pop-up window the video sound track continues to play, have I missed something or is there a way to prevent this?

[@EliasSarantopoulos]

Paul, I believe this will need more tweaks in order to get it done. My example is a local file and what you are asking, most likely, you will have to dissect the EPUB by expanding it as a ZIP file, that will open all the HTML documents because EPUB is just all HTML. Insert the video there as KZbin using an HTML editor and then zip the folder back again. It is a tedious process but if you have time and a bit of patience it can be done. This is my personal experience with EPUBs, hope this helps, thank you! 😀👋

[@sonniemonroe3801]

This is a great video! I do have a question as I'm a final year Illustration and Animation student. I'm making an epub book that will discuss pet bereavement but I want the illustrations to have animation elements. I'm making the animation in tv paint then exported them as mp4 files. What would you recommend if i want the video to be on the side page of the book and have no pop up button?

[@EliasSarantopoulos]

Hmm, good question. Well it all depends your layout. The benefit of a pop-up is immediately the user sees the whole width of the video otherwise he/she might miss it. I marry both techniques on my end Sonnie. 😀 👋

[@sonniemonroe3801]

@@EliasSarantopoulos thank you for your quick reply. I'm planning to do a typical children's book layout. When watching your video I wondered if it would be a case of importing a button that would be a still frame of the animation. So frame one to hen one it's clicked the animation would play. What do you think?

[@sonniemonroe3801]

@@EliasSarantopoulos p.s. do you know how to imput music and have it play through out?

[@EliasSarantopoulos]

@@sonniemonroe3801 When you import an mp4 file you have the ability to set a preview screenshot so that is the way you can do it but that's about it. Makes sense? 😀

[@sonniemonroe3801]

@@EliasSarantopoulos oo ok how do I set it as a preview? =)

[@cushioncap]

Thanks so much this has been greatly helpful, but one problem is that in my own publication only the left half my video plays in the interactive preview. I have fit the video across two facing pages and I tried actually exporting the spead as a landscape ePUB and then the right half of the video played instead. If you have time to explain where i have gone wrong, that would be really great - I'm pulling my hair out. Steve.

[@EliasSarantopoulos]

Stephen, when the user taps to launch the video in which spread it's supposed to pop? The behavior you see might be normal unless the user has access to both spreads at once. I am not sure I can answer your question, I am merely guessing what might cause that. 😀👋

[@kevinbrianthomas1]

I just used your knowledge in my interactive magazine. You are the shit.

[@EliasSarantopoulos]

Thank you Kevin, much appreciated! 😀 👋

[@jackshappy2148]

You just saved my career. Thank you endlessly.

[@EliasSarantopoulos]

Jack Shappy I am glad you liked it Jack, much, much appreciated! 🙏

[@awong6436]

Thank you so much, this was exactly the video I was looking for

[@EliasSarantopoulos]

A Wong Great to hear that, thank for your feedback! 🙏

[@georgiosdrak]

Really High-quality job! Well done and thanks for sharing your experience with us!

[@EliasSarantopoulos]

Georgios Drakontaeidis Να είσαι καλά, εγώ ευχαριστώ!!! 🙏 😀

[@lauraautreaux2598]

Hello thank you so much for this very well explained video. I wanted to know if it is possible to read a video in an interactive pdf?

[@EliasSarantopoulos]

No it can not, unfortunately.

[@ManoelFlesch]

Great to tutorial, but I see you also have an expansion button on the right that you didn't explain. How would you create a fullscreen mode for the video?

[@EliasSarantopoulos]

Manoel Flesch If you want to have the video window to take the whole screen then the pop-up size should be the same as the total width of your screen. It's a matter of what you are after. Once the window size is such, have a close button as I did so it goes to another State.

[@joshuakirby6952]

Great video! What about including a video in an ePUB that plays upon load of the page and also includes a fullscreen option on the controls?

[@EliasSarantopoulos]

Joshua, the fullscreen video option is not necessary because inside your EPUB you can just tap to expand it as long as the video is configured to be played in larger screen and not loose its quality. As for the second question, I honestly haven't tried that before since I wouldn't give that choice to the users. There is a way of course if you dissect the EPUB. You see EPUBs are just HTML files so you can open the page containing the video in an HTML editor and configure that, then zip it back again. This is what I would have done to address such an issue myself. Hope this helps, thank you! 😀

[@irenejusto4310]

Thank you so much! this was so helpful!

[@EliasSarantopoulos]

Great to hear that, thank you! 😀👋

[@heathermortimer1761]

Hi, thanks for this great tutorial! I have a labelled illustration, with a box below it that displays additional information when the label is clicked on. Is there anyway to make the information associated with one label automatically disappear when any other label is clicked? Thanks.

[@EliasSarantopoulos]

Heather Mortimer I am glad you enjoyed it! Is it possible you email me what's in your mind so I can picture it?

[@seorangsigit]

This is an amazing tutorial, even after 4 years. Is there any way to make the video autoplay? Thank you.

[@EliasSarantopoulos]

Yes there is, inside the Media panel choose, Play on Page Load. That should work 😀👋

[@seorangsigit]

@@EliasSarantopoulos I've tried that, that will make the video auto play from the beginning, what I want is the videoplay when the play button clicked and the video frame appear. Thanks

[@EliasSarantopoulos]

@@seorangsigit So you want the moment a user clicks on the pop up frame for the video to play?

[@ArmaniV03]

Thank you so much for the video, it’s incredibly detailed and helpful. I was wondering though if you wanted to export the file as an interactive PDF, is there any way to do that?

[@EliasSarantopoulos]

Arman Vaghela Unfortunately these functions will not work on Interactive PDF, only EPUB, very powerful! 😀

[@ArmaniV03]

Elias Sarantopoulos Ah got it, thank you so much! 😊 Any suggestion then for how to incorporate a video and make an interactive PDF? 😅

[@EliasSarantopoulos]

Arman Vaghela Try just to put an mp4 and see, EPUBs do wonders.

[@PLAY-SAX]

Hi Elias, Great video! Can I stop the video by clicking the close button, too? Th picture is gone, but you can hear the sound of the video. Any ideas?

[@EliasSarantopoulos]

Use on-click Stop sound, try that if you wish. Thank you for your feedback! 😀 👋

[@atthesecretcabin]

Amazing Job. Very helpful

[@EliasSarantopoulos]

Craig Bernhard Thank you so much for your feedback! 🙏 😀

[@mirstudio4742]

Thank you so much!

[@EliasSarantopoulos]

Glad you enjoyed it, thank you! 😀 👋

[@suzannesoto-davies3204]

Thank you @EliasSarantopoulos! This is exactly and FINALLY the info I needed!

[@EliasSarantopoulos]

Thank you Suzanne, much appreciated! 😀

[@mimigarritydenman2896]

Thank you Elias. Before watching this I created a button and for the action, I chose "play video" on click. But it did not work. Does the video always have to be a state?

[@EliasSarantopoulos]

Mimi Garrity Denman On Click to open the window. It works on my end. If you still have issues, connect with me if you wish. 😀

[@mimigarritydenman2896]

@@EliasSarantopoulos I realize I had not saved it! Thanks so much for the fast reply. I look forward to watching your other videos.

[@EliasSarantopoulos]

Mimi Garrity Denman Thank you for your kind comment! 😀

[@polinadeneva5128]

Hello! I'm having trouble with my Interactive PDF doc for IOS systems ... How can I add buttons and pop-up that are actually working on Ipad. .. (I tried with Hyperlink, it doesn't work ...) I'm using Acrobat Reader and Acrobat

[@EliasSarantopoulos]

You can't get such an interactivity on PDF Polina, if you export your work as an Epub then it all works. 👋😀

[@tawhidahmad]

Very informative , thanks a lot.

[@EliasSarantopoulos]

Tawhid Ahmad Thank you very much! 👍

[@luciarybarova]

I'd like to inquire about the proper steps to ensure that my interactive button successfully redirects the reader to a URL. After saving my PDF, the buttons were not visible at all.

[@EliasSarantopoulos]

PDF is not supposed only EPUB. 😀 👋

[@presentationguru842]

Great video - very well explained. But does this work if you export it to an interactive PDF rather than EPUB?

[@EliasSarantopoulos]

Presentation Guru Unfortunately not. Epub is very powerful and diverse. Thank you! 😀

[@presentationguru842]

@@EliasSarantopoulos Ok thanks - might need to explore Epubs further then

[@EliasSarantopoulos]

Presentation Guru Just look at the other lectures and you will get a lot of different information, hope that helps. Thank you! 🙏

[@rush2004]

Very nice :) more life to Fixed layout epub.

[@EliasSarantopoulos]

Amazing things you can do with Epub because it is all based on HTML 5. Thank you. 😀

[@rush2004]

@@EliasSarantopoulos Looking forward for more of ur videos on digital pub.

[@EliasSarantopoulos]

@@rush2004 I have released 4 altogether, all different subjects, have you had the chance to look over? 😀

[@rush2004]

@@EliasSarantopoulos Not sure if Ive seen it all but Ive seen some for sure. I will b checking it on ur website. Thanks again.

[@EliasSarantopoulos]

@@rush2004 it's all on KZbin and if you have any suggestions, please share. 😀

[@nokeprice4386]

Hello, I'm still not managing to get the video to play across the double page spread. It only ever plays half the video... is there something I've missed? Have I got the wrong version of Adobe InDesign or something? I've got the 2020 version. Any help would be much appreciated. Thanks.

[@EliasSarantopoulos]

I don't think so since it is a two spread layout. Try the mp4 on single spread and see the results. 😀

[@nokeprice4386]

@@EliasSarantopoulos Forgive me, how do you turn the double spread into a single spread?

[@EliasSarantopoulos]

@@nokeprice4386 Turn off the Facing Pages inside the document settings. Try that. 😀

[@ElielOliveira]

Will this video popup concept still work now that Adobe has discontinued support on Flash-powered features?

[@EliasSarantopoulos]

This only work for EPUB and Flash seems to be going away. I prssume you are exporting this as a PDF?

[@ElielOliveira]

@@EliasSarantopoulos Thank you for getting back to me. I wanted to use the "PUBLISH ONLINE" option. I wanted to share the link to the interactive book, instead of PDF Interactive.

[@EliasSarantopoulos]

@@ElielOliveira EPUB is extremely powerful because it is all based on HTML 5 and if one dissects it, all contents are just HTML pages that's why a plethora of functions are supported. Best place to review your work is with Apple Books. 😀

[@ElielOliveira]

@@EliasSarantopoulos Got it. Thank you so much for your support. Great channel! I am a musician and am working on some graphic design files for my content. kzbin.info (no need to subscribe... just telling you who I am 😉🙏🏻)

[@EliasSarantopoulos]

Eliel, your Instagram page shows a broken link, are you aware of that? The videos you have with the Blessings room background and lighting are the best for me, if I were to choose from. 😀

[@mariaguerrero8276]

Hi- Thank you for this video! What if I want to do this exact same thing but with multiple videos? I'm coming across the video popup appearing behind other buttons when playing, how do I avoid this?

[@EliasSarantopoulos]

Mary Guerrero You click on the MSO screen. So, create an MSO hosting multiple videos and have a next button to jump from screen to screen. 😀

[@mariaguerrero8276]

@@EliasSarantopoulos Thank you! Just to confirm- it not possible to have multiple buttons each with it's own popup frame on the page, is that correct?

[@EliasSarantopoulos]

Mary Guerrero It is called nested MSO and you can have tons, one tutorial that might help you is the one that I create the Quiz, that should give you an idea because I create multiple choices. Let me know if you wish, thank you! 😀

[@aazaad2479]

Very precise. Thank you. Can I export the same as an interactive pdf and have it working the same way?

[@EliasSarantopoulos]

No Thing It is NOT going to work, only as an EPUB. 😀

[@aazaad2479]

@@EliasSarantopoulos Aw.. thanks for that reply. Had one more question, if you don't mind. If I place a video and export it as interactive pdf, it gets inverted. IDK why, but do you know how to resolve it? Thanks again!!😊

[@EliasSarantopoulos]

No Thing Honesty I have never bumped into this issue. Is the video an mp4 format?

[@aazaad2479]

@@EliasSarantopoulos Ya, I understand that it's very weird. I even tried to invert the video and then export, but then it simply stays inverted. 🙄 Yes, it is MP4

[@EliasSarantopoulos]

@@aazaad2479 Weird but there is always an explanation. Is your video by any chance overlaid? Is the video covered by something that looks inverted? Just wondering. Thank you!

[@clydedigital]

A question- I want to make an ebook that I can sell directly from my website as a product. I want it to include video clips so that I can demonstrate things too. It’s a photography book so I want to show them how to setup cameras etc. What is the best way to do this?

[@EliasSarantopoulos]

That's a long topic to discuss I reckon. These days download file sizes are becoming less important as they used to be so I would probably lean to including the videos inside the eBook. That being said, compressing video sizes and maintaining good quality is also import and these days in my experience that can also be done easily. Not sure if I am answering your question but give it go. Look at the total file size and make a better judgment. I am selling a book online and it's about 150mb and people don't seem to mind since they are getting the proper education or what they paid for. 😀

[@clydedigital]

@@EliasSarantopoulos I appreciate you taking the time to answer that very much. Thanks. It's great to hear the opinions of others and I agree that downloading isn't the problem it used to be. But I think my video clips are likely to exceed 2GB and I worry that I will hit some sort of limit or other problem somewhere down the line.

[@EliasSarantopoulos]

Clyde Digital I totally understand your concern then. I will try to look into it and see what I can come up with. Thank you! 😊

[@nokeprice4386]

Could you help me, please. The video I am using does not play across the double page spread. It only plays one half of the video on the left hand side of the double page spread. How do I solve this problem?

[@EliasSarantopoulos]

Noke Price I believe this has to do with the layer stack. Look inside your layers or the MSO and make sure the video is on top of the stack order. Try that please, thank you! 😀

[@nokeprice4386]

@@EliasSarantopoulos As simple as that! Ok, I'll try it. Thank you very much.

[@sprewellau687]

thanks, but can i know how to stop the video when i click the "X" button at the same time?

[@sprewellau687]

it continues to play the video when i closed. the sound keep at the background

[@EliasSarantopoulos]

It is all about the Object State, when the user clicks on the close button then the Object State changes to the Video Button and the video stops playing automatically. Is that the case on your end? 😀

[@clydedigital]

I guess with this solution you are creating a huge file because it will include the video file in the document? Is there a way to stream youtube or vimeo file in the pop-up window instead so that anyone with a web connection could see the video?

[@EliasSarantopoulos]

EPUBs are basically HTML5 files, nothing really else so you can embed it inside the EPUB itself once you dissect it and package it again. It's not a straight forward approach but with some HTML knowledge, it can be done. Makes any sense? Thank you. 😀

[@clydedigital]

Yes, I understand. I have now watched a few other people use KZbin videos in ePub docs. When I publish to adobe it works okay, they seem tto handle it perfectly, but when I run it off my own pc in browser it isn’t so good. I’m surprised that the adobe indesign team do not make this easier and better because it would be a great way for someone like me to make tutorial books that include video which I could sell as a product.

[@EliasSarantopoulos]

Clyde Digital I will look into it myself, maybe an idea for a new tutorial release. Thank you for watching! 🙏

[@쑝쑝-y7l]

First, Thank you~~! I wonder why the object export option should be applied. Please reply.

[@EliasSarantopoulos]

배주미, so it looks crisp on your devices and not dithered. 😀

[@RussellBlackbird]

Amazing video, super useful. I subbed for this. :-)

[@EliasSarantopoulos]

Great to hear that, thank you for your feedback! 😀 👋

[@angieagostino7837]

Will this work if I export the InDesign doc as a interactive pdf? I'm having issues just placing a video and exporting it to an interactive pdf. There are no controllers in the pdf. Thanks!

[@EliasSarantopoulos]

I am afraid it will not, EPUB is what you are looking for, very powerful! Some functions are preserved on interactive PDF such as go to next or previous slide, rollover states, few, the heavy lifting is being done with when you export your work as an EPUB. 😀

[@iceconda1195]

I have a question. an icon of the play video is jpg. or png?

[@EliasSarantopoulos]

Ice Conda I prefer png myself for transparency reason. 😀

[@sreeharisajeevan7939]

Can we do images like this.. pop up images?

[@EliasSarantopoulos]

Absolutely, just use an MSO.

[@jonvillasenor9692]

Any Idea why text box behind MSO box would not display?

[@EliasSarantopoulos]

jon villasenor I can't see what you see but look at your layers and the order meaning inside the MSO there is also an order of things, I believe you will find the answer there. Hope that helps. 😀

[@evakrol4070]

What are the right export settings for an interactive PDF? The video popup isn't working when I try it...

[@EliasSarantopoulos]

eva krol It won't work, you need to export it as Epub, they are very powerful! 😀

[@evakrol4070]

@@EliasSarantopoulos Are there no other ways to let it work in a pdf?

[@EliasSarantopoulos]

eva krol Not if you want advanced interactivity like the pop up. Epub are just so powerful because they are HTML 5.

[@evakrol4070]

@@EliasSarantopoulos Allright thankyou very much! Do you know a good Epub reader for windows?

[@EliasSarantopoulos]

eva krol Still looking for one...Use Adobe InDesign to give you the whole interactivity. I test a lot of things on my iPhone or iPad since Apple is the only company that supports such interactivity.

[@leomac1829]

when i export indesign with videos to epub the epub page size gets all out of proportional, whats the best page size in pixels in indesign to fit perfectly in epub

[@EliasSarantopoulos]

Well it all depends your document size and the file size Leo. I would recommend 1280 x 720 is a good size depending of course the length of the video. Hope this helps. 😀 👋

[@leomac1829]

hello man it worked fine thank you

[@EliasSarantopoulos]

@@leomac1829 Excellent Leo, thank you for the heads-up! 😀 👋

[@regjinavelaj4016]

Can I export it in another way? If I export it as an ibook (epub) I can't share it, so is there another way to save it? Maybe HTML or as an interactive PDF?

[@EliasSarantopoulos]

Not really if you want all the interactivity to come with it. Every cell phone and tablet uses ePUB readers especially Apple ecosystem. For Android, Calibre, Kobo, Nook among some. 😃

[@reyformerzofficial5917]

I can't access the excercise files link, can I have the newest link?

[@EliasSarantopoulos]

Reyformerz, it works on end just fine, I just checked. Are you clicking on the link provided below the video description? 😀👋

[@abrilvergara177]

is the same process for a pdf? how can i export it?

[@EliasSarantopoulos]

No it is not the same for PDF, this feature is only supported as an EPUB.

[@rivikavakharia1069]

My video doesn't play on a spread! it plays half and half ! PLEASE HELP!! URGENT!!!

[@EliasSarantopoulos]

Rivika Vakharia Probably you need to move up the layer inside the Multi State Object.

[@rivikavakharia1069]

It;sIt's still playing half and half on the spread! When I put it on a page it's playing as one! But as soon as I make It bigger and put it on the spread! Only half the video of the left side plays!

[@rivikavakharia1069]

Please help me out! Have my final thesis tomorrow😭😭😭

[@EliasSarantopoulos]

Rivika Vakharia If you wish send me a private email and I can look into your project. You can find my credentials at the end of each video. Let me know if you wish. 😀

[@reyformerzofficial5917]

What application on android to read this epub fixed layout? I can't play that video on google playbook

[@EliasSarantopoulos]

Find a good Epub reader, not sure what's on the Google Play store but Epub has become a standard. Thank you! 😀

Hii teacher :) , wonderful

[@EliasSarantopoulos]

Thank you Bahadır, much appreciated! 😀🙏

[@reyformerzofficial5917]

Can you play that video on android with e-readers?

[@EliasSarantopoulos]

It depends what your Epub reader supports on your device, in this case Apple's Books supports all gestures and interactivity. My recommendation is to create a some interaction in your eBook and test it out. Thank you. 😃

[@PLAY-SAX]

It's s only by using URL embedding

[@EliasSarantopoulos]

You mean playback?

[@PLAY-SAX]

@@EliasSarantopoulos I embedded the URL of the video and it's all fine. If I press the play button of the video, the video starts, but if I change the status, the video disappears but the sound of the video is still on. With a placed video, the video stops with the sound.

[@EliasSarantopoulos]

@@PLAY-SAX The only way I personally use all these features of InDesign is playing it's contents on a Epub. 😀

[@PLAY-SAX]

@@EliasSarantopoulos Yes I do it for Epub. That's the reason, why I have to embed the videos via URL.The Ebook size would be too big with all the videos.

[@lorenastoccosilva845]

qué programa me puede leer un epub?

[@EliasSarantopoulos]

When you are inside InDesign CC use the EPUB Previewer and for reader you can use the Adobe Digital Editions, its a free download. If you are on the Mac you can just open it in Apple Books. Thank you! 👍

[@blackkugu5396]

hi TRABZON /TURKEY :))))))

[@EliasSarantopoulos]

Greetings from Istanbul! 😀👋

[@blackkugu5396]

@@EliasSarantopoulos 🙋‍♂️ There are many beautiful places in Turkey.

[@EliasSarantopoulos]

@@blackkugu5396 Definitely, priceless! 😀 👋

[@blackkugu5396]

@@EliasSarantopoulos 😉👍

[@ruyreis]

Thank you so much!

[@EliasSarantopoulos]

You are most welcome! 😀 👋