← Back to support

How to use Source Code Highlighting

Yes

AlgoApp can highlight source code automatically, but this is an advanced layout feature.

Basic idea

Create or edit a layout so one field is rendered as code and another field is rendered as the explanation or answer.

Example

Use a field named "code" on the front:

<code data-lang="C#">{{code}}</code>

Use the back side to show the front plus an explanation field:

{{FrontSide}}
<hr />
<div class="meaning">{{meaning}}</div>

How to set it up

  1. Open the deck's "Layouts" screen.
  2. Create a new layout or edit an existing one.
  3. Put the code HTML on the front side.
  4. Put the explanation HTML on the back side.
  5. Save the layout.
  6. Create cards with "code" and "meaning" values.

Notes

  • Replace "C#" with another language name if needed.
  • This feature is best for users comfortable editing layouts.