Select a design option. A design option presents pre-configured layouts with cleaner design elements to apply to the content block.
For more information, view Design options in Adobe Captivate.
Последнее обновление
26 сент. 2024 г.
- 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 and configure a button in an Adobe 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.
Buttons in the all-new Adobe Captivate are interactive elements that learners click to trigger various actions, behaviors, or navigation in a project. Buttons enhance user engagement, provide interactivity, and guide learners through the course material.
While designing a button, you can apply style and color to customize the appearance of a button and add an action to the button.
Add a button content block
Select Add interactive components > Button in the left toolbar to add a button content block.
Change the properties of a button content block
Adobe Captivate lets you add a button content block and change its appearance, color, and more.
-
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. Learn more on padding in content blocks in Adobe Captivate.
Select the Autofit height checkbox to change the height of the content block to fit the slide.
When you select the checkbox, the content block fits the slide's height. The content is centered, and padding gets added to the top and bottom. Select the checkbox when the content block's height is less than the slide's height, and you want the content to fit the slide.
When there are multiple content blocks, for example, two content blocks, where the combined height of the content blocks is less than the slide's height, if you enable the checkbox on the content blocks, the space is divided between the content blocks.
-
-
Select the number of buttons you want in the content block in the Components section. Move the slider to add more buttons. If you add a button component and add more than one button, you can distribute the buttons horizontally in a uniform layout.
You can add up to 10 buttons within the button component. This will help create a custom Playbar when you disable the TOC and Playbar and add custom navigation or download buttons. Here is an example of multiple buttons:
-
In the Appearance section, you can change the color settings at the content block level. Add the background color, border, and apply a shadow to the border. Select a solid color, linear or radial gradient, or add an image as a background.
-
If you've selected Card, in the Card section, you can add a radius to one or four corners of the card, add a background color, add a border to the card, and apply a shadow to the card's border.
Modify card properties Modify card properties
Change the appearance of the button
Change the button's look and feel and determine how it behaves when you click or hover on it.
-
Select the button inside the content block.
-
In the Visual Properties panel in the right toolbar, move the Opacity slider to increase or decrease the transparency of the button.
-
Select any design option. A design option presents pre-configured layouts with cleaner design elements to apply to the button.
For more information, view Design options in Adobe Captivate.
-
In the States section, click Show to launch the States Flyout. Configure the in-built states of the button, Hover, Visited, Selected, and Disabled. If any state is disabled, right-click the state, and select Enable.
For more information, view States in Adobe Captivate.
-
In the Appearance section, select the Shape tab to add color to the background, add borders, and add shadow to the button. Select one of the caps (Butt, Round, or Projecting) when applying a border.
-
Similarly, change the font family, color, and other properties in the Text tab.
For more information, view Work with text in Adobe Captivate.
-
In the Icon tab, enable the Icon toggle.
You can change the button label and add an icon near the label. Select the folder icon and change the icon from the Assets or your computer.
-
Select the Solid color checkbox and add the icon's color. To add a border to the icon, select Border, and apply a border. Change the thicknesses of the border, and specify the border end caps (Butt, Round, or Projecting).
-
Select the icon size from, Small, Medium, or Large. Then select the position of the icon on the button. Select either:
- Alight Left
- Align Top
- Align Right
- Align Bottom
-
Select the icon's offset relative to the button. Select Default, Comfortable, or Compact. Offset adds space between the icon and the edge or border of the button.
-
In the Flip icon section, select Flip horizontally or Flip vertically, so that when a learner clicks the icon, the icon flips to the selected mode.
Add interaction to the button
After you've designed the button, you can add interaction to it. You can add interaction from the Interactions panel in the right toolbar.
-
To add an action or interaction to the button, select the button, and select Interactions on the right panel. Then assign an action, for example, Open Url or file. On previewing the project, the URL opens when the learner clicks the button.
See Interactions to know more about creating interactions.
Add interactions to the button Add interactions to the button -
To save your changes, click Done. The interaction appears in the Interactions panel.
