> ## Documentation Index
> Fetch the complete documentation index at: https://domoinc-openapi-sync-dataflows.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Add and Design App Pages in CourseBuilder

export const InlineImage = ({src, alt = '', height = '1.6em'}) => {
  return <img noZoom src={src} alt={alt} style={{
    display: 'inline',
    verticalAlign: 'start',
    height: height,
    margin: '0'
  }} />;
};

### Intro

You have many page types to choose from when building your CourseBuilder app. Each page type has a different purpose and different capabilities. Domo University provides several page templates to help you get started. Learn more about each template below.

<Frame>
  <img alt="Screenshot 2023-12-08 at 10.37.31 AM.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/NZY_77jeKitg9n1Q/images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EMVq0000001zxW.jpg?fit=max&auto=format&n=NZY_77jeKitg9n1Q&q=85&s=f8ed20408ee05816d0bf46d407836831" style={{width: 907, height: 386}} width="2792" height="1188" data-path="images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EMVq0000001zxW.jpg" />
</Frame>

***

# Introduction

*Media/activity Type:* Text

Use this page type at the beginning of a training module to introduce it.

<Frame>
  <img alt="Intro-ConclusionPage.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/NZY_77jeKitg9n1Q/images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqa.png?fit=max&auto=format&n=NZY_77jeKitg9n1Q&q=85&s=07fce99883505013b85ac16aa63c8d47" style={{width: 1165, height: 421}} width="800" height="289" data-path="images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqa.png" />
</Frame>

***

# Introduction Video

*Media/activity Type:* Video

Use this page type near the beginning of a training module—it allows the learner to watch a single introductory training video.

<Frame>
  <img alt="Intro-VideoPage.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/NZY_77jeKitg9n1Q/images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqZ.png?fit=max&auto=format&n=NZY_77jeKitg9n1Q&q=85&s=5653a81f775cbff4f615b702765f76db" style={{width: 1176, height: 418}} width="800" height="282" data-path="images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqZ.png" />
</Frame>

***

# Conclusion

*Media/activity Type:* Text

Use this page type at the end of a training module to provide a summary, thank learners, or otherwise end the module.

<Frame>
  <img alt="Intro-ConclusionPage.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/NZY_77jeKitg9n1Q/images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqa.png?fit=max&auto=format&n=NZY_77jeKitg9n1Q&q=85&s=07fce99883505013b85ac16aa63c8d47" style={{width: 1195, height: 432}} width="800" height="289" data-path="images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqa.png" />
</Frame>

***

# Drag and Drop

*Media/activity Type:* Images, Text, Feedback for responses

Use this page type to allow learners to demonstrate knowledge of concepts by dragging items onto matching items.

<Frame>
  <img alt="coursebuilder_dragndrop.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/NZY_77jeKitg9n1Q/images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqk.png?fit=max&auto=format&n=NZY_77jeKitg9n1Q&q=85&s=083abf3d81205a1835591bf22293d4d3" style={{width: 900, height: 497}} width="800" height="442" data-path="images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqk.png" />
</Frame>

***

# Embed Survey

*Media/activity Type:* Qualtrics survey

Use this page type to include a Qualtrics survey with questions or learners to answer.

<Frame>
  <img alt="coursebuilder_embedsurvey.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/NZY_77jeKitg9n1Q/images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqm.png?fit=max&auto=format&n=NZY_77jeKitg9n1Q&q=85&s=8dae1403fc684e8cfcd88b49b9025855" style={{width: 900, height: 494}} width="800" height="439" data-path="images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqm.png" />
</Frame>

***

# Media Question

*Media/activity Type:* Image, Video, Feedback for response

Use this page type to pose a question to learners related to a specific image or video displayed on the page.

<Frame>
  <img alt="coursebuilder_mediaquestion.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/NZY_77jeKitg9n1Q/images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqW.png?fit=max&auto=format&n=NZY_77jeKitg9n1Q&q=85&s=603c8bbbd01a02c8b1118cd234d20c54" style={{width: 900, height: 486}} width="800" height="432" data-path="images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqW.png" />
