Expand my Community achievements bar.

[Sample] Embedding a pdf or a Video in an Adaptive form

Avatar

Employee Advisor

Let's Begin:

Embedding a PDF

  • Create a Sample Adaptive form

1594883_pastedImage_0.png

  • Drag a static Text component in the form.

1594884_pastedImage_1.png

  • Click on the pencil icon to edit the Text

1594885_pastedImage_2.png

  • You get a palette with an option called 'Fullscreen' to maximize the editor (as shown below).

1594886_pastedImage_3.png

  • This maximized editor provides with a number of option to edit and format the text. Select the 'Source edit' option from the ribbon as shown below:

1594887_pastedImage_4.png

  • Replace the code with an iframe container to include a file, where the source can be a pdf in DAM Assets or even a link. Once done click the same Source Edit option to preview the file. You can do similarly for gif files.

1594888_pastedImage_5.png

  • Once done, close the editor using the 'Minimize 'option available on the top right side of the screen.

1594889_pastedImage_6.png

  • Now, Preview the form.
  • The container will require a plugin to render a pdf, like in my case it's Adobe Reader. You may also get the option to download, print and zoom the pdf based on the plugin.

     Sample Form preview

1594890_pastedImage_7.png

Embedding a Video

All the steps would remain the same except you need to use the below code in the source edit of the text Editor

<p>Sample video<br>

<iframe id="video" width="420" height="315" src="//www.youtube.com/embed/9B7te184ZpQ?rel=0" frameborder="0"></iframe></p>

Preview would look something like this"

1594897_pastedImage_62.png

1 Reply

Avatar

Level 1

Is this functionality no longer supported after AEM 6.5? The iframe works when I select "minimize" and even appears as expected on the adaptive form, but when I click the checkmark to save changes on the static text component, the iframe is there but empty.