Bannières Ads
Atelier de création de bannières Google Ads Display : éditeur HTML/CSS, aperçu multi-formats en temps réel, assistance IA, sauvegarde serveur et export PNG/JPG/PDF/ZIP.
Vue d’ensemble
- Accès principal : Tableau de bord, onglet Bannières Ads (
/tableau-de-bord?tab=bannieres-ads), chargé à la demande via/api/dashboard/bannieres-ads. - Accès legacy :
/outils/bannieres-adsredirige vers le tableau de bord. - Présentation publique :
/outils-ia/bannieres-ads(page marketing, pas l’outil).
L’interface est organisée en 9 étapes dans la colonne de gauche, avec un aperçu à droite mis à jour à chaque modification.
Parcours en 9 étapes
| Étape | Bloc | Rôle |
|---|---|---|
| 1 | Projet | Choisir un projet « gestion » : son contenu remplit le brief. Suggestions de texte IA et optimiseur créatif (thème, formats, dispositions, palette). |
| 2 | Format et disposition | Cocher les tailles Google, choisir une disposition par format et la disposition par défaut. Copier un format vers les autres. |
| 3 | Identité de marque | Logo (upload, bibliothèque de médias, logo du client) et image de fond (fichier, bibliothèque ou lot IA). |
| 4 | Thème, couleurs et typo | Modèle visuel, palettes enregistrées, palette IA, réglages fins (couleurs, opacités, typographie). |
| 5 | Code | Édition directe du HTML et du CSS (annuler/rétablir). |
| 6 | Bibliothèque d’idées | Variations créatives via OpenAI Batch (optionnel). |
| 7 | Suivi des lots OpenAI | État des lots fonds et idées (conservé ~60 jours). |
| 8 | Export | PNG, JPG, PDF par format, ou archives ZIP. |
| 9 | Bannière enregistrée | Nommer, enregistrer sur le serveur, dupliquer. Sauvegarde auto si un projet est sélectionné. |
Données et persistance
| Table | Rôle |
|---|---|
banner_ads |
Bannière enregistrée (HTML, CSS, thème, formats, fond, logo, style), liée à un projet projects. |
banner_user_color_themes |
Palettes de couleurs enregistrées par utilisateur. |
banner_ai_generation_logs |
Traçabilité des générations IA (textes, lots, variantes). |
openai_batch_jobs |
Suivi des lots OpenAI (fonds, variations). |
banner_ad_projects |
Déprécié. Anciens projets de bannières autonomes ; l’éditeur utilise désormais les projets « gestion » (projects). |
Configuration
config/banner-ads-themes.php: tailles Google Ads, thèmes visuels et dispositions de blocs.config/banner-ads-fonts.php: polices proposées (avec chargement Google Fonts).config/banner-layout-logos.php: placement du logo selon la disposition.
IA (optionnelle)
L’assistance IA requiert OPENAI_API_KEY. Sans clé, les suggestions de texte basculent sur un repli local et les fonctions de lots affichent un message.
- Textes : titres, sous-titres, CTA et typo à partir du brief (
BannerAdSuggestionService). - Optimiseur créatif : thème, formats, dispositions et palette en un appel (
BannerAdsCreativeOptionsOptimizerService). - Profil de communication : si le projet est lié à un client doté d’un profil de communication actif, son résumé (ton, voix) est ajouté au brief envoyé à l’IA pour les suggestions et l’optimiseur.
- Fonds : lot d’images via OpenAI Batch (
BannerAdsBackgroundBatchService). - Variations : lot d’angles créatifs (
BannerAdVariationsBatchService).
Tailles disponibles
Rectangle moyen (300×250), grand rectangle (336×280), leaderboard (728×90), grande leaderboard (970×90), bannière (468×60), demi-page (300×600), gratte-ciel large (160×600), gratte-ciel (120×600), portrait (300×1050), mobile leaderboard (320×50), grand mobile (320×100), interstitiel mobile (320×480), billboard (970×250), carré (250×250), petit carré (200×200).
Thèmes
Minimal, Bold, Gradient, Nature, Rétro, Neon, Corporate, Promo, Luxe.
Bonnes pratiques
- Respecter les spécifications Google Ads (dimensions et poids des créatifs).
- Tester plusieurs formats et angles pour optimiser les performances.