</Frame>

***

# Multi-video

*Media/activity Type:* Images, Text, Videos

Use this page type to add descriptive text, up to six videos, video descriptions above the video thumbnails, and custom thumbnail images.

<Frame>
  <img alt="Multi-videoPage.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/NZY_77jeKitg9n1Q/images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqe.png?fit=max&auto=format&n=NZY_77jeKitg9n1Q&q=85&s=807510d5c5fa007203b5815b6d6d907d" style={{width: 979, height: 432}} width="800" height="353" data-path="images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqe.png" />
</Frame>

***

# Next Steps

*Media/activity Type:* Linked images, Text

Use this page type at the end of a training module to direct the learner to supporting materials or to another app in the [Appstore <InlineImage src="/images/kb/ka0Vq00000001FR-00N5w00000Ri7BU-0EMVq0000000XDh.jpg" />.](https://www.domo.com/appstore/)

<Frame>
  <img alt="NextStepsPage.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/NZY_77jeKitg9n1Q/images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqb.png?fit=max&auto=format&n=NZY_77jeKitg9n1Q&q=85&s=a9162b684b12496cc3d5259b51135e53" style={{width: 1032, height: 474}} width="800" height="367" data-path="images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqb.png" />
</Frame>

***

# Pinpoints

*Media/activity Type:* Images, Text, Videos

Use this page type to help learners explore or dig deeper into a specific image or infographic on the page. This is an interactive way to convey content.

**Pinpoints Page Part 1**

<Frame>
  <img alt="PinpointPage-1.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/NZY_77jeKitg9n1Q/images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqo.png?fit=max&auto=format&n=NZY_77jeKitg9n1Q&q=85&s=e4adbded1fe0cd07d874e15728d9eec3" style={{width: 1151, height: 430}} width="800" height="299" data-path="images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqo.png" />
</Frame>

**Pinpoints Page Part 2**

<Frame>
  <img alt="PinpointPage-2.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/NZY_77jeKitg9n1Q/images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqY.png?fit=max&auto=format&n=NZY_77jeKitg9n1Q&q=85&s=7acf02a46d96fe38bf792f38acc51bc3" style={{width: 1165, height: 473}} width="800" height="325" data-path="images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqY.png" />
</Frame>

***

# Quiz

*Media/activity Type:* Images, Text

Use this page type to allow learners to check their knowledge after consuming the preceding content. There are four types of quiz questions, feedback for responses, and opportunities to retry individual questions and the entire quiz.

**Quiz Page Part 1**

<Frame>
  <img alt="QuizPage-1.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/NZY_77jeKitg9n1Q/images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqd.png?fit=max&auto=format&n=NZY_77jeKitg9n1Q&q=85&s=f1ebc6614ce83170fae29de525daa93d" style={{width: 1180, height: 435}} width="800" height="295" data-path="images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqd.png" />
</Frame>

**Quiz Page Part 2**

<Frame>
  <img alt="QuizPage-2.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/NZY_77jeKitg9n1Q/images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqc.png?fit=max&auto=format&n=NZY_77jeKitg9n1Q&q=85&s=976c5a344888bf92d2257ad27e0d4d1c" style={{width: 1187, height: 420}} width="800" height="283" data-path="images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqc.png" />
</Frame>

**Quiz Page Part 3**

<Frame>
  <img alt="QuizPage-3.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/NZY_77jeKitg9n1Q/images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqn.png?fit=max&auto=format&n=NZY_77jeKitg9n1Q&q=85&s=653fb06eb72a985d46d06aa912338a2f" style={{width: 1190, height: 421}} width="800" height="283" data-path="images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqn.png" />
</Frame>

**Quiz Page Part 4**

<Frame>
  <img alt="QuizPage-4.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/NZY_77jeKitg9n1Q/images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqU.png?fit=max&auto=format&n=NZY_77jeKitg9n1Q&q=85&s=66147b603b8306b9b5f49fc97d48a95d" style={{width: 1199, height: 424}} width="800" height="283" data-path="images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqU.png" />
</Frame>

**Quiz Page Part 5**

<Frame>
  <img alt="QuizPage-5.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/NZY_77jeKitg9n1Q/images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqi.png?fit=max&auto=format&n=NZY_77jeKitg9n1Q&q=85&s=e54345a30e6216f59852ee1e205182c5" style={{width: 1168, height: 438}} width="800" height="300" data-path="images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqi.png" />
</Frame>

***

# Rankable

*Media/activity Type:* Expandable image, Text

With this page type, learners can rank different concepts and receive feedback.

<Frame>
  <img alt="coursebuilder_rankable.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/NZY_77jeKitg9n1Q/images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqj.png?fit=max&auto=format&n=NZY_77jeKitg9n1Q&q=85&s=341e79e871de4f36ead9fb7aa3cb829c" style={{width: 899, height: 497}} width="2128" height="1176" data-path="images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqj.png" />
</Frame>

***

# Rating Next Steps

*Media/activity Type:* Title, Description, Star rating

Use this page to allow learners to rate the course from 1–5 stars and give other feedback.

<Frame>
  <img alt="coursebuilder_ratingnextstepss.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/NZY_77jeKitg9n1Q/images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqf.png?fit=max&auto=format&n=NZY_77jeKitg9n1Q&q=85&s=c4a89b7d704e0999773a7100bae8de25" style={{width: 901, height: 474}} width="800" height="421" data-path="images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqf.png" />
</Frame>

***

# Single Video

*Media/activity Type:* Text, Video

Use this page type to allow learners to watch a single video. You can also add descriptive text about the video.

<Frame>
  <img alt="SingleVideoPage.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/NZY_77jeKitg9n1Q/images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOql.png?fit=max&auto=format&n=NZY_77jeKitg9n1Q&q=85&s=7fa20f1837c64124d4b346bfb5d2bf55" style={{width: 1163, height: 410}} width="800" height="282" data-path="images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOql.png" />
</Frame>

***

# Slider Survey

*Media/activity Type:* Image, Text

Use this page type to allow learners to select an answer to a question along a spectrum. Tooltips can provide more context for each available answer.

**Slider Survey Page Part 1**

<Frame>
  <img alt="SurveySlider-1.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/NZY_77jeKitg9n1Q/images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqh.png?fit=max&auto=format&n=NZY_77jeKitg9n1Q&q=85&s=5ab32519a70e1b85b5ca76a26cf1ded2" style={{width: 1193, height: 446}} width="800" height="299" data-path="images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqh.png" />
</Frame>

**Slider Survey Page Part 2**

<Frame>
  <img alt="SurveySlider-2.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/NZY_77jeKitg9n1Q/images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqV.png?fit=max&auto=format&n=NZY_77jeKitg9n1Q&q=85&s=d15ecca778b9f0053b2262d8c8469f04" style={{width: 1134, height: 438}} width="800" height="309" data-path="images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqV.png" />
</Frame>

***

# Task Squares

*Media/activity Type:* Images, Text

Use this page type to help learners access tasks or content chunks related to a process or principle. You can use task squares accompanied by graphics for step-by-step instructions with context.

**Task Squares Page Part 1**

<Frame>
  <img alt="TaskSquaresPage-1.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/NZY_77jeKitg9n1Q/images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqg.png?fit=max&auto=format&n=NZY_77jeKitg9n1Q&q=85&s=1610ebba2003cbcf7a370bf5eebc019e" style={{width: 1258, height: 470}} width="800" height="299" data-path="images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqg.png" />
</Frame>

**Task Squares Page Part 2**

<Frame>
  <img alt="TaskSquaresPage-2.png" src="https://mintcdn.com/domoinc-openapi-sync-dataflows/NZY_77jeKitg9n1Q/images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqp.png?fit=max&auto=format&n=NZY_77jeKitg9n1Q&q=85&s=2fa31b542adcc79c55fb59010618c282" style={{width: 1131, height: 437}} width="800" height="309" data-path="images/kb/ka0Vq00000002BV-00N5w00000Ri7BU-0EM5w000005vOqp.png" />
</Frame>
