---
title: "Quickstart"
description: "Install Interactive Content XBlock and publish your first tracked Open edX activity."
source: "https://docs.blend-ed.com/interactive-content-xblock/quickstart/"
---

# Quickstart

## 1. Install the package
Add the repository to `OPENEDX_EXTRA_PIP_REQUIREMENTS`:

```
git+https://github.com/blend-ed/interactive-content-xblock.git@master
```
Rebuild the Open edX image and restart the platform. With Tutor:

```
tutor images build openedxtutor local restart
```
See [Deploy and operate](/interactive-content-xblock/deployment/) for a local development mount and supported versions.

## 2. Enable the XBlock in a course
In Studio, open **Settings → Advanced Settings**. Add this value to **Advanced Module List**:

```
interactive_content_xblock
```
Save the settings. In a unit, select **Advanced → Interactive Content XBlock**.

## 3. Create an interaction
Open the component editor. The default sample already contains a short quiz. The important connection is the global `submitInteraction(data)` function:

```
var startTime = Date.now();
function submitAnswer(answer) {  submitInteraction({    answer: answer,    correct: answer === "Paris",    timeSpent: Math.round((Date.now() - startTime) / 1000)  });}
```
Keep functions referenced by HTML event attributes in global scope:

```
<button type="button" onclick="submitAnswer('Paris')">Paris</button>
```
## 4. Configure and test
Set **Enable Auto-Grading** if the score should reach the Open edX gradebook, then set the point **Weight**. Choose **None (JS controls grading)** when the submitted object includes a boolean `correct` value.

Use **Test Grading** in the editor before saving. Publish the unit, open it in the LMS as a learner, submit an answer, and confirm that feedback and completion behave as expected.

> **Tip**
> Start from the default example and change one layer at a time: markup, styles, then behavior. This makes authoring errors easier to isolate.