Using the Additional Actions tool

Customize the Style Perform Additional Actions

The Additional Actions tool provides a variety of advanced features for working with content in Canvas.

Note: This guide includes updates that are part of the July 2, 2018 release

  Interface

 Turning on the Additional Actions Tool

   This is and Advanced level Design Tool 

To turn on this tool:

1. Click the Design Tools Settings icon    in the Jump Menu
2. Do one of the following:
   1. Choose   Advanced from the Select a Comfort Level area
   2. Manually turn on this tool by finding the Additional Actions tool in the list and clicking the switch below the tool name
3. Close the Design Tools Settings

  Instructions

To use the Additional Actions tool on an element:

1. Open the page for editing.
2. Click Launch Design Tools.
3. In the Design Tools menu, click Customize the Style.
4. Click Current Element Style.
5. Click the Additional Actions tool to expand tool if needed.
6. Place your cursor within the element to which you want to perform an action.
7. Use the Apply To controls if you want to target a parent element (hovering over buttons in the Apply To controls highlights that element in the content).
8. Perform the desired action (individual actions are described below).
9. On the content page, click Save.

  Tip: You can click the  button in the jump menu to jump right to the Current Element Style section.

 Additional Actions explained

Add an empty Paragraph above or below selected element

The add paragraph buttons will insert an empty paragraph above or below the element selected in the Apply To field. This will give you a place to put your cursor in order to add content in areas that would otherwise require you to go into the HTML code.

Rearrange Contents

This tool allows you rearrange or delete the contents of a blockquote, div, dl, ol, table, tbody, tr or ul element. A new dialog box will open that will include controls for any elements inside the Apply To element.

Remove Empty Elements

This tool will look at all of the elements that are inside the Apply To element and remove any that are empty or only have a space inside of them. This is similar to what happens with the Remove Empty button in the Add Blocks dialog. The Add Blocks button will remove all empty elements within the rich content editor while this tool will only remove those within the Apply To element.

  to Space

  is the HTML entity for a non-breaking space. These are useful in some cases and problematic in others. This button will place any non-breaking space from the contents of the Apply To element with a normal space.

Wrap selection in div

This tool will take the selected content in the rich content editor and wrap it in a <div> </div> tag for styling as desired.

Unwrap

This tool will remove the tag for the Apply To element but will leave the contents of that tag alone. For example, if the Apply To element is a span, choosing unwrap will remove the <span> </span> tags from the selected element leaving the text behind.

Delete

This tool will remove the Apply To element and everything inside. 

Clear IDs

This tool will remove the id attribute from the Apply To element and any elements inside it.

Clear Classes

This tool will remove the class attribute from the Apply To element and any elements inside it.

Remove inline styles

This tool will look at all of the elements inside the Apply To element and remove any styles set using the style attribute.
Adjustments made using the Colors, Spacing, and Borders tools are just a few examples of how these styles can be set.

Unwrap spans

Pasting content into the rich content into the rich content editor can often result in a wide variety of HTML span elements being created. The Unwrap spans tool will remove any <span> elements that are inside the Apply To element. The exception are spans that are part of the Design Tools heading content block.

Unwrap divs

Like the Unwrap spans tool, The Unwrap divs tool will remove any <div> elements that are inside the Apply To element. 

Vanilla HTML

The Vanilla HTML button will run all of the functions of the Clear IDs, Clear Classes, Remove inline styles, Unwrap spans and Unwrap divs buttons. Taking styled content and returning it to vanilla html. Select the body in the Apply To section to clear from all content.