Select the image content block on the slide.
- Captivate User Guide
- Introduction to Captivate
- Add a slide
- Add text blocks
- Add media blocks
- Interactive components
- Widgets
- Create quizzes
- Add audio to a project
- Interactions
- Animations
- Accessibility
- Customize the timeline
- Customize TOC and Playbar
- Edit project properties
- Create a simulation project
- Preview a project
- Share a project for review
- Publish a project
- Upgrade projects in Adobe Captivate
Learn how to add single or multiple images to a Captivate project.
Adobe Captivate introduces content blocks, such as text or an image block, which contain components like text, image, or button. Play this video to learn more about content blocks and components.
In the all-new Adobe Captivate, you can use these image content blocks to add images such as logos, startup screens, or backgrounds for your project.
Image content blocks
There are two types of image content blocks available in Captivate:
The image content block is added to the slide.
Once you add an image content block, you can customize the properties at two levels – at the image content block and image. In the following sections, let’s understand the various properties available under both levels.
Change the properties of the image content block
The block-level properties are available when you select the image block. You can change the properties available under the various sections, such as Alignment and Spacing, Image Responsive Behavior, Design Options, Components, and Appearance.
-
-
In the Visual Properties panel, expand the Alignment and Spacing section.
The Content Width slider and Horizontal Padding are linked in the Alignment and Spacing section. Moving the slider from the left side changes the left padding value, and moving the slider from right changes the right padding value. The same change is replicated in the Content Width slider when you change the left or right Horizontal padding values.
If you want to add padding at the top or bottom of the selected content block, then enter the desired values for the Top and Bottom padding by changing the values in Vertical padding.
Select the Autofit height checkbox to change the height of the content block to fit the slide. If there are other content blocks in the slide, the content block adjusts itself to fit the slide's height.
-
Select how the image will render when viewed on a device in the Image Responsive Behavior dropdown.
The options are:
Scaled: Scaled images adjust their width and height to fit the available space on the device. The image is resized proportionally to fit the image container. You need not worry about empty spaces when using scaled images, as the images fit the available space.
Fixed height: Fixed height images maintain a constant size across devices. The height of the images remains the same, and the width varies to maintain the original Aspect Ratio. Fixed height images are helpful when the height is crucial, for example, a banner or header image.
-
Select a design option. The Design Options presents pre-configured layouts with cleaner design elements to apply to the image content block.
For more information, view Design options in Adobe Captivate.
-
In the Components section, you can change the following:
- Image: Add or remove the image inside the image content block.
- Caption: Add or remove the image caption.
- Subtitle: Add or remove the subtitle of the image.
- Button: Add or remove the buttons below the image.
- Card: Add or remove the card around the image.
Note:You can align the components in the Components section. Hover over a component and select any option (Align left, Align center, or Align right).
-
You can add a background color, linear gradient, radial gradient, or image to the image content block in the Appearance section. Also, you can add a border or a shadow.
-
If you've enabled Card, you can change the card's properties, such as padding, background color, border, or shadow.
Replace and change the properties of an image
Adobe Captivate allows you to replace an image, apply a filter, and add a border or shadow to the image.
-
Select the image placeholder on the slide.
-
Open the Visual Properties panel and replace the placeholder image using any of the following two methods. In the Image Source section,
- Click the folder icon and select Assets. This opens the Assets panel. Select an image from the collection of over eight hundred images, and click Replace Image.
- Click the folder icon and select System. This opens the file browser on your local system. Select an image from your system, and click Open.
-
In the Display dropdown, select any of:
- Fill: If you select Fill, the image covers the entire slide. This ensures that no empty space is visible in the slide, and the image fills it entirely.
- Fit: If you select Fill, the entire image is visible on the slide. No part of the image is hidden. The aspect ratio of the image is preserved when fitting the image.
- Stretch: If you select Stretch, the image is resized to exactly match the dimensions of the slide, irrespective of the image's aspect ratio.
- Fill: If you select Fill, the image covers the entire slide. This ensures that no empty space is visible in the slide, and the image fills it entirely.
-
In the Image focus dropdown, you can determine which portion of an image you want to display on a device. An image on a desktop may not scale as expected on devices. Using the Image focus options, you can display what part of the image (center, right, or left) displays on a device.
The Image focus is only available for Fill.
Left
Center
Right
-
In the States section, click Show to launch the States Flyout. Add the states of the image.
For more information, see States in Adobe Captivate.
-
In the Appearance section, select any image filter, for example, Grayscale, Lighten, Overlay, or other filters. Once you apply a filter to the image, the image's appearance changes accordingly.
There is also an Intensity slider on certain filters, for example, Colorize. Move the slider to change the image's intensity. You can also add color to the image by selecting a solid color, linear, and radial gradient in the Style dropdown.
-
Move the sliders to adjust the image's blur, brightness, and contrast. Also, you can add a border or apply a shadow to the image.
Edit the image
The image editing preview panel enables you to crop the image, preview it across various devices, and fine-tune its focus and fit. Additionally, you can learn more about background images in Adobe Captivate.
The image preview panel consists of two sections. On the left, you can see the original image and the options to change the image display and focus. On the right, you can see the previews for desktop, tablet, and mobile devices.
Watch this tutorial on how to edit background images and images within content blocks in Adobe Captivate:
-
Select the image inside the content block. Select the edit image icon in the Visual Properties panel.
Alternatively, you can also double-click the images inside content blocks, widgets, and interactive components to enter the edit mode.
-
Crop the image, change the Image display, Responsive behavior, or Image focus, and view the behavior on the right.
-
Move the handlebars to crop the image to set the focus on the part of the image that is relevant. Adjust the focus to either left, center, or right for the desired background.
-
Select Save. The edited image appears in the image content block.
You can edit images inside content blocks, widgets, interactive components, MCQ or True/False question slides, characters in scenario slides, and background images.
The image grid content block is inserted.
Replace and edit the images in the image grid content block
Editing an image in a grid content block is similar to an image content block, with the only difference of having several images in the grid, and replacing them.
-
Decide how many images you want inside the grid. In the Visual Properties panel, move the Number of images slider and select the number of images.
-
Select an image. Then select the image placeholder icon at the center of the image. This launches the Add image from pop-up, where you can select Assets or your computer.
-
Select a design option. The Design Options presents pre-configured layouts with cleaner design elements to apply to the image content block.
For more information, view Design options in Adobe Captivate.
-
In the Components section, you can change the following:
- Image: Add or remove the image inside the content block.
- Caption: Add or remove the image caption.
- Subtitle: Ad or remove the subtitle of the image.
- Button: Add or remove the buttons below the image.
- Card: Add or remove the card around the image.
-
Add an image to the grid. In the Appearance section, select any image filter. The filter you select is applied to the image.
-
In the Image source section, select the folder icon, and select an image from the Assets or your computer to replace the image on the slide.
From the Visual Properties panel, you can modify the responsive behavior (Scaled or Fixed height) of the entire image grid content block, not the individual images within it.