La plupart des utilisateurs n'ont pas besoin de modifier ces paramètres. La carte utilise OpenStreetMap. ChampDéfautRôle Latitude par Défaut Nombre 41.9028 Latitude du centre de la carte à l'ouverture (défaut : Rome). Longitude par Défaut Nombre 12.4964 Longitude du centre de la carte à l'ouverture (défaut : Rome). Zoom Initial Nombre 3.0 Zoom initial. Valeurs basses = vue continent, élevées = vue rue. Zoom Lieu Sélectionné Nombre 5.0 Zoom lorsque vous sélectionnez une position dans la liste. Taille du Marqueur Pixels 40.0 Taille des marqueurs sur la carte. Largeur Ligne d'Itinéraire Pixels 3.0 Épaisseur de la ligne reliant les points du trajet. Zoom de Sélection Nombre 15.0 Zoom pour la sélection précise d'une adresse.

Guide de configuration

Horizon Studio et Configurez votre application

Q: Option B : Serveur Apache (.htaccess) ← Recommandée

Ajoutez ces lignes en haut de votre fichier .htaccess : apache 📋 Copier <IfModule mod_headers.c> Header always unset X-Frame-Options Header always set Content-Security-Policy "frame-ancestors *" </IfModule>

Personnalisez votre application et découvrez toutes les fonctionnalités d'Horizon Studio. Les champs sont déjà pré-remplis avec des valeurs optimales : modifiez uniquement ce que vous souhaitez personnaliser.

CORS Fix pour intégration externe

Si votre site est affiché dans l'application et que les images ne s'affichent pas, vous devez ajouter ces lignes à votre serveur. Sans ce paramètre, l'application ne peut pas charger les images de votre site.

Pourquoi le CORS est-il nécessaire ?

📱 Votre application

→

🌐 Votre site

❌ Images bloquéesLe serveur n'autorise pas le chargement externe

📱 Votre application

→

✅ Votre site
avec CORS actif

✅ Images chargées !Le serveur autorise le chargement

⚠️

Copiez ce code en haut de votre fichier .htaccess. Il doit être le premier bloc du fichier. Si vous ne savez pas où trouver ce fichier, demandez à votre webmaster ou à votre hébergeur.

.htaccess

# CORS FIX
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Methods "GET, OPTIONS, POST"
Header set Access-Control-Allow-Headers "Origin, X-Requested-With, Content-Type, Accept, Authorization"
</IfModule>

⚠️

En cas d'erreur 500 ou si le serveur ne reconnaît pas les directives, il faut activer le module headers d'Apache depuis le terminal du serveur avec la commande :
sudo a2enmod headers
Redémarrez ensuite Apache avec sudo systemctl restart apache2

✅

Après avoir ajouté le code, les images de votre site seront visibles dans l'application en quelques minutes. Si le problème persiste, contactez le support.

Intégration Site, Blog ou Social Embed (White-Label)

Pour afficher votre site web, blog ou contenus sociaux au sein de la plateforme, la source doit autoriser le « framing ». Suivez cette procédure. En quelques minutes, tout est prêt.

📌

Plan Pro : L'intégration de votre site web ou blog personnalisé au sein de l'application est disponible exclusivement avec le plan Pro. Les plans Starter et Premium utilisent Horizon Studio comme plateforme de publication.

Étape 1 : Test de compatibilité

Avant de modifier quoi que ce soit, vérifiez si votre site/blog est déjà prêt.

Rendez-vous sur le site IFrameTester.com

Collez l'URL complète de votre site ou blog (ex. https://www.monblog.fr)

Cliquez sur Render

✅

Votre site apparaît dans le cadre ? Vous n'avez rien à faire : votre site/blog est déjà compatible !

❌

Vous voyez une erreur du type « Refused to connect » ou un cadre gris ? Votre serveur bloque l'intégration. Passez à l'étape 2.

Étape 2 : Solution technique

Demandez à votre webmaster ou à votre hébergeur d'appliquer l'une de ces configurations. Ces instructions suppriment les blocages de sécurité et permettent à la plateforme d'afficher votre contenu.

Option A : Serveur Nginx

Modifiez le fichier de configuration du site en ajoutant ces lignes :

nginx

# Supprime la restriction de sécurité stricte
proxy_hide_header X-Frame-Options;
add_header X-Frame-Options "" always;
# Autorise l'intégration universelle (White-Label)
add_header Content-Security-Policy "frame-ancestors *;" always;

Option B : Serveur Apache (.htaccess) ← Recommandée

Ajoutez ces lignes en haut de votre fichier .htaccess :

apache

<IfModule mod_headers.c>
Header always unset X-Frame-Options
Header always set Content-Security-Policy "frame-ancestors *"
</IfModule>

Option C : functions.php ← Plus simple

Si vous n'avez pas accès aux fichiers du serveur, ajoutez ce code au fichier functions.php de votre thème actif :

php

function allow_white_label_framing() {
// Débloque les restrictions de sécurité du site
remove_action( 'login_init', 'send_frame_options_header', 10 );
remove_action( 'admin_init', 'send_frame_options_header', 10 );
// Active l'affichage externe
header("Content-Security-Policy: frame-ancestors *");
header_remove("X-Frame-Options");
}
add_action('send_headers', 'allow_white_label_framing', 1);

Étape 3 : Activer les fonctionnalités avancées (Facultatif)

Pour offrir la meilleure expérience à vos utilisateurs, ajoutez ce script dans l'<head> de votre site. Le script active des fonctionnalités supplémentaires telles qu'une navigation optimisée et des animations fluides au sein de l'application.

Ouvrez le fichier HTML de votre site (ou le fichier template du thème)

Trouvez la balise <head> ... </head>

Collez le script suivant avant la fermeture de </head>

html

<script src="https://scripts.travelinfluencer.co/horizon-webview-helper.js" data-horizon-webview async></script>

✅

Ce que fait ce script : Il active une navigation optimisée, des animations fluides et des transitions avancées lorsque votre site est affiché au sein de l'application Travelinfluencer. Le site continue de fonctionner normalement même sans le script.

💡

Facultatif mais recommandé : Le script est léger, se charge de manière asynchrone et n'affecte pas les performances de votre site. Il ne fait rien si le site n'est pas ouvert dans l'application.

Exigences fondamentales

🔒

