# Integration methods

There are several ways to integrate with the API. Most of the widgets can handle all of the integration methods, but there are some exceptions.

## JS-loader

The JS-loader is the preferred way to integrate Datablocks widgets. It's basically a script wrapping (and executing) a function that takes as it's input a set of widget tokens and corresponding DOM-element selectors, then fetches the widgets and inserts them into the DOM-elements.

{% content-ref url="/pages/-LYRwAI\_rYZ8ma7PE\_cr" %}
[JS-Loader](/datablocks/-LYRjiiPF4zveC0T_zB_/integration/js-loader.md)
{% endcontent-ref %}

## Wordpress Widget

* The MF Datablocks Wordpress Widget is a plugin which lets you add one (or multiple) Datablocks widgets to your Wordpress site. 
* It enables an easy way to embed various types of Datablocks data from MFN for a particular company, onto different sections of your site.

{% content-ref url="/pages/-LzLr-Ws3y5uUA044EjG" %}
[Wordpress Plugin](/datablocks/-LYRjiiPF4zveC0T_zB_/integration/wordpress-widget.md)
{% endcontent-ref %}

## Request - JSON

* The API support JSON formatted responses. 
* This solution puts higher requirements on the integration since the data isn't formatted. It means you have to handle the locale, percent formation, signs for positives/negatives and so on.

{% content-ref url="/pages/-LYRwC6Kh5tcZ59t4gfp" %}
[Request - JSON](/datablocks/-LYRjiiPF4zveC0T_zB_/integration/request-json.md)
{% endcontent-ref %}

## Request - HTML

* The API support templated HTML responses. 
* This solution puts lower requirements on the integration since the data is formatted. This means you don't have to handle the locale, percent formation, signs for positives/negatives and so on.
* Specific css-classes are also appended when needed. 

{% content-ref url="/pages/-LYRwGdqrAwSQEFFi4TE" %}
[Request - HTML](/datablocks/-LYRjiiPF4zveC0T_zB_/integration/request-html.md)
{% endcontent-ref %}

## IFRAME

* For very quick integrations
* Cons
  * Not easy to style from your side
  * Just basic functionality

{% content-ref url="/pages/-LYRwJODL4F9fAoMK2t5" %}
[IFrame](/datablocks/-LYRjiiPF4zveC0T_zB_/integration/iframe.md)
{% endcontent-ref %}

## Vue.js

A simple Vue.js component wrapper for the JS loader

{% content-ref url="/pages/txIMhunyrYPK05c2Wheb" %}
[Vue.js](/datablocks/-LYRjiiPF4zveC0T_zB_/integration/vue.js.md)
{% endcontent-ref %}

## React

A simple react component wrapper for the JS loader

{% content-ref url="/pages/-LsvCakQRmDcCNz31iqB" %}
[React](/datablocks/-LYRjiiPF4zveC0T_zB_/integration/react.md)
{% endcontent-ref %}


---

# 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://modfin.gitbook.io/datablocks/-LYRjiiPF4zveC0T_zB_/overview/integration-methods.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.