> For the complete documentation index, see [llms.txt](https://docs.feedotter.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.feedotter.com/newsletters/advanced/custom-api-embed.md).

# Custom API Embed

Place the following query just before the closing \</head> tag in your email code.  This querys the endpoint and places data in the 'ad1' Twig variable.

{% code overflow="wrap" %}

```twig
<!-- Query for Newsletter Ad Units and load first one into ad variable. -->
[% set ad1 = fetchdata('https://myfeedurlthatreturnsJSON', '{}')[0] %]
```

{% endcode %}

You can use standard twig notation to display, loop, manipulate the contents of the ad1 variable.  The following code shows a few different options:

* Dump the raw contents of ad1 to see the data
* Display each field individually (notation will change based on the JSON data structure)
* Display fields in basic HTML
* Using conditionals to display a fallback ad/image/html block when there is no data in the ad1 variable.

```html
<!-- You can dump the ad1 contents for review,debug purposes -->
 <p>Debug: [[ ad1 | json_encode ]]</p>

<!-- Conditional to show ad or default html when ad is not present -->
[% if ad1 and ad1|length >0 %]

<!-- Sample Display All Data -->
[[ad1.title]]
[[ad1.title_url]]
[[ad1.logo_url]]
[[ad1.logo_link]]
[[ad1.links[0].text]]
[[ad1.links[0].url]]

<!-- Sample Styled HTML Ouput -->
<div>
<a href="[[ad1.title_url]]">[[ad1[0].title]]</a><br/>
<a href="[[ad1.logo_url]]" target="_blank">
<img src='[[ad1.logo_url]]' />
</a>
</div>

[% else %]
<div>
<a href="[[custom.topFallbackUrl]]"><img src='[[custom.topFallbackSrc]]'/></a>
</div>

[% endif %]
<p>## end json api display ##</p>
```