Diffuser des missions par widget

Vous pouvez afficher des missions de l'API sur votre site web en quelques heures

Le widget permet d'afficher les missions de l'API sur un site web via un iframe (comme les cartes Google Maps sur les sites).

Vous pouvez choisir entre deux formats de widget pour assurer une intégration optimisée sur votre site web. Votre widget peut prendre la forme d'une page de résultats de missions ou se présenter plus discrètement dans un carrousel de missions.

Pour intégrer le widget, vous devez coller le code ci-dessous sur votre site web

Important : ce script est conçu pour garantir une intégration optimisée sur votre site web. Il est important de le copier tel quel.

<iframe id="api-engagement-widget" class="engagement-grid" border="0" frameborder="0" style="display:block; width:100%;" loading="lazy" allowfullscreen allow="geolocation" src="https://mission.api-engagement.beta.gouv.fr?widget=612f9d2bb2e403030f1684f8"></iframe>
  
<!-- Script pour adapter la hauteur du widget -->
<script>
function updateHeight() {
  let div = document.getElementById("api-engagement-widget");
  if (div.offsetWidth < 640) div.style.height = "3500px";
  else if (div.offsetWidth < 1024) div.style.height = "1900px";
  else div.style.height = "1350px";
}
updateHeight();
window.addEventListener("resize", updateHeight);
</script>
<div style="padding:10px; display:flex;">
  <img src="https://apicivique.s3.eu-west-3.amazonaws.com/jvalogo.svg"/>
  <div style="color:#A5A5A5; font-style:normal; font-size:13px; padding:8px;">Proposé par la plateforme publique du bénévolat
    <a href="https://www.jeveuxaider.gouv.fr/" target="_blank">JeVeuxAider.gouv.fr</a>
  </div>
</div><!-- Script pour adapter la hauteur du widget -->

Après avoir intégré le widget sur votre site, l'utilisateur voit l'ensemble des missions disponibles. Il pourra alors cliquer sur une mission présente dans le widget et sera renvoyé vers le site de l'Annonceur où il pourra candidater.