Protocole HTTPS : Votre site/blog doit disposer d'un certificat SSL actif. Les sites en http:// (non sécurisés) ne peuvent pas être chargés.

☁️

Cloudflare : Si vous utilisez Cloudflare, désactivez les éventuelles règles de type « HSTS » ou « Origin Shield » qui forcent l'en-tête X-Frame-Options: SAMEORIGIN.

💬

Support : Si, après avoir appliqué ces modifications, le test échoue toujours, contactez le support technique de votre hébergeur en fournissant la capture d'écran du test effectué sur IFrameTester.com.

📱

Social Embed : Certaines plateformes sociales permettent d'intégrer (embed) leurs contenus directement dans votre application. La disponibilité de cette fonctionnalité dépend de la plateforme sociale : toutes ne prennent pas en charge l'embed. Si le réseau social l'autorise, le contenu sera affiché nativement au sein de l'application sans configuration supplémentaire.

Domaine personnalisé (White-Label)

Si votre plan inclut l'option Custom Domain, vous pouvez relier votre domaine ou sous-domaine (ex. app.votrenom.fr) à la plateforme. Vos utilisateurs accéderont à votre application depuis votre adresse web.

Comment fonctionne le pointage DNS

🌐 app.votrenom.fr

→

🔗 Enregistrement CNAME

pointe vers

→

connect.travelinfluencer.co

🔒 Certificat SSL
généré automatiquement

→

✅ Votre application est en ligne !
accessible depuis app.votrenom.fr

Instructions pour le pointage DNS

Accédez au panneau de gestion de votre domaine (ex. Aruba, Cloudflare, Register) et ajoutez un nouvel enregistrement DNS :

Champ	Valeur à insérer
Type d'enregistrement	CNAME
Hôte / Nom	`app`, ou le nom de votre choix : voyages, portail, connexion...
Destination / Valeur	`connect.travelinfluencer.co`
TTL	Automatique ou 3600

Remarques importantes

🚫

N'utilisez pas d'enregistrement de type A (adresses IP). Utilisez exclusivement l'enregistrement CNAME pointant vers connect.travelinfluencer.co. Cela garantit que votre service reste actif même en cas de mise à jour de nos serveurs.

🔒

SSL / HTTPS automatique : Une fois le pointage configuré, le système active automatiquement un certificat SSL gratuit pour votre domaine. L'activation a normalement lieu en quelques minutes, mais peut dépendre de facteurs techniques externes (propagation DNS comprise) et, dans des cas exceptionnels, nécessiter des délais supérieurs.

⏱️

Propagation DNS : Les modifications DNS peuvent prendre de quelques minutes à quelques heures pour être visibles au niveau mondial.

Que se passe-t-il ensuite ?

Vous créez l'enregistrement CNAME dans votre panneau DNS

Notre système détecte le pointage et génère automatiquement le certificat SSL

Votre application sera accessible depuis votre adresse personnalisée (ex. app.votrenom.fr)

🔴

Attention. Rétrogradation d'un domaine personnalisé vers un sous-domaine : Le domaine personnalisé est intégré à la configuration interne de votre application (sessions utilisateur, certificats SSL, indexation). Le passage d'un domaine personnalisé à un sous-domaine standard implique une restructuration complète de l'environnement qui rend les données existantes incompatibles. La configuration de l'application, les paramètres personnalisés et les contenus associés au domaine seront définitivement perdus. Cette opération est irréversible : avant d'effectuer une rétrogradation, assurez-vous d'avoir sauvegardé tout ce dont vous avez besoin.

Horizon Studio

Horizon Studio est la plateforme qui vous permet de configurer votre application et de gérer votre blog de contenus.

💡

Plateforme complète : Horizon Studio est bien plus qu'un simple blog. Il inclut un éditeur avancé, des badges promotionnels, des CTA avec liens externes, le suivi des vues, un système de likes, des commentaires et des profils d'auteur personnalisables — le tout géré depuis le frontend.

📝 Création et gestion de contenus

Tout ce qu'il faut pour créer et gérer vos articles, directement depuis le frontend.

