¶ Utiliser nos formats Natifs Seamless dans GAM
¶ Implémentation sur GAM
¶ Étape 1 - Prérequis
- Pour utiliser les modèles de formats Natifs Seamless créés par Digiteka, vous devez disposer des fichiers de configuration suivants :
- Le fichier “format”, qui définit les variables paramétrables du modèle (
.json) - et le fichier “style” , qui comprendra la structure HTML et le style CSS du modèle (
.html).
- Le fichier “format”, qui définit les variables paramétrables du modèle (
- Vous pouvez les télécharger via les liens suivants :
¶ Étape 2 - Import des Formats Natifs Seamless
- Dans le menu Diffusion > Native, sélectionner l’onglet “Formats natifs”.
- Puis, lors de la création d’un nouveau format natif, cliquer sur le bouton “Importer” en haut à droite.
Vous aurez accès à une popup qui vous permettra d’importer le fichier.jsoncontenu dans le .zip précédemment téléchargé.
- Voici ce que vous devriez obtenir (exemple avec le format Image) :
Il vous faudra répéter l’opération pour chaque modèle de format natif proposés par Digiteka.
¶ Étape 3 - Création des Styles Natifs Seamless
- Dans le menu Diffusion > Native, sélectionner l’onglet “Styles natifs”.
- Puis, lors de la création d’un nouveau style natif,sélectionnez l'option “Éditeur HTML et CSS”.
- À la première étape de création d'un nouveau style ("1. Définir les paramètres des annonces"), localisez la section "Format natif". Un menu déroulant vous permettra de choisir le nom du format natif que vous avez importé précédemment.
- Après avoir sélectionné votre format natif, cliquez sur le bouton "Continuer" pour passer à l'étape suivante de création du style ("2. Définir le style d'une annonce native"). Vous accéderez alors à une interface avec un éditeur de code situé à droite. Dans cet éditeur, sélectionnez l'onglet HTML et collez-y le contenu du fichier
.htmlque vous avez téléchargé précédemment.
- Pour finaliser la création de vos nouveaux Styles Natifs Seamless, cliquez sur le bouton "Enregistrer et activer".
Il vous faudra répéter l’opération pour chaque modèle de format natif proposés par Digiteka.
¶ Étape 4 - Création de nouvelles Créatives à partir des formats Natifs Seamless
- Dans le menu Diffusion > Créations, lors de la création d’une nouvelle créative, choisir “Format natif” et sélectionner au choix, les modèles suivants :
- Digiteka Seamless Format (Video)
- Digiteka Seamless Format (Image)
- Une fois la nouvelle créative créé, vous pourrez poursuivre sa configuration en suivant la documentation ci-dessous.
Il vous faudra créer une nouvelle créative pour chaque modèle de format Natif Seamless proposés par Digiteka.
¶ Test
Pour vous assurer que vos créations publicitaires s'affichent correctement et conformément à vos attentes avant leur mise en ligne, vous pouvez suivre les étapes suivantes:
- Association de la création à une campagne de test
La première étape consiste à lier votre nouvelle création publicitaire à une campagne spécifique. Il est fortement recommandé d'utiliser une campagne de test dédiée à cet usage, distincte de vos campagnes de diffusion réelles. Cela permet d'éviter toute diffusion accidentelle de créations non finalisées. - Rattachement de la campagne à un Bloc d'Annonces de test (Ad Unit)
Pour pouvoir visualiser votre création directement sur une page de site, la campagne de test doit être associée à un bloc d'annonces de test (ad unit). - Forcer l'appel de la campagne via le paramètre d'URL
vf_adunit_path
Une fois la création associée à une campagne et cette campagne ciblée sur un bloc d'annonces de test, vous pouvez forcer l'appel de cette campagne (et donc de votre création) uniquement pour vous, sur une page de site, en utilisant un paramètre spécifique dans l'URL.
Identifiez le chemin d'accès (path) de votre bloc d'annonces de test (ex : /21775744923/test_homepage_top).
Modifiez l'URL de de la page du site de test que vous aurez choisi et ajoutez le paramètre suivant :
&vf_adunit_path=[adunit_path_de_test]- Remplacez
[adunit_path_de_test]par le chemin d'accès réel de votre bloc d'annonces de test. Par exemple :https://www.votresite.com/page-de-test.html?param1=valeur1&vf_adunit_path=/21775744923/test_homepage_top
¶ Templates
¶ Image
Ce template utilise une seule image statique centrée sur l’écran ou en plein écran (selon son ratio) pour communiquer un message. Il est idéal pour les annonces visuelles rapides et impactantes.
| Assets | GAM | Description | Spécifications | |
|---|---|---|---|---|
| Image | Obligatoire | Variables définies par l'utilisateur > Picture |
Image statique haute résolution de produit attrayante, ou photo accrocheuse pour mettre en valeur votre marque. 💡Recommandations :
|
Formats autorisés : JPG ou PNG Ratio : libre Poids max: 1Mo |
| Couleur de fond | Optionnel | Variables définies par l'utilisateur > Background - color |
Couleur unie derrière l'image (si celle-ci ne couvre pas tout l'écran). 💡Recommandations :
|
Format : Code couleur hexadécimal. Contraste : Assurer un contraste suffisant avec l’image, le texte et le logo de l’annonceur. Valeur par défaut : noir. |
| Texte d’accroche | Obligatoire | Variables définies par l'utilisateur > Caption - text | Texte court et percutant qui présente le produit, la marque. | Longueur : Limité à 100 caractères (espaces inclus). Tous textes dépassants cette limite seront tronqués. |
| Annonceur - Texte | Obligatoire | Variables définies par l'utilisateur > Advertiser - name | Nom de l’annonceur | Longueur : Limité à 30 caractères (espaces inclus). Tous textes dépassants cette limite seront tronqués |
| Annonceur - Logo | Optionnel | Variables définies par l'utilisateur > Logo |
Logo de l’annonceur affiché sous forme de pastille ronde. 💡Recommandations :
|
Formats autorisés : JPG ou PNG Ratio : 1:1 Poids max: 150ko |
| CTA - Texte | Optionnel | Variables définies par l'utilisateur > Call to action - text |
Texte du bouton d'appel à l'action. 💡Recommandations :
|
Longueur : Limité à 20 caractères (espaces inclus). Tous textes dépassants cette limite seront tronqués. Valeur par défaut : “En savoir plus”. |
| CTA - Url | Obligatoire | Paramètres > Native -Destination > Url de destination | Lien vers lequel l'utilisateur est redirigé en cliquant sur le CTA. | Format: URL valide et fonctionnelle. |
| CTA - Couleur de fond active | Optionnel | Variables définies par l'utilisateur > Call to action - background color |
Couleur du fond du bouton CTA activé automatiquement au bout de 5 secondes. 💡Recommandations :
|
Format : Code couleur hexadécimal. Valeur par défaut : Correspondra à la couleur primaire spécifiée pour le skin du client côté Digiteka. |
¶ Schémas
| Exemple de rendu utilisant le template Image avec comme asset une image au format 9:16. | Exemple de rendu utilisant le template Image avec comme asset une image au format 1:1 et une couleur de fond. |
 |
 |
¶ Vidéo
Ce template combine une courte vidéo (centrée ou en plein écran selon son ratio) et une image statique en arrière-plan (optionnel) pour une présentation dynamique. Cette approche permet de contraster ou de compléter les informations visuelles, par exemple en associant un packshot à une vidéo de démonstration. La vidéo peut être positionnée au centre ou en haut de l'écran, offrant ainsi différentes options de composition avec l'image de fond. Ce format a été pensé pour vous permettre d’exploiter tous les formats de vidéos.
| Assets | GAM | Description | Spécifications | |
|---|---|---|---|---|
| Vidéo | Obligatoire | Vidéo > Fichier vidéo |
Vidéo courte et engageante d’un produit ou d’une marque. 💡Recommandations :
|
Longueur de la vidéo min/max : 15 secondes / 1 minute. Ratio : libre Poids max: 30Mo Formats autorisés : MP4 Codec autorisés : H.264, AAC ou HE-AAC audio Débit de données min. : 2 500 kbps Son : min. de 128kps |
| Positionnement de la vidéo | Optionnel | Variables définies par l'utilisateur > Video - position |
Position de la vidéo sur l’écran. Deux options sont disponibles :
💡Recommandations :
|
Options: Haut d’écran / Centré verticalement. Valeur par défaut : Haut d’écran. |
| Image de fond | Optionnel | Variables définies par l'utilisateur > Background - image |
Image de fond affichée derrière la vidéo (si celle-ci ne couvre pas tout l’écran). 💡Recommandations :
|
Formats autorisés : JPG ou PNG Ratio : 9:16 Poids max: 1Mo |
| Couleur de fond | Optionnel | Variables définies par l'utilisateur > Background - color |
Couleur unie derrière l'image (si celle-ci ne couvre pas tout l'écran). 💡Recommandations :
|
Format : Code couleur hexadécimal. Contraste : Assurer un contraste suffisant avec l’image, le texte et le logo de l’annonceur. Valeur par défaut : noir. |
| Texte d’accroche | Obligatoire | Variables définies par l'utilisateur > Caption - text | Texte court et percutant qui présente le produit, la marque. | Longueur : Limité à 100 caractères (espaces inclus). Tous textes dépassants cette limite seront tronqués. |
| Annonceur - Texte | Obligatoire | Variables définies par l'utilisateur > Advertiser - name | Nom de l’Annonceur | Longueur : Limité à 30 caractères (espaces inclus). Tous textes dépassants cette limite seront tronqués |
| Annonceur - Logo | Optionnel | Variables définies par l'utilisateur > Logo |
Logo de l’annonceur affiché sous forme de pastille ronde. 💡Recommandations :
|
Formats autorisés : JPG ou PNG Ratio : 1:1 Poids max: 150ko |
| CTA - Texte | Optionnel | Variables définies par l'utilisateur > Call to action - text |
Texte du bouton d'appel à l'action. 💡Recommandations :
|
Longueur : Limité à 20 caractères (espaces inclus). Tous textes dépassants cette limite seront tronqués.
|
| CTA - Url | Obligatoire | Paramètres > Native -Destination > Url de destination | Lien vers lequel l'utilisateur est redirigé en cliquant sur le CTA. | Format: URL valide et fonctionnelle. |
| CTA - Couleur de fond active | Optionnel | Variables définies par l'utilisateur > Call to action - background color |
Couleur du fond du bouton CTA activé automatiquement au bout de 5 secondes. 💡Recommandations :
|
Format : Code couleur hexadécimal. Valeur par défaut : Correspondra à la couleur primaire spécifiée pour le skin du client côté Digiteka. |
¶ Schémas
| Exemple de rendu utilisant le template Vidéo avec comme asset une vidéo au format 9:16. | Exemple de rendu utilisant le template Vidéo avec comme asset une vidéo au format 16:9 centrée et une couleur de fond. |
 |
 |
| Exemple de rendu utilisant le template Vidéo avec comme asset une vidéo au format 16:9 centrée et une image de fond. | Exemple de rendu utilisant le template Vidéo avec comme asset une vidéo au format 16:9 placée en haut d’écran et une image de fond. |
 |
 |