All Collections
Create
Using Blocks
How to Use Button Blocks
How to Use Button Blocks

How to insert, modify, and customize button blocks

Anthony Karcz avatar
Written by Anthony Karcz
Updated over a week ago

 Applies to these roles: Author, Reporter, Admin  

When you use buttons in Rise, learners can access external information easily, send emails, and quickly jump to other spots in the course. 

Here’s how they work. 

Step 1: Insert a Button Block

  1. Open a Rise course, then edit an existing lesson or create a new one.

  2. Click All Blocks in the blocks shortcut bar or the Insert Block icon (+) that appears when you mouse-over a boundary between blocks.

  3. From the sidebar that appears, select the Interactive category from the block library, then, depending on how many buttons you need, click Button or Button Stack in the panel.

You can switch an existing block between a single button and a button stack using the left-hand drop-down list that appears when you hover over the block. And if you need to delete a button from a stack, click Edit to open the sidebar, then click the garbage bin icon that appears when you hover over the button’s details.

Step 2: Edit Button Block Text

You can edit the heading and description to the left of your button in the body of your Rise course or in the sidebar. Button labels can only be edited in the sidebar.

  1. From an existing button block, click Edit or click the button whose label you want to change.

  2. Entering text in the Label field modifies the text of your button.

  3. Use the Description field to modify the descriptive text that displays next to your button.

Step 3: Choose a Destination

Buttons can link to an external webpage, an email address, or an internal location in your course. 

  1. From an existing button block, click Edit or click the button whose label you want to change.

  2. Choose Link to a webpage from the Destination drop-down list. 

  3. Enter the URL address of the page to which you’d like to link. 

When learners click the button, a new tab opens in their browser and takes them to the specified webpage.

Link to a Relative URL

  1. From an existing button block, click Edit or click the button whose label you want to change.

  2. Choose Link to a relative URL from the Destination drop-down list.

  3. Enter the URL address of the page within your subdomain to which you’d like to link.

Now, when learners click the button, a new tab will open in their browser and take them to the specified webpage. This webpage must be within your subdomain.

Send an Email

  1. From an existing button block, click Edit or click the button whose label you want to change.

  2. Choose Send an Email from the Destination drop-down list. 

  3. Enter the email address in the field that appears. Have multiple email addresses you’d like to link to? Just separate them with commas.

When learners click the button, a new draft email to the address(es) you specified is created by their default installed email application. The email subject line is the name of the course. 

Note: While it's possible, through the use of browser extensions and advanced settings, to open mailto links in web-based email clients such as Gmail, most learners need an email application installed on their device.

  1. From an existing button block, click Edit or click the button whose label you want to change.

  2. Choose the title of the lesson from the Destination drop-down list. 

Clicking this button takes learners to the destination lesson in the same screen, as if it were in-line content. Smooth!

Step 4: Modify Button and Block Settings

Buttons use your theme color by default. Click the Design icon on the right-hand side to access button color formatting. Here you can enter a hex code or choose a color manually and click Done to apply.

Click Reset to switch back to the theme color. To re-apply your previously selected custom color, open the color window and click Reset.

When you select a custom color, text contrast options display. Text contrast defaults to auto, maintaining an accessibility-conformant 4.5:1 ratio, but you can also select light or dark options. Light and dark contrast options may not maintain accessibility conformity.

Customize block settings to modify how the block displays.

Did this answer your question?