Fonctionnalité	Description
Éditeur frontend complet	Création et modification d'articles avec l'éditeur visuel TinyMCE (barre d'outils complète). Mise en forme du texte, insertion d'images, de liens et bien plus encore.
Images à la une	Téléversement avec aperçu immédiat. Le système affiche un aperçu avant la publication.
Statut de publication	Bascule rapide entre Publié et Brouillon directement depuis la liste des articles. Aucune confirmation requise : un clic pour changer de statut.
Suppression définitive	Suppression d'articles avec confirmation explicite. Les images associées sont automatiquement supprimées.
Commentaires	Activation/désactivation pour chaque article. Modèle de commentaires personnalisé avec prise en charge des réponses imbriquées. Activez ou désactivez les commentaires individuellement pour chaque contenu.

🏷️ Système de badges

Chaque article peut être marqué d'un badge visuel affiché sur la carte et dans le post seul. Les badges apparaissent sous forme d'étiquettes colorées en superposition sur l'image à la une.

Badge	Signification	Cas d'usage
Promo	Offre promotionnelle	Remises, offres à durée limitée, codes promo
Nouveau	Contenu vient d'être publié	Signaler des nouveautés, ajouts récents au catalogue
Hot	Contenu populaire	Best-sellers, tendances du moment, contenus viraux
Gratuit	Contenu gratuit	Ressources gratuites, guides gratuits, essais, cadeaux

📍

Où ils apparaissent : Les badges sont visibles sur la carte article dans la liste, dans le profil d'auteur et dans le post seul — toujours en superposition sur l'image à la une.

🔗 CTA avec liens externes

Chaque article peut inclure une Call-To-Action avec lien externe, parfaite pour monétiser les contenus et renvoyer vers des ressources externes.

Cas d'usage

Type	Description	Exemple
Lien d'affiliation	Renvoyer vers des produits/services tiers avec suivi des commissions	Lien vers Booking.com, Amazon, etc.
Packs et produits	Lien vers des pages d'achat, landing pages, e-commerce	« Réservez le pack vacances »
Guides et ressources	Renvoyer vers des tutoriels, de la documentation, des cours en ligne	« Téléchargez le guide PDF »
Sites externes	N'importe quelle URL externe pour des approfondissements, démos, etc.	« Visitez le site du partenaire »

Comment ça fonctionne dans le post seul

La CTA est affichée comme un bouton visible dans le bloc promo du post seul, avec :

Label — le texte du bouton (ex. « €29.99 », « Découvrir », « Réserver maintenant »)
Link — s'ouvre dans un nouvel onglet avec rel="noopener noreferrer" pour la sécurité
Icône flèche — indique l'action de sortie vers le site externe

👁 Suivi des vues

Le comptage des vues est automatique et activé par défaut pour tous les articles. Aucune configuration requise.

Fonctionnalité	Détail
Compteur automatique	Le compteur est incrémenté automatiquement à chaque visite du post seul.
Affichage dans la liste	Le comptage est affiché sur chaque carte article avec l'icône 👁.
Aucune configuration	Le suivi est actif par défaut pour tous les articles publiés.

👤 Vues du profil

Le comptage des vues des profils auteur/influenceur est automatique et activé par défaut. Aucune configuration requise.

Fonctionnalité	Détail
Compteur automatique	Le compteur est incrémenté automatiquement à chaque visite du profil de l'auteur/influenceur.
Affichage dans le profil	Le comptage est affiché sur la page du profil auteur/influenceur avec l'icône 👁.
Aucune configuration	Le suivi est actif par défaut pour tous les profils auteur/influenceur publiés.

❤️ Système de likes

Système d'appréciation public, sans connexion requise. Fonctionne pour tous les visiteurs, anonymes inclus.

Fonctionnalité	Détail
Like public	Aucune connexion requise. Les visiteurs anonymes peuvent mettre un like à n'importe quel article.
Prévention des doublons	L'état du like est enregistré dans le navigateur pour éviter les likes multiples depuis le même appareil.
Retour visuel	Le cœur se remplit et le compteur se met à jour en temps réel avec une animation fluide.
Endpoint public	Accessible aussi bien par les utilisateurs authentifiés que par les visiteurs anonymes. Aucune authentification nécessaire.

👤 Profils d'auteur personnalisables

Chaque auteur dispose d'une page de profil publique entièrement personnalisable, visible par tous les visiteurs.

Élément	Description
Image hero	Bannière pleine largeur avec superposition en dégradé. L'image couvre toute la partie supérieure du profil.
Avatar	Image circulaire superposée au hero. Elle devient le symbole visuel de l'auteur sur tout le site.
Bio HTML	Description avec une mise en forme riche (gras, liens, listes). Prend en charge le HTML complet pour une bio professionnelle.
Pseudo	Nom affiché personnalisé, indépendant du nom d'utilisateur.
Couleurs personnalisées	6 couleurs personnalisables (fond, boutons, texte, cartes) + arrondi de l'image. Chaque profil peut avoir son style unique.
Grille d'articles	Tous les posts publiés de l'auteur, affichés en grille avec badge et prix mis en avant sur chaque carte.

🎨

Personnalisation totale : Les profils d'auteur sont totalement indépendants. Chaque auteur peut choisir ses couleurs, son hero et son style — créant une identité visuelle unique au sein de la plateforme.

Configuration de l'application

Tous les champs sont déjà pré-remplis avec des valeurs optimales. Modifiez uniquement ce que vous souhaitez personnaliser. Vous pouvez toujours revenir aux valeurs d'origine avec le bouton Reset.

💡

Vous n'avez pas besoin de tout remplir ! Les valeurs par défaut sont déjà optimales pour la plupart des utilisateurs. Personnalisez uniquement ce qui rend votre application unique.

🔒

Champs et plans : Certains champs dépendent du plan souscrit (Starter, Premium, Pro). Les champs bloqués par le plan ne sont pas modifiables. Ce guide présente tous les champs disponibles. Ceux qui ne sont pas accessibles apparaîtront désactivés dans la configuration.

🌐

Premier accès : Avant de pouvoir accéder à votre application, il vous est demandé de choisir un nom de domaine (ex. votrenom.travelinfluencer.co). Pour ouvrir l'application, saisissez cette adresse dans la barre de recherche de votre navigateur.

branding · colors

L'identité visuelle de votre application : logo, couleurs et police.

Champ	Défaut	Rôle
`Icône App`URL	Logo TravelInfluencer	L'image qui représente votre application. Format PNG, minimum 512×512px. Utilisée comme icône partout dans l'application. Comment insérer le logo : téléversez une image depuis votre profil et copiez l'URL générée, ou collez directement l'URL d'une image en ligne. Si les images ne se chargent pas, consultez la section Correctif CORS.
`Couleur de Fond Principale`Couleur	#00519C	La couleur principale de votre marque. Utilisée dans la barre du navigateur et comme couleur de thème.
`Couleur de Fond Splash`Couleur	#FFFFFF	La couleur de fond au démarrage de l'application. Généralement blanc ou la couleur de la marque.

Afficher toutes les couleurs personnalisables

Chaque couleur est au format #RRGGBB. Les valeurs affichées sont celles par défaut.

Surface et fond

Champ	Défaut	Usage
`Couleur Principale`	#00519C	Boutons principaux, indicateurs actifs, AppBar
`Couleur de Surface`	#FFFFFF	Fond des cartes, dialogues, bottom sheet
`Couleur de Fond`	#F7F9FC	Fond principal derrière tout le reste
`Teinte de Surface`	#E8EDF5	Fonds semi-transparents, piste des switchs
`Teinte de Surface Claire`	#F0F4FA	Variante plus claire de surfaceTint

Texte

Champ	Défaut	Usage
`Couleur de Texte Principal`	#0F172A	Titres et contenus importants
`Couleur de Texte Secondaire`	#475569	Sous-titres et informations complémentaires
`Couleur de Texte Tertiaire`	#94A3B8	Indications, placeholders, infos peu importantes
`Couleur de Texte Désactivé`	#CBD5E1	Éléments désactivés

États

Champ	Défaut	Usage
`Couleur de Succès`	#16A34A	Confirmations, état « terminé »
`Couleur d'Avertissement`	#F59E0B	Avertissements et attention
`Couleur d'Erreur`	#DC2626	Erreurs principales
`Couleur d'Erreur Claire`	#FEF2F2	Fond clair pour les zones d'erreur
`Couleur de Bordure d'Erreur`	#FECACA	Bordure des cartes/conteneurs d'erreur
`Couleur d'Erreur Secondaire`	#EF9A9A	Couleur d'erreur secondaire, fond clair
`Couleur de Texte d'Erreur`	#E53935	Texte des messages d'erreur
`Couleur d'Erreur Foncée`	#D32F2F	Couleur d'erreur foncée, pour les actions importantes

Catégories de voyage

Champ	Défaut	Usage
`Catégorie Hébergement`	Couleur hébergement	Hôtels, B&B, etc.
`Catégorie Transport`	Couleur transports	Vols, trains, etc.
`Catégorie Nourriture`	Couleur restauration	Restaurants, etc.
`Catégorie Activités`	Couleur activités	Tours, excursions
`Catégorie Autre`	Couleur autre	Dépenses non classables

États des voyages

Champ	Usage
`Couleur Statut À Venir`	Badge « À venir »
`Couleur Statut En Cours`	Badge « En cours »
`Couleur Statut Terminé`	Badge « Terminé »

Divers

Champ	Usage
`Couleur de Bordure`	Bordure standard pour cartes et champs
`Couleur de Bordure Claire`	Bordure légère pour séparations fines
`Couleur de Séparateur`	Lignes de séparation entre sections
`Couleur d'Icône Secondaire`	Icônes décoratives secondaires
`Fond d'Overlay`	Fond d'overlay foncé (popup, dialogue)
`Texte d'Overlay`	Texte sur fond d'overlay foncé
`Couleur d'Ombre`	Couleur de base des ombres (généralement #000000)
`Opacité de l'Ombre`0.0-1.0	Transparence des ombres
`Texte sur Principal`	Texte/icônes au-dessus de la couleur primary
`Texte sur Secondaire`	Texte/icônes au-dessus de la couleur secondary
`Texte sur Surface`	Texte/icônes au-dessus de la couleur surface
`Texte sur Erreur`	Texte/icônes au-dessus de la couleur error

app

Les informations de base : nom, version et identité de l'application.

Champ	Défaut	Rôle
`Nom de l'App`Texte	Horizon	Le nom de votre application affiché aux utilisateurs : apparaît dans le titre, la barre et partout dans l'application.
`Version de l'App`Texte	1.0.0	Numéro de version (référence interne).
`Texte « Powered By »`Texte	powered by travelinfluencer.co	Texte « powered by » en bas de la page d'info. Visible uniquement si « Afficher powered by » est activé.
`Texte du Bouton IA`Texte	HorizonAI	Le nom de votre assistant IA : apparaît dans la barre et l'écran IA. Pour modifier l'identité, rendez-vous dans la section ai.

links

Tous les liens et pages liés à votre application.

Champ	Type	Rôle
`Lien du Site Web`	URL	Lien vers votre site web, Horizon Studio ou réseaux sociaux (si l'embed est possible) : affiché sous forme de bouton « Explorer » dans la page d'info. Note : le lien vers votre site web personnalisé est disponible uniquement avec le plan Pro.
`Lien Politique de Confidentialité`	URL	Lien vers la page Politique de confidentialité.
`Lien Conditions Générales`	URL	Lien vers la page Conditions générales.
`Lien Popup Promo`	URL	URL de la page affichée dans le popup promotionnel. Apparaît X secondes après l'ouverture. La page doit autoriser son intégration dans un iframe (en-tête X-Frame-Options / CSP frame-ancestors) : certains sites tiers bloquent l'intégration et ne s'affichent pas.
`Image d'En-tête Info`	URL	Image d'en-tête en haut de la page d'info. Largeur recommandée : 1200px+. Comment insérer l'image d'en-tête : téléversez une image depuis votre profil et copiez l'URL générée, ou collez directement l'URL d'une image en ligne. Si les images ne se chargent pas, consultez la section Correctif CORS.

services · socialLinks

Les services affichés dans la barre de navigation (bottom bar) et les liens sociaux dans le menu latéral (drawer) de l'application.

📌

Maximum 5 services actifs dans la barre de navigation. Le nombre de services disponibles dépend du plan. Seuls les 5 premiers services avec le toggle activé apparaîtront dans la barre du bas.

Services disponibles

Pour chaque service, insérez le lien d'affiliation et utilisez le toggle pour l'activer ou le désactiver. Le nombre de services disponibles dépend du plan.

Icône	Nom du service	Que mettre dans le champ URL
✈️	Vols	Lien affilié pour la recherche de vols
🏨	Hôtels	Lien affilié pour la réservation d'hôtel
🏡	Maisons de vacances	Lien affilié pour locations de vacances et appartements
📦	Packages	Lien affilié pour les packs vacances (vol + hôtel)
🚗	Voitures	Lien affilié pour la location de voiture
🛡️	Assurance	Lien affilié pour l'assurance voyage
📱	eSIM	Lien affilié pour les cartes SIM virtuelles
🗺️	Visites	Lien affilié pour les tours, billets de musées et activités
🚢	Croisières	Lien affilié pour les croisières
🧳	Consigne à bagages	Lien affilié pour la consigne à bagages
🚂	Trains	Lien affilié pour les billets de train
🚌	Bus	Lien affilié pour les billets de bus
⛴️	Ferrys	Lien affilié pour les ferries
🚕	Taxi	Lien affilié pour la réservation de taxi
🛺	Transfert aéroport	Lien affilié pour les transferts depuis/vers l'aéroport
🔒	VPN	Lien affilié pour les services VPN
🍽️	Restaurants	Lien affilié pour la réservation de restaurants
⛷️	Location d'équipement	Lien affilié pour la location de matériel sportif
🛥️	Yachts	Lien affilié pour la location de yachts et bateaux
🚐	Camping-car	Lien affilié pour la location de camping-cars et RV
📋	Réserver	Lien vers la page de réservation générique
🛍️	Acheter	Lien vers la page d'achat
🚲	Vélo	Lien affilié pour la location de vélos
🏍️	Moto	Lien affilié pour la location de motos
🔑	Louer Maintenant	Lien affilié pour la location générique
🏷️	Offres	Lien affilié pour offres et réductions
💆	Spa	Lien affilié pour spa et centres de bien-être
🎫	Événements	Lien affilié pour billets d'événements, concerts et spectacles
🛎️	Conciergerie	Lien pour le service conciergerie et assistance personnalisée
👥	Voyages en Groupe	Lien affilié pour voyages en groupe et circuits organisés
🍴	Menu	Lien vers le menu
🛒	Boutique	Lien vers la boutique
💬	WhatsApp	Écrivez `whatsapp` : ouvre une discussion avec le numéro défini dans Entreprise
✉️	E-mail	Écrivez `email` : ouvre le client de messagerie avec l'adresse de l'entreprise
📞	Téléphone	Écrivez `phone` : ouvre le composeur avec le numéro de l'entreprise

💬

URL spéciaux : Pour WhatsApp, Email et Téléphone, utilisez respectivement whatsapp, email, phone comme URL : l'application ouvrira automatiquement la bonne application. Les informations de contact de ces champs sont définies dans la section « business ».

Plateformes sociales (visibles dans le menu latéral de l'application)

Icône	Plateforme	Que mettre dans le champ URL
▶️	YouTube	URL de la chaîne YouTube, ex. `https://youtube.com/@votrechaine`
🎵	TikTok	URL du profil TikTok, ex. `https://tiktok.com/@votreprofil`
📸	Instagram	URL du profil Instagram, ex. `https://instagram.com/votreprofil`
👍	Facebook	URL de la page Facebook, ex. `https://facebook.com/votrepage`
🐦	X (Twitter)	URL du profil X, ex. `https://x.com/votreprofil`
💼	LinkedIn	URL de la page ou du profil LinkedIn, ex. `https://linkedin.com/company/votre-entreprise`
📌	Pinterest	URL du profil ou du board Pinterest, ex. `https://pinterest.com/votreprofil`
🎧	Spotify	URL du profil ou de la playlist Spotify, ex. `https://open.spotify.com/user/votreprofil`
🎶	Apple Music	URL du profil Apple Music, ex. `https://music.apple.com/votreprofil`
☁️	SoundCloud	URL du profil SoundCloud, ex. `https://soundcloud.com/votreprofil`
📦	Amazon	URL de la boutique ou du storefront Amazon, ex. `https://amazon.com/shop/votreprofil`
🎬	Vimeo	URL du profil Vimeo, ex. `https://vimeo.com/votreprofil`

ai

Configurez le comportement de votre assistant IA intégré. Le modèle utilisé est LFM de Liquid AI, exécuté entièrement sur l'appareil : aucune donnée n'est envoyée à des serveurs externes.

Champ	Défaut	Rôle
`Température IA`0.0-1.0	0.2	Degré de créativité de l'IA. 0 = précis et répétitif, 1 = créatif et variable. Recommandé : 0.1-0.35.
`Prompt Système IA`Texte	-	Les instructions qui définissent le comportement de votre IA. Vous pouvez structurer le prompt avec des balises XML et utiliser ces placeholders spéciaux : `<identity>` = identité et rôle de l'assistant `<rules>` = règles et contraintes du comportement `<context>` = contexte dynamique (voyages et liens) `<user_trips>` = liste des voyages de l'utilisateur `<app_links>` = liens des services actifs

ui

Contrôle l'aspect visuel de l'interface : barre de navigation, icônes, ombres et plus encore.

Champ	Défaut	Rôle
`Barre Inférieure Île`Oui/Non	false	Style de la barre de navigation : activé = barre flottante « île » aux bords arrondis, désactivé = barre classique collée au bord.
`Libellés Barre Inférieure`Oui/Non	true	Affiche le texte sous les icônes dans la barre. Désactivé = icônes uniquement.
`Afficher IA`Oui/Non	true	Affiche le bouton de l'assistant IA dans la barre.
`Afficher Mes Voyages`Oui/Non	true	Affiche l'onglet « Mes Voyages » dans la barre.
`Forme de l'Indicateur`Texte	Circle	La forme de l'animation de chargement. Voir tous les styles disponibles ↓

Afficher les paramètres graphiques avancés

Champ	Défaut	Rôle
`Surbrillance Icônes`Oui/Non	false	Ajoute un fond coloré derrière l'icône active dans la barre.
`Afficher « Powered By »`Oui/Non	true	Affiche le texte « powered by » en bas de la page d'info.
`Carte Info Business`Oui/Non	true	Affiche la carte avec les informations de l'entreprise dans la page d'info.
`Icônes Contour`Oui/Non	true	Style des icônes : activé = contour uniquement, désactivé = pleines.
`Bordures des Champs`Oui/Non	false	Affiche la bordure des champs de saisie. Activé = champs avec bordure visible, désactivé = champs sans bordure.
`Afficher Popup Promo`Oui/Non	true	Active le popup promotionnel après X secondes.
`Délai Popup (s)`Nombre	15	Secondes d'attente avant d'afficher le popup.
`Rayon des Boutons`Pixels	30.0	Bords arrondis des boutons. 0 = carrés, 30+ = très arrondis.
`Rayon des Cartes`Pixels	30.0	Bords arrondis des cartes. Même principe que buttonRadius.
`Élévation`0.0+	5.0	Intensité de l'ombre sur les cartes et les éléments flottants. 0 = aucune ombre.

redirect

L'animation de transition lorsque l'application ouvre un lien externe.

Champ	Défaut	Rôle
`Overlay de Redirection`Oui/Non	true	Affiche un overlay foncé de transition avant d'ouvrir les liens externes.
`Durée Overlay (ms)`ms	800	Durée de l'overlay en millisecondes. Valeurs typiques : 500-1500.

business

Les informations de l'entreprise affichées dans la page d'info de votre application.

Champ	Type	Rôle
`Numéro WhatsApp`Texte	Numéro WhatsApp	Numéro pour un contact rapide. Format international : `+39123456789`
`E-mail`E-mail	E-mail de contact	L'e-mail où les clients peuvent vous joindre.
`Numéro de Téléphone`Texte	Téléphone	Numéro de téléphone. Format international : `+39123456789`
`Description À Propos`Texte	Texte libre	La description « Qui sommes-nous » de votre activité.
`Adresse`Texte	Adresse	L'adresse légale de votre entreprise.
`N° TVA`Texte	P. IVA	Numéro de TVA / VAT number.
`Horaires d'Ouverture`Texte	Horaires	Les horaires d'ouverture de votre activité.

network

Comment votre application se présente au reste du web.

Champ	Défaut	Rôle
`User Agent`Texte	-	Le « nom » sous lequel votre application se présente aux sites web. Format recommandé : `NomApp/1.0 (email@exemple.com)`
`Devise par Défaut`Texte	EUR	Devise par défaut pour les voyages. Code ISO : EUR, USD, GBP, JPY, etc.

map (avancées)

La plupart des utilisateurs n'ont pas besoin de modifier ces paramètres. La carte utilise OpenStreetMap.

Champ	Défaut	Rôle
`Latitude par Défaut`Nombre	41.9028	Latitude du centre de la carte à l'ouverture (défaut : Rome).
`Longitude par Défaut`Nombre	12.4964	Longitude du centre de la carte à l'ouverture (défaut : Rome).
`Zoom Initial`Nombre	3.0	Zoom initial. Valeurs basses = vue continent, élevées = vue rue.
`Zoom Lieu Sélectionné`Nombre	5.0	Zoom lorsque vous sélectionnez une position dans la liste.
`Taille du Marqueur`Pixels	40.0	Taille des marqueurs sur la carte.
`Largeur Ligne d'Itinéraire`Pixels	3.0	Épaisseur de la ligne reliant les points du trajet.
`Zoom de Sélection`Nombre	15.0	Zoom pour la sélection précise d'une adresse.

💡

Rappel : vous disposez toujours du bouton Reset pour revenir aux valeurs par défaut ! Vous ne pouvez rien « casser » : tout revient comme avant en un clic.

Guide des polices

Les polices de votre application sont chargées depuis Google Fonts. Utilisez le nom exact tel qu'il apparaît sur Google Fonts : une seule lettre différente et la police ne se chargera pas.

⚠️

Attention : Le nom doit correspondre exactement à celui sur Google Fonts, espaces et majuscules inclus. Si la police n'existe pas, la police système sera utilisée.

Les deux champs de police

Champ	Contrôle
`Police de texte`	La police pour tout le texte de l'application : paragraphes, descriptions, listes, boutons. Généralement une police simple et lisible.
`Police des Titres`	La police pour les titres : AppBar, titres de section, logo. Généralement une police plus décorative ou en gras.

Polices populaires : cliquez pour voir sur Google Fonts

Sora

Moderne et géométrique. Idéale pour les titres.

Onest

Épurée et lisible. Parfaite pour le corps de texte.

Inter

La police la plus utilisée pour les interfaces numériques.

Poppins

Géométrique et amicale. Très populaire.

Montserrat

Élégante et polyvalente. Idéale pour la marque.

Lato

Classique et professionnelle. Bonne lisibilité.

Roboto

La police d'Android. Familier pour tous.

Open Sans

Neutre et très lisible. Un grand classique.

Playfair Display

Élégante avec empattements. Parfaite pour les titres luxueux.

Nunito

Douce et arrondie. Amicale.

Raleway

Fine et élégante. Très stylée.

Quicksand

Arrondie et ludique. Pour un look décontracté.

🔍

Vous ne trouvez pas la police que vous cherchez ? Visitez fonts.google.com : plus de 1500 polices gratuites. N'oubliez pas de copier le nom exact !

Indicateurs de chargement

Choisissez l'animation de chargement pour votre application. Chaque style a un nom : insérez-le dans le champ Forme de l'Indicateur de la section ui.

Circle

Défaut

FadingCircle

ThreeBounce

DoubleBounce

Wave

Pulse

RotatingCircle

FadingFour

DualRing

HourGlass

PouringHourGlass

PouringHourGlassRefined

Ripple

DancingSquare

CubeGrid

Ring

SpinningCircle

ChasingDots

ThreeInOut

FoldingCube

PumpingHeart

WanderingCubes

FadingGrid

SpinningLines

SquareCircle

PianoWave

RotatingPlain

FadingCube

WaveSpinner

PulsingGrid

📝

Comment l'utiliser : Choisissez l'animation que vous préférez et insérez le nom exact (comme affiché ci-dessus) dans le champ Forme de l'Indicateur de la section ui.

📱 Comment installer l'application

Votre application est une PWA (Progressive Web App) : elle ne se télécharge pas depuis l'App Store ou le Google Play Store, mais s'installe directement depuis le navigateur. Elle est rapide, légère et fonctionne comme une application native. Suivez la procédure correspondant à votre appareil.

🤖 Android (Chrome)

Pour installer l'application sur un appareil Android, utilisez le navigateur Google Chrome.

Ouvrez Chrome sur votre téléphone Android.

Ouvrez votre application dans le navigateur — accédez à l'adresse de votre application.

Touchez le menu en appuyant sur l'icône ⋯ (trois points verticaux) en haut à droite de l'écran.

Sélectionnez « Ajouter à l'écran d'accueil » ou « Installer l'application » dans le menu déroulant.

Confirmez en appuyant sur « Ajouter » ou « Installer » dans la fenêtre de confirmation.

C'est fait ! L'icône de l'application apparaîtra sur votre écran d'accueil. Vous pouvez maintenant l'ouvrir comme n'importe quelle autre application.

💡

Astuce : Sur certains appareils Android, vous pouvez voir une bannière automatique en bas qui vous invite à installer l'application. Dans ce cas, touchez simplement « Installer » directement depuis la bannière.

🍎 iPhone et iPad (Safari)

Pour installer l'application sur iPhone ou iPad, utilisez le navigateur Safari (pas Chrome ou un autre navigateur).

Ouvrez Safari sur votre iPhone ou iPad.

Ouvrez votre application dans le navigateur — accédez à l'adresse de votre application.

Touchez l'icône Partage en appuyant sur ⬆️ (le carré avec la flèche pointant vers le haut) dans la barre inférieure.

Faites défiler le menu vers le bas et sélectionnez « Ajouter à l'écran d'accueil ».

Personnalisez le nom de l'application si vous le souhaitez, puis touchez « Ajouter » en haut à droite.

C'est fait ! L'icône de l'application apparaîtra sur votre écran d'accueil. Vous pouvez maintenant l'ouvrir comme n'importe quelle autre application.

⚠️

Important : Sur iOS, l'installation de la PWA fonctionne uniquement depuis Safari. Si vous utilisez Chrome, Firefox ou un autre navigateur sur iPhone, l'option « Ajouter à l'écran d'accueil » ne sera pas disponible. Ouvrez le lien dans Safari.

🖥️ Desktop (Chrome, Edge, Brave)

Vous pouvez également installer l'application sur votre ordinateur, avec Google Chrome, Microsoft Edge ou Brave.

Ouvrez le navigateur (Chrome, Edge ou Brave) sur votre ordinateur.

Ouvrez votre application dans le navigateur — accédez à l'adresse de votre application.

Recherchez l'icône d'installation dans la barre d'adresse : une icône ⊕ (symbole d'installation) ou le menu ⋯ (trois points) en haut à droite.

Cliquez sur « Installer l'application » ou « Installer Travelinfluencer » dans le menu.

Confirmez en cliquant sur « Installer » dans la boîte de dialogue.

C'est fait ! L'application s'ouvrira dans une fenêtre dédiée sans barre d'adresse, et vous trouverez l'icône sur le bureau ou dans le menu des applications.

💡

Astuce : Sur Chrome et Edge, vous pouvez voir directement une icône ⊕ dans la barre d'adresse lorsque la PWA est détectée. Cliquez dessus pour une installation rapide en un clic.

✨

Pourquoi installer l'application ? Une fois installée, l'application s'ouvrira en plein écran sans la barre du navigateur, comme une application native. Vous bénéficierez d'un accès plus rapide, d'une expérience plus fluide et de l'icône toujours à portée de main sur votre écran d'accueil.

Problèmes courants

Vous rencontrez un problème ? La solution se trouve probablement ci-dessous. Les modifications peuvent mettre quelques minutes à être visibles dans l'application. Et rappelez-vous : vous disposez toujours du bouton Reset pour revenir aux valeurs d'origine !

J'ai modifié un champ mais je ne vois pas le changement

Si un champ est laissé vide ou supprimé, le système charge automatiquement la valeur par défaut. Cela signifie que votre modification n'a peut-être pas été enregistrée correctement.

✅

Que faire : Assurez-vous que le champ est rempli avec une valeur valide. Si le champ est vide, le système utilisera la valeur par défaut : ce n'est pas une erreur, c'est par conception !

💡

Astuce : Après avoir rempli le champ, n'oubliez pas d'enregistrer les modifications, puis rechargez la page pour vérifier.

La couleur que j'ai saisie ne fonctionne pas

Les couleurs doivent être au format HEX à 6 chiffres, avec le symbole # au début.

Format	Exemple	Fonctionne ?
HEX 6 chiffres	`#00519C`	✅ Oui
Sans #	`00519C`	❌ Non
Nom de couleur	`red`	❌ Non
RGB	`rgb(0,81,156)`	❌ Non

🎨

Besoin d'inspiration ? Utilisez un sélecteur de couleurs en ligne comme ColorHunt pour trouver des palettes harmonieuses, puis copiez le code HEX.

La police ne change pas

Le nom de la police doit correspondre exactement à celui sur Google Fonts, majuscules, minuscules et espaces compris. Si le nom est incorrect, la police système sera utilisée.

Nom saisi	Correct ?
`Poppins`	✅ Oui
`poppins`	❌ Majuscule manquante
`Playfair Display`	✅ Oui (avec espace)
`Playfairdisplay`	❌ Espace manquant

🔗

Polices disponibles : Vous pouvez utiliser n'importe quelle police sur Google Fonts (plus de 1500 gratuites). Copiez le nom exact depuis la page de la police.

L'URL d'un service ne s'ouvre pas

Les URL des services doivent être complets et sécurisés. Voici les règles :

✅

URL correct : Il doit commencer par https://, exemple : https://flights.travelinfluencer.co

❌

URL non sécurisé : Les URL commençant par http:// (sans le « s ») ne sont pas chargés pour des raisons de sécurité.

💬

URL spéciaux : Pour WhatsApp, Email et Téléphone, utilisez simplement whatsapp, email ou phone : pas de https, ils sont gérés automatiquement !

J'ai activé un service mais je ne le vois pas dans la barre

La barre de navigation affiche au maximum 5 services actifs. Si vous en avez activé davantage, seuls les 5 premiers apparaîtront dans la barre.

📌

Limite : 5 services. Si vous avez 6 services ou plus avec le toggle activé, le sixième et les suivants ne seront pas visibles. Désactivez les services moins importants pour laisser de la place à ceux que vous voulez afficher.

🔢

Ordre de priorité : Les services sont affichés dans l'ordre où ils apparaissent dans la liste. Les 5 premiers activés gagnent. Les autres restent disponibles mais masqués de la barre.

J'ai téléversé une image dans le profil mais je ne la vois pas dans l'application

Lorsque vous téléversez une image depuis votre profil (logo ou image de couverture), le système génère un lien URL pour cette image. Vous devez copier cet URL et le coller dans le champ correct de la configuration.

📋

Comment faire : Dans votre profil, après avoir téléversé l'image, utilisez le bouton dédié pour copier l'URL de l'image. Ensuite, revenez dans la configuration et collez-le dans le champ logoUrl (pour le logo) ou infoHeaderImageUrl (pour l'image de couverture).

⚠️

Important : L'image n'est pas liée automatiquement : vous devez copier l'URL manuellement. Sans l'URL dans le champ, l'application continuera d'afficher l'image par défaut.

Je veux revenir au sous-domaine après avoir utilisé un domaine personnalisé

Le passage d'un domaine personnalisé à un sous-domaine standard est possible, mais entraîne la perte complète des données associées à votre application.

🔴

Pourquoi ? Le domaine personnalisé est intégré à la configuration interne (sessions, certificats SSL). La rétrogradation nécessite une restructuration de l'environnement qui rend les données existantes incompatibles.

⚠️

Avant de procéder : Sauvegardez tous les paramètres et contenus dont vous avez besoin. Après la rétrogradation, la configuration de l'application, les paramètres personnalisés et les contenus associés au domaine seront définitivement perdus. L'opération est irréversible.

Le site ou l'application ne sont pas accessibles

Si vous n'arrivez pas à accéder au site, à l'application ou à Horizon Studio, une intervention de maintenance programmée ou exceptionnelle est peut-être en cours.

🔧

Maintenance programmée : Les maintenances programmées sont annoncées à l'avance par e-mail ou via un avis sur la plateforme. Si vous avez reçu une notification, attendez le délai indiqué et réessayez.

⚡

Maintenance exceptionnelle : En cas d'urgences techniques ou de problèmes de sécurité, le service peut être temporairement suspendu sans préavis. L'équipe travaille à le rétablir au plus vite.

✅

Que faire : Vérifiez votre connexion internet. Si la connexion fonctionne, attendez quelques minutes et rechargez la page. Si le problème persiste plus de 30 minutes, contactez le support.

L'application ne fonctionne pas correctement en navigation privée

Si vous utilisez le navigateur en mode incognito, InPrivate ou navigation privée, de nombreuses fonctionnalités de l'application peuvent ne pas fonctionner correctement. Cela est dû aux restrictions que les navigateurs appliquent dans ce mode.

⚠️

Fonctionnalités limitées : En navigation privée, le navigateur bloque de nombreuses API de stockage. Cela signifie que le téléchargement du modèle IA (HorizonAI) peut ne pas fonctionner, les données de « Mes Voyages » (documents et itinéraires) ne seront pas enregistrées de manière permanente, et les préférences et la configuration ne seront pas conservées.

💡

Pourquoi cela arrive : Les navigateurs en mode privé limitent l'accès à certaines fonctionnalités de stockage pour protéger la vie privée. L'application a besoin de ces technologies pour fonctionner correctement.

✅

Solution : Ouvrez une fenêtre de navigation normale (non privée) dans votre navigateur et accédez à l'application depuis là. Toutes les fonctionnalités seront disponibles et vos données seront enregistrées correctement.

Mon site n'a pas de navigation ni d'animations dans l'application

Si votre site s'affiche dans l'application mais que la navigation semble limitée ou que les animations ne fonctionnent pas, il manque peut-être le script d'intégration dans la section <head> de votre site.

📋

Que faire : Ajoutez ce script avant la fermeture de la balise </head> de votre site :

html

<script src="https://scripts.travelinfluencer.co/horizon-webview-helper.js" data-horizon-webview async></script>

✅

Détails : Ce script active la navigation optimisée, les animations fluides et d'autres fonctionnalités avancées lorsque votre site est ouvert dans l'application. Il est léger, asynchrone et n'affecte pas les performances du site. Voir la section Intégration Site → Étape 3 pour plus de détails.

L'application plante après avoir téléchargé l'IA

Si l'application se ferme soudainement ou se bloque après le téléchargement du modèle IA (HorizonAI), le problème est dû à des ressources insuffisantes sur votre appareil.

⚠️

Pourquoi cela arrive : HorizonAI exécute le modèle IA localement sur l'appareil. Cela nécessite une quantité significative de RAM et de puissance de calcul. Si votre téléphone dispose de peu de mémoire disponible ou d'un processeur ancien, le système ne parvient pas à gérer le modèle et l'application plante.

💡

Que faire : Essayez de fermer toutes les autres applications en arrière-plan pour libérer de la mémoire, puis rouvrez l'application. Si le problème persiste, votre appareil ne dispose peut-être pas des ressources matérielles minimales nécessaires pour exécuter l'IA. Dans ce cas, vous pouvez désactiver l'IA depuis la configuration (définissez showAI sur false) : toutes les autres fonctionnalités de l'application continueront de fonctionner normalement.

🛡️

Vous ne pouvez rien casser ! Vous disposez toujours du bouton Reset pour revenir aux valeurs par défaut en un clic. Si quelque chose ne fonctionne pas comme prévu, utilisez Reset et recommencez : c'est fait pour ça ! Si le problème persiste même après le reset, contactez le support.

Suppression de compte

Si vous souhaitez fermer votre compte et supprimer toutes vos données, suivez attentivement cette procédure. L'opération est irréversible : lisez bien chaque étape avant de procéder.

Étape 1. Annulez votre abonnement

Avant de pouvoir fermer le compte, vous devez annuler votre abonnement actif. Il n'est pas possible de supprimer le compte si vous avez un plan en cours.

⚠️

Attention : L'annulation de l'abonnement ne supprime pas immédiatement votre compte. Votre abonnement restera actif jusqu'à la date d'expiration naturelle de la période déjà payée.

💳

Suspension ou paiement invalide : Si votre abonnement est suspendu pour défaut de paiement, carte expirée ou moyen de paiement invalide, la même procédure identique s'applique : après l'expiration de l'abonnement, votre compte entre automatiquement dans la période de grâce de 30 jours puis est définitivement supprimé. Vous recevrez des e-mails de notification avant que cela n'arrive.

Étape 2. Période de grâce (30 jours)

Une fois l'abonnement expiré, votre compte entre dans une période de grâce de 30 jours. Pendant cette période :

💡

Vous pouvez encore réactiver : Si vous changez d'avis, vous pouvez réactiver votre abonnement à tout moment pendant les 30 jours et retrouver tout exactement comme vous l'aviez laissé : configuration, données et paramètres seront intacts.

🔒

Vos données sont en sécurité : Pendant la période de grâce, toutes vos données sont conservées et protégées. Aucune information n'est supprimée à ce stade.

💡 Alternative : Passez au plan Starter

Si vous ne voulez pas perdre votre compte mais ne souhaitez pas d'abonnement coûteux, vous pouvez passer au plan Starter, le plan de base à coût réduit. Cela vous permet de :

✅ Préserver votre compte et les données du profil
✅ Conserver l'accès à la plateforme
✅ Éviter la suppression automatique pour inactivité ou absence d'abonnement

⚠️

Attention — Configuration de l'application perdue : Le passage au plan Starter est une rétrogradation et entraîne la suppression et recréation du dossier de configuration de l'application. Toutes les configurations personnalisées précédentes (mise en page, contenus, paramètres, intégrations) seront définitivement perdues. Nous vous conseillons de sauvegarder vos configurations avant d'effectuer la rétrogradation.

Étape 3. Suppression définitive

À l'issue des 30 jours de grâce, toutes vos données seront supprimées automatiquement et de manière permanente. Cela inclut :

Configuration de l'application et paramètres personnalisés
Données du profil et informations de l'entreprise
Images téléversées (logo, couverture)
Historique et statistiques d'utilisation
Toute autre donnée associée à votre compte

🔴

Irréversible : Cette opération est permanente et non réversible. Elle s'applique dans tous les cas : annulation volontaire de l'abonnement, suspension pour défaut de paiement, carte expirée ou moyen de paiement invalide. Une fois supprimées, les données ne pourront être récupérées d'aucune manière. Si vous pensez pouvoir revenir à l'avenir, nous vous conseillons de passer au plan Starter pour préserver votre compte (gardez à l'esprit que la configuration de l'application sera perdue).

💬

Vous avez des doutes ? Si vous avez des questions sur la suppression ou souhaitez de l'aide, contactez le support. Nous sommes là pour vous aider.