Advanced: HTML coding and buttons

How can I add buttons in the text editor?

Adding buttons is supported by the editor, but you need to have a basic understanding of HTML coding to insert buttons. The buttons will not be visible while editing but will be shown as a link. Only edit the button in the HTML-view or it will be removed.

Button coding is based on Bootstrap 4 conventions.

A button has a class which defines the color based on semantics like "default "or "primary". You can not choose any color, only the colors below. It is possible that the colors will change in the future or be different on another LearningStone Powered Platform, as they are part of a color scheme used on the platform. The basic button (dark grey) and the white button will not change. The class also defines the size and the shape as you can see below.

A basic button

<a class="btn" href="http://www.example.com"> A basic button</a>

A button that opens a new window

Add target="_new" like this:

<a class="btn" href="http://www.example.com" target="_new"> A button that opens a new window</a>

How to add the button: replace class="...."

In the following examples, we have added the class in the button name. Simply replace the class="...." part of the code and insert it into your html code.

For the following button which is green, large, and round.

Button title

the following code is used:

<a class="btn btn-success btn-lg btn-round" href="http://www.example.com">Button title</a>