Exit
  • Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
  • 한국 커뮤니티
0

How to insert HTML5 created by Captivate 2019 into InDesign 2019?

New Here ,
Jun 08, 2019 Jun 08, 2019

Thank you for looking into this.

May I know how do I insert HTML5 created by Captivate 2019 into InDesign 2019?

I've followed the tutorial by Creating an Interactive eBook: Step 4 - YouTube but it does work for me.

Following are the steps I've taken:

1) I created a very simple one page HTML5 project in Captivate 2019 which I will use it as an example to insert into InDesign 2019.

Screen Shot 2019-06-09 at 11.44.49 AM.png

2) Following is the proof that the HTML5 project generated from Captivate 2019 actually works.

Screen Shot 2019-06-09 at 11.45.28 AM.png

3) Inside InDesign 2019, I created a place holder using the "Rectangle Frame Tool" which later I will place the HTML5 project generated by Captivate 2019 into it

Screen Shot 2019-06-09 at 11.45.58 AM.png

4) Inside InDesign 2019, I went to "Overlays" then "Web Content"

Screen Shot 2019-06-09 at 11.46.10 AM.png

5) Then I click the folder icon to search for my HTML5 project file generated from Captivate 2019. I inserted the "index.html" file

Screen Shot 2019-06-09 at 11.46.26 AM.png

6) I also checked the "Auto Play" and "Allow User Interaction" buttons. I understand that after I've inserted the HTML5 file, nothing will be shown in the place holder until I preview it

Screen Shot 2019-06-09 at 11.46.40 AM.png

7) However, after I preview it using the "Preview Spread: EPUB" play button nothing is shown in the preview

Screen Shot 2019-06-09 at 11.46.54 AM.png

8) Following is the blank preview page I see when I click the "Preview Spread: EPUB" play button

Screen Shot 2019-06-09 at 11.47.07 AM.png

9) I even tried to export the InDesign project as HTML5 to test whether the HTML5 project created using Captivate 2019 I've inserted into InDesign works or not. But once again I only managed to see the following blank page.

Screen Shot 2019-06-09 at 11.48.02 AM.png

10 I even tried to export the InDesign project as EPUB (Fixed Layout) to test whether the HTML5 project created using Captivate 2019 I've inserted into InDesign works or not. But once again I only managed to see the following blank page

Screen Shot 2019-06-09 at 12.07.31 PM.png

Thank you for looking into this and answer my question.

1.8K
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jun 08, 2019 Jun 08, 2019

This forum is for users of InDesign.

There are several ebook formats that can be produced from InDesign. They include Interactive PDF and HTML publications, such as, Reflowable ePub, FXL ePub, InDesign’s Publish Online and publications produced via in5.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jun 09, 2019 Jun 09, 2019

Hi limw36064140 ,

overlays do not work with EPUB export or Publish Online.

Once they were meant for Adobe Digital Publishing Suite ( DPS ) that will end by August 31, 2019:

Digital Publishing Suite Classic End-of-Life FAQ

Later for Adobe Experience Manager which is very, very costly.

FWIW: Some 3rd-party plugins or extensions are using the Overlays functionality for their own purposes.

Regards,
Uwe

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jun 09, 2019 Jun 09, 2019

What you can try is to use the Insert HTML command:

Object > Insert HTML…

HTML-Import-Command.PNG

Regards,
Uwe

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jun 09, 2019 Jun 09, 2019

If the Insert HTML command does not work you can try the In5 plugin from Ajar Productions.

Also, if you don't require any Captivate interactivity, you can always export as an MP4.

David Creamer: Community Expert (ACI and ACE 1995-2023)
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Jun 10, 2019 Jun 10, 2019

Hi Laubender, thanks for the reply.

Is it possible to re-attach the "HTML-Import-Command.PNG" again as the file cannot be opened.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jun 10, 2019 Jun 10, 2019

Hi limw36064140 ,

do you mean if I could post the screenshot again?

Here it is:

HTML-Import-Command.PNG

Regards,
Uwe

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Guru ,
Jun 09, 2019 Jun 09, 2019

You can’t do embedding. Take the captivate files, host them somewhere. Now take that hyperlink from where they are hosted and copy it to the web overlay. Now it will work.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Jul 13, 2019 Jul 13, 2019

Thank Jonathan for the suggestion.

I'm considering hosting the Captivate HTML5 files somewhere and then insert the html hyperlink code like the one found in YouTube.

However, do you have any suggestion where should I host the Captivate HTML5 on? E.g. is there a popular website for hosting this kind of HTML5 files?

Thank you very much

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Guru ,
Jul 15, 2019 Jul 15, 2019
LATEST

i have my own web server space.

are you on a budget?

you can get some web server space that is within you budget and use cyberduck or filezilla to upload files. get the link and copy it to indesign

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jul 14, 2019 Jul 14, 2019

The first question you have to ask yourself (and which I'm asking you now) is: how are you going to distribute/publish the result ?

There are many formats for various methods, and they all have their specific restrictions, requirements, and problems, lots of problems !

E.g. an ePub can't embed any online content – it only allows to refer a link to it; the Folio format is near extinction and just unusable; the PDF Interactive file format understands nothing about embedding HTML; Publish Online might work if the HTML isn't too complex (I bet yours is...)

The best chance you'll be getting is by digging into IN5's solution.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jul 14, 2019 Jul 14, 2019

As mentioned in this thread a month ago.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jul 14, 2019 Jul 14, 2019

Some people just need to hear it more than once.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jul 14, 2019 Jul 14, 2019

I know, so I did mention that useful bit about IN5 again.

But I also gathered thoughts about the issue in general,

apart from more or less loose advices and comments.

And I do think this question about distribution is crucial.

Hope this helps.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines