Masquer les éléments propres au site
Bandeaux cookies, badges des stores, pop-ups de newsletter, navigation desktop, le badge « Edit with … » de l'outil. Une règle CSS pour chacun dans custom.css.
Les changements typiques réservés à l'app
Une mise en page d'app
Des zones tactiles plus grandes, des marges de safe area pour les barres fixes, une navigation en bas d'écran (ou le pied de navigation natif de WebViewGold), des titres de page masqués quand la barre de l'app les affiche déjà.
Changer le comportement
Réécrivez les liens externes pour qu'ils s'ouvrent dans le navigateur intégré, appelez successhaptic:// après l'envoi d'un formulaire, masquez le paiement web pour les biens numériques et affichez à la place le bouton d'achat intégré.
Prompt pour Replit
Collez ceci dans Replit pour implémenter la partie app web. Vérifiez le résultat, publiez, puis testez dans l'app WebViewGold.
Prompt à coller dans Replit Agent
Ajoutez la détection de l'app native et une interface propre à l'app. Côté serveur : lors de l'envoi de l'index.html du client, vérifiez si l'en-tête User-Agent contient "WebViewGold" et injectez un script qui définit window.__NATIVE_APP__ = true avant le chargement du bundle de l'app. Côté client : exportez isNativeApp(), qui lit window.__NATIVE_APP__ avec navigator.userAgent comme repli. Ajoutez data-web-only au header marketing, au footer, à l'avis sur les cookies et au badge « Made with », et ne les affichez pas dans l'app native. Dans l'app native, affichez une tab bar fixe en bas (Accueil, Recherche, Messages, Profil) avec padding-bottom: env(safe-area-inset-bottom) et masquez la navigation du haut ; ajoutez du padding en bas du contenu des pages. N'utilisez cet indicateur pour aucune décision de sécurité.
Excellent travail! Je n'ai jamais codé quoi que ce soit, mais j'ai réussi à travailler avec cela. Facile et rapide! Avec une grande aide des créateurs!
Deux façons de procéder avec Replit
Choisissez celle qui correspond à votre façon de travailler.
Option A : custom.css / custom.js dans WebViewGold
Modifiez les deux fichiers dans les projets Xcode et Android Studio (ou les champs du Cloud Builder). Ils sont injectés dans chaque page. Aucun déploiement de votre app web n'est nécessaire ; c'est un nouveau build de l'app qui livre le changement.
Option B : détecter l'app dans Replit
Définissez un user agent personnalisé dans Config.swift / Config.java (par exemple en ajoutant « WebViewGold »), ajoutez une classe sur le body de votre app web quand il est détecté, puis stylez les variantes
.in-appdans votre feuille de style habituelle. Les changements partent avec chaque publication, sans mise à jour de l'app.Combinez les deux
Utilisez la classe basée sur le user agent pour ce qui change souvent (navigation, promotions) et custom.css pour les nettoyages ponctuels d'éléments difficiles à modifier dans l'outil.
Vérifiez dans les conditions de la validation
Ouvrez l'app sur un iPhone et sur un téléphone Android, en portrait et en paysage, ainsi que sur un iPad : pas d'en-tête desktop, pas de défilement horizontal, rien sous l'encoche.
Un custom.css de départ
Adaptez les sélecteurs au balisage de Replit :
css
/* éléments propres au site web */
#cookie-banner, .newsletter-popup, .app-store-badges, #lovable-badge, a[href*="lovable.dev"] { display: none !important; }
/* navigation desktop et liens du pied de page */
header .desktop-nav, footer .link-columns { display: none !important; }
/* safe area pour les barres fixes */
.bottom-bar { padding-bottom: env(safe-area-inset-bottom); }
/* zones tactiles confortables */
button, .btn, a.nav-item { min-height: 44px; }Questions fréquentes
Le CSS personnalisé modifie-t-il mon site web ?
Non. Il n'est injecté que dans l'app. Les visiteurs dans Safari ou Chrome voient le site comme avant.
Puis-je injecter des bibliothèques JavaScript ?
Oui, custom.js s'exécute à chaque chargement de page dans l'app. Gardez-le léger et défensif : selon le framework, les pages de votre app peuvent se charger avant ou après votre script.
Faut-il publier une nouvelle version sur les stores pour modifier le CSS ?
Pour les changements dans custom.css, oui (le fichier est livré avec l'app). Si vous voulez des changements instantanés, utilisez plutôt la détection du user agent dans votre app web.
Trois façons de mettre votre app dans les stores
Même résultat, charge de travail différente de votre côté. Les trois formules incluent la garantie d'approbation et le support humain 24/7.
Faites-le vous-même
$109 par plateforme, paiement unique
La licence WebViewGold : un projet Xcode ou Android Studio prêt à l'emploi. Collez votre URL, définissez le nom et l'icône, activez les fonctionnalités, compilez et soumettez. Mises à jour gratuites à vie.
Voir les offres sur la page principaleCloud Builder
$349 par licence, extension en paiement unique
Ni Mac, ni Xcode, ni Android Studio : configurez dans le navigateur, nous compilons les deux apps dans le cloud et les transmettons à App Store Connect et à la Play Console.
Comment fonctionne le Cloud Builder Essayer la démo gratuiteFull Service
$698 par plateforme $798
Envoyez-nous votre URL et votre icône. Notre équipe configure, compile et livre votre app sous 72 heures, en marque blanche, projets sources inclus. Les deux plateformes pour $1,158.
Détails du Full Service Propulsé par
Prix Soldes d'hiver valables jusqu'au 31 décembre 2026.