> For the complete documentation index, see [llms.txt](https://everyday-digital.gitbook.io/authoring-docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://everyday-digital.gitbook.io/authoring-docs/content-pages/content-page-library/video-+-text.md).

# Video + Text

<figure><img src="/files/aBTE2gSTsTQZtZUSK60t" alt=""><figcaption></figcaption></figure>

## What is a Video + Text page?

The Video + Text page accommodates a .mp4 video with related text.

## Quick steps: how to create & edit a Video + Text page

1. **Open Authoring.** Create or open a [Learning Story](/authoring-docs/authoring/content-types/learning-story.md), [Assessment](/authoring-docs/authoring/content-types/assessment.md) or [Survey](/authoring-docs/authoring/content-types/survey.md) [content type](/authoring-docs/authoring/content-types.md).
2. **Open the Editor.**
3. **Add a Video + Text page.** Select the + icon and choose Video + Text from the Add Page options. Alternatively, open an existing Video + Text page.
4. **Edit the page.** Select the page to view the [Page Options](/authoring-docs/content-pages/story-and-page-settings.md#what-are-the-page-options), and select Update to add and edit content. Videos must be in .mp4 format at a 16:9 ratio. Use the text space to enter the text that will display below the video.
5. **Format text layout and style.** Use the toolbar for basic text [formatting](#text-formatting-tools), and toggle to [Advanced Settings](#video-+-text-advanced-settings) for further layout options.

## Video + Text Advanced Settings

**Video Controls**\
Controls show options for the user to play, pause, toggle to full screen,  or adjust sound. By default, video controls are not added.

**Video Fill**\
Choose how the video should fill the page. Choose from: Fill Width/Height (Default), Fill Width, Contain Width, or Contain Height.

**Autoplay Video**\
By default, videos autoplay as soon as the user opens the page. If you do not choose to autoplay, a play button will be added.

**When the video ends...**\
Decide what happens at the end of the video: Play again (default), Stop, Go to next page.

**Loop Keyframe (In Seconds)**\
Use this option if you want your video to loop after a certain point - the video will play in full the first time and can then play again at a specific point based on the delay indicated in seconds. For example, if you only want to play intro effects once, you can use keyframe settings to loop only the part of the video that does not contain the intro.

**Background Colour**\
Select an alternative background colour to override the theme default.

**Video Size**\
Large (default), Medium, Small

**Video Effect (Non-Mobile)**\
Choose a video effect for the desktop/tablet version of your story. Effects include adding a white frame and/or a dark shadow.

**Video Tilt (Non-Mobile)**\
Tilt your video left or right.

## Video + Text Tips and FAQs

### What format and size should the video be?

**Videos must be in .mp4 format at a 16:9 ratio.**&#x20;

**Limit videos to 10MB.** It is recommended to keep video size below 10MB to avoid exceeding the story size limit of 100MB.&#x20;

### Why are my videos cut off, clipped, or showing empty spaces?

**Depending on the screen size, the page setting "Fill Width & Height" will fill the view until both width and height are filled.** This could, however, clip the video; this setting is intended for aesthetic/safe margin videos.&#x20;

If the video must be shown without any clip, set the fill to "Fill Width". Black bars might occur depending on the device size, which avoids the video being distorted.&#x20;

{% hint style="success" %}
**Suggested workaround:**&#x20;

1. Use a [Video Cover](/authoring-docs/content-pages/content-page-library/video-cover.md) page and select "No autoplay" in the settings.
2. To include text relating to the video, use the "[Add Dialog](/authoring-docs/content-pages/story-and-page-settings/page-options.md#page-dialog)" option. After the user sees the dialog, the click-to-play option to watch the video will display.
   {% endhint %}

### How many videos can I add to a story?

**In stories, use videos sparingly to avoid lagging.** Use Streams if your content is video-rich.

### How do I stop my video from looping?

The video will run on a continuous loop unless you enable Video Controls (pause/play and full-screen options) in [Advanced Settings](#video-+-text-advanced-settings).

### How to format a Video + Text page

**Text formatting.** Refer to text formatting toolbar options in the [Text page](/authoring-docs/content-pages/content-page-library/text.md).

**Image formatting.** Refer to the [Advanced Settings](#video-+-text-advanced-settings).

{% hint style="warning" %}
If you choose custom colours for your text, those colours will also be used in Dark Mode. Only default font colours will auto-adjust in Dark Mode.
{% endhint %}

### **Video display / orientation: Vertical Videos**

**Videos uploaded will display based on the orientation of the video i.e. Vertical / Horizontal.** This means vertical videos will display the full screen height giving the best experience on mobile.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://everyday-digital.gitbook.io/authoring-docs/content-pages/content-page-library/video-+-text.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
