Panduan Pengguna Batal

Add web objects to an Adobe Captivate project

Cari
Captivate

Captivate

Buka aplikasi
  1. Captivate User Guide
  2. Get to know Captivate
    1. What's new in Adobe Captivate
    2. Adobe Captivate System Requirements
    3. Download Adobe Captivate
    4. Frequently Asked Questions
  3. Adobe Captivate releases
    1. Adobe Captivate 13
      1. Adobe Captivate (13.0) release notes
    2. Adobe Captivate 12
      1. Adobe Captivate 12 summary
      2. Adobe Captivate (12.6 update) release notes
      3. Adobe Captivate (12.5 update) release notes
      4. Adobe Captivate (12.4 update) release notes
      5. Adobe Captivate (12.3 update) release notes
      6. Adobe Captivate (12.2 update) release notes
      7. Adobe Captivate (12.1 update) release notes
  4. Project setup
    1. Slide navigator
    2. Project dimensions
    3. Set preferences
      1. General preferences
      2. Generative AI preferences
      3. Project preferences
      4. Quizzing preferences
    4. Themes
    5.  Configure URL access for Adobe Captivate features
  5. Import from PowerPoint
    1. Import PowerPoint presentations into Captivate
    2. Work with text on imported slides
    3. Work with shapes on imported slides
    4. Add media to imported slides
    5. Add interactions and animations to imported slides
  6. Generative AI in Captivate
    1. Generative AI overview
    2. Generate text 
      1. Generate text overview
      2. Write effective prompts for text generation
      3. Generate text using quick prompts
      4. Generate text using custom prompts
      5. Provide feedback to improve text generation
    3. Generate images
      1. Generate image overview
      2. Generate images using prompts
      3. Choose image content type - Photo or Art
      4. Use reference images for Composition and Style
      5. Best practices for effective image generation
      6. Provide feedback to improve image generation
    4. Generate avatar
      1. Generate avatar overview
      2. Customize the avatar
      3. Create transcripts for avatar narration
      4. Generate avatar narration
      5. Provide feedback to improve avatar generation
    5. Generate transcripts
      1. Generate transcripts overview
      2. Generate transcripts for closed captions
      3. Best practices to use transcripts effectively
  7. Add and edit text
    1. Add text to a project
    2. Add Adobe fonts to a project
    3. Add quotes
  8. Add and edit images
    1. Add images to a project
    2. Edit the background image on a slide
    3. Add SVGs to a project
  9. Add and edit media
    1. Add videos to a project
    2. Add and edit audio
    3. Add audio for widget interactions
    4. Add closed captions
    5. Add web objects to a project
  10. Interactive components
    1. Add a button
    2. Add an input field
    3. Add a radio button group
    4. Add a dropdown
    5. Add a checkbox
    6. Variables in Adobe Captivate
  11. Create quizzes
    1. Add a Multiple-choice question
    2. Add a True or false question
    3. Add a Match the column question
    4. Add a Short answer question
    5. Add a Sequence question
    6. Add question pools and random question slides
    7. Import questions as CSV
  12. Add widgets
    1. Add a Card
    2. Add Tabs
    3. Add a Certificate
    4. Add a Carousel
    5. Add a Hotspot
    6. Add Drag-and-Drop
    7. Add a Timeline
    8. Add Click to Reveal
    9. Add an Accordion
  13. Interactions and animations
    1. Add interactions to a project
    2. Create interactive video with overlay
    3. Create a slide-level interaction
    4. Create an object-level interaction
    5. Add animations to a project
    6. States in Adobe Captivate
  14. Enhance your e-learning project
    1. Add padding to content blocks and components
    2. Add a header to a project
    3. Add a footer to a project
    4. Create a long scroll project
    5. Add a conversation slide
    6. Add characters to your Adobe Captivate project
    7. Assets in Captivate
  15. Simulation projects
    1. Simulation overview and setup
    2. Demo mode
    3. Training mode
    4. Assessment mode
    5. Full-motion recording
  16. Timeline and TOC
    1. Timeline panel in Adobe Captivate
    2. Table of Contents in Adobe Captivate
  17. Review and collaborate
    1. Share for review
    2. Create and manage reviews
    3. Add review comments and collaborate
    4. FAQs and Troubleshooting guide for sharing projects for review   
  18. Preview and publish
    1. Preview your project
    2. Publish your project
  19. Accessibility
    1. Create accessible eLearning content in Adobe Captivate
    2. Make a slide accessible
    3. Make slide objects accessible
    4. Make an interactive component accessible
    5. Make a widget accessible
    6. Make a quiz accessible
    7. TOC and Playbar accessibility
  20. Design options in Adobe Captivate
    1. What are design options?
    2. Parts of a design option
    3. Create custom design options
    4. Modify a custom design option
    5. Export a custom design option
    6. Import a custom design option
  21. Additional resources
    1. Top How-tos in Captivate
    2. Captivate Classic vs Adobe Captivate
    3. Upgrade older Captivate projects to the latest version
    4. Create and deploy Captivate packages in Admin Console

Learn how to add web objects to a Captivate project.

