# Article page (embeds)

## Article parts

Body don't only contain [text elements](/everyware/design/everyware-theme-base-2/article-page.md), but also richer content can be added. From Naviga tools, or externally hosted content like images, video or links.

These are the types supported by Naviga Web current Base theme 2 version.

## Image

Image renders the 16:9 crop, using Imengine. If crop is not set, image will be force cropped to 16:9 by Naviga Web.

Shown data: Image src, caption, photographer(s) name, alt text

Type: `x-im/image`

Template: `views/article/image.twig`

![Image example](/files/-MS3UNdERYZQIkRF6UVj)

## Table

Supported settings:

* Table caption `<caption>`
* Header `<thead>`
* Footer `<tfoot>`
* Merged cells `colspan`
* Column index
* Number format
* Text format

Type: `x-im/table`

Template: `views/article/table.twig`

![Example table](/files/-MS3c-2j1kEhKvJ3xE0Z)

## HTML embed

This could be used for any embed using iframe or javascript. For example videos, social media, podcasts or other 3rd party article content integrations.

Type: `x-im/htmlembed`

Template: `views/article/html-embed.twig`

![Example HTML embed in Writer, with the pasted embed code](/files/-MS7uofS2fnwBV2_-C_u)

![Example HTML embed showing embedded SoundCloud](/files/-MS7ulOXmnoRBM2-Dj5H)

## Gallery (Image gallery)

Extracts the images and renders them as a clickable slider. Caption and creators (photographer) shown. See [image article part](/everyware/design/everyware-theme-base-2/article-page.md#image) for more details.

Type: `x-im/imagegallery`

Template: `views/article/gallery.twig`

![Example image gallery](/files/-MS7w4kbRoP4DqUNv_yZ)

## Content part

Used to present for example fact boxes inside the article text.

* Headline
* Title
* Image
* Paragraphs: Extracts, merges and renders all nested elements and inline styles.

Type: `x-im/content-part`

Template: `views/article/content-part.twig`

![Example content part with dummy text](/files/-MS7xFg0fgasl6x2oBvj)

## External link (inline related article)

Renders a clickable inline teaser as a block in the article body.

The link block shows

* Linked article first Section name (Concept)
* First headline

Type: `x-im/article`

Template: `views/article/related-article.twig`

![Example with two articles in Writer body](/files/-MS7y_IGA5bWxhjGEkWS)

![Example "external link" on the web site](/files/-MS8-Xoj0wxzM5SuI8dn)

## PDF document

Links to embedded pdf shows as a link block with link text from the pdf `title` that was set in Writer. Default in Writer is the pdf filename.

Type: `x-im/pdf`

Template: `views/article/pdf.twig`

![Example attached pdf in article](/files/-MS81fpxchMuB7BlTfkH)

## YouTube video

Embeds a YouTube video player. Doesn't autoplay.

Type: `x-im/youtube`

Template: `views/article/youtube.twig`

![Example Youtube embed](/files/-MS82kguODtQRU8SzE5r)

## YouPlay video

Embeds a YouPlay video player.

Type: `x-im/youplay`

Template: `views/article/youplay.twig`

## Social Embeds

Type: `x-im/socialembed`

These are the subtypes (content) of social embed that are currently supported:

|                                   | NewsML type           | Template `views/article/`      |
| --------------------------------- | --------------------- | ------------------------------ |
| **Instagram photo**               | `x-im/instagram`      | `instagram.twig`               |
| **Facebook page**                 | `x-im/facebook-page`  | `facebook-page.twig`           |
| **Facebook post**                 | `x-im/facebook-post`  | `facebook-post.twig`           |
| **Facebook video**                | `x-im/facebook-video` | `facebook-video.twig`          |
| **Facebook watch**                | `x-im/facebook-watch` | `facebook-watch.twig`          |
| **Tweet (Twitter status update)** | `x-im/tweet`          | `twitter.twig`                 |
| **Vimeo video**                   | `x-im/vimeo`          | `vimeo.twig`                   |
| ~~**SoundCloud**~~                | `x-im/soundcloud`     | Not supported. Use HTML embed. |

![Example Instagram photo in an article](/files/-MSCyM2AY73OjE6QKIbs)

![Example Facebook post in an article](/files/-MS8TIxxtAEXicH675te)

![Example Tweet in an article](/files/-MSD-N3qBF6TRwfnKU3h)

![Example Vimeo video in an article](/files/-MSD0OkcpKBYhbToGv16)

## Iframely

Embeds whatever content [Iframely](https://iframely.com/) supports.

Type: `x-im/iframely`

Template: `views/article/iframely.twig`

## Create your own article template

Articles are rendered with `single-article.php`, override that in your child theme to use own php code or twig.


---

# Agent Instructions: 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:

```
GET https://docs.navigaglobal.com/everyware/design/everyware-theme-base-2/article-page-embeds.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.