Overview

Web objects allow you to embed external content, such as HTML5 media, videos, web pages, streaming links, and PDFs, directly into slides. This feature enhances interactivity and allows the integration of third-party resources. Web Objects can be added using URLs, embed codes, or uploaded PDFs, offering flexibility in content inclusion. Their appearance is fully customizable, with options to include captions, subtitles, and interactive buttons, ensuring a cohesive and engaging user experience.

Topics in this page:

Add a web object on a slide

There are three methods for adding a web object in Adobe Captivate: you can add the URL of a webpage, insert an embed code for a video or streaming link, or upload a PDF from your system.

  1. Select Add media blocks from the left toolbar.

  2. Select Web Object.

    Add a web object on a slide

  3. In the Visual Properties panel, choose the number of web objects to include in the content block, with a maximum of 2 per slide.

  4. Add components such as Captions, Subtitles, Cards, or Buttons through the Components section.

    • Caption/Subtitle: Adds text placeholders inside the content block. 
    • Card: Adds a card around the web object(s) and acts as a container. 
    • Button: Can be used to hide or show the web object, add interactions and animations. 
    Add components ins a web object

Adding web object sources

Select the web object placeholder on the slide to see the source options in the Content section to add the web object.

Web object source

 Adding a URL as a web object

Select the URL option in the Content section to display web pages or an online video on a slide, then copy and paste the URL into the address field.

Add a URL of a web object

 The preview of the web object appears within the content block. 

Adding an embed code as a web object

An embed code is a snippet of HTML or JavaScript provided by external platforms that allows you to integrate multimedia content, such as videos, interactive elements, or widgets, into your project.

An embed code helps you to include videos from a streaming server and gives you more control over the object’s size, layout, and appearance.

  1. Select the Embed code option.

  2. Copy the embed code from YouTube, Vimeo, or any video streaming platform and paste it.

    Here is an example of an embed code from a YouTube video:

    <iframe width="560" height="315" src="https://www.youtube.com/embed/pydJXGFsQ3A?si=Xn7kPDoNG9UduYX8" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>

    On pasting the embed code, the preview appears on the slide.

    Embed code from YouTube

    To utilize the entire area of the web object content block, edit the embed code of the iframe. Adjust the code to set the width and height attributes to "100%". For example: width="100%" height="100%". This ensures the web object fully occupies the available space.

    embed code

Adding a PDF as a web object

Embedding PDFs as web objects in Adobe Captivate enhances e-learning by providing supplementary materials, such as guides or worksheets, directly within slides. 

  1. Select the System option and then select the   icon to browse a PDF file from the system. Upon publishing the project, the PDF is copied to the project files.

    PDF as a web object

  2. Select Preview from the top-right corner to check how the PDF appears across various device views at runtime.

  3. Select the Download   and Print    icons to confirm that both functions work as expected.

    Captivate preview interface that shows the PDF web object with Print and Download buttons
    Verify the Download and Print functions during preview

Customize a web object

  1. Customize the appearance of the web object content block in the Appearance section. Enhance its visual appeal by adjusting the background color, adding borders, and applying shadows.

    Customize the web object appearance

  2. In the Alignment and Spacing section, you can adjust the content width using the slider or add padding between the content and its borders. Learn more about padding and auto-layouts in Adobe Captivate.

    Add alignment and spacing for a web object

  3. Add a card around the web object. Select the Card option from Components and expand the Card section to change the appearance of the card.

    Web object card

  4. Select the Caption or Subtitle text components to customize their appearance. You can adjust the text color, apply highlights or shadows, add bullets or numbering, and choose a style from the presets panel.

    Customize the text in a web object

  5. Select the Button component to customize its design or add padding. You can modify its shape, text, icon, color, border, or add shadows for a personalized look.

    Customize the button in a web object

Best practices for using web objects in e-learning projects 

To ensure that embedded content like videos and links to external media run smoothly and securely within your e-learning project, we recommend these best practices: 

  • Use HTTPS: Always use HTTPS for secure, encrypted connections to protect user data and ensure compatibility with modern browsers.  
  • Check for Clickjacking: Click jacking is a threat to security and Captivate does not support redirecting to a different website. 
  • Verify Browser Compatibility: Test embedded content across different browsers to ensure it displays and functions properly for all users. 
  • Confirm Legal and Unblocked Content: Use trusted, legal sources for embedded media and regularly check that links still work and are accessible in relevant regions. 
  • Ensure CORS Compliance: Make sure external resources support CORS (Cross origin resource sharing) to avoid browser restrictions on embedded content from different origins. 
  • Test Device Compatibility: Verify that embedded content is responsive on tablets and mobile devices for a seamless experience across screen sizes. 
  • Check for Script Blocking: Test content with script blocking enabled and work with your team to implement fallbacks if critical content is blocked. 

Adobe, Inc.

Dapatkan bantuan dengan lebih pantas dan mudah

Pengguna baharu?

Pautan pantas

Lihat semua pelan anda Urus pelan anda
Lihat pautan pantas
Sembunyikan pautan pantas

Legal Notices    |    Online Privacy Policy