¿Qué te está pareciendo la app?
Tu opinión nos ayuda a mejorarla.
¡Gracias!
Nos alegra que te guste. ¿Nos dejas una reseña en la tienda?
¿Qué podemos mejorar?
Demande de note de l'appli
Une fenêtre qui demande des étoiles : quatre ou cinq remercient avec des confettis, moins demandent quoi améliorer.
Réglages
Code
<div class="uv-orr"><div class="pg" aria-hidden="true"><i class="h"></i><i></i><i></i><i></i><i></i><i class="s"></i></div><button type="button" class="fire">Noter</button><div class="scr"></div><div class="dl" role="dialog" aria-modal="true" aria-labelledby="uv-orr-t"><div class="v1"><span class="ap" aria-hidden="true"></span><p class="ti" id="uv-orr-t">Comment trouves-tu l’appli ?</p><p class="ds">Ton avis nous aide à l’améliorer.</p><div class="st" role="radiogroup" aria-label="Note"><button type="button" role="radio" aria-checked="false" aria-label="1 sur 5" style="--i:0"><svg viewBox="0 0 24 24" aria-hidden="true"><path d="M12 2.8l2.75 5.6 6.15.9-4.45 4.33 1.05 6.12L12 16.87l-5.5 2.88 1.05-6.12L3.1 9.3l6.15-.9z"/></svg></button><button type="button" role="radio" aria-checked="false" aria-label="2 sur 5" style="--i:1"><svg viewBox="0 0 24 24" aria-hidden="true"><path d="M12 2.8l2.75 5.6 6.15.9-4.45 4.33 1.05 6.12L12 16.87l-5.5 2.88 1.05-6.12L3.1 9.3l6.15-.9z"/></svg></button><button type="button" role="radio" aria-checked="false" aria-label="3 sur 5" style="--i:2"><svg viewBox="0 0 24 24" aria-hidden="true"><path d="M12 2.8l2.75 5.6 6.15.9-4.45 4.33 1.05 6.12L12 16.87l-5.5 2.88 1.05-6.12L3.1 9.3l6.15-.9z"/></svg></button><button type="button" role="radio" aria-checked="false" aria-label="4 sur 5" style="--i:3"><svg viewBox="0 0 24 24" aria-hidden="true"><path d="M12 2.8l2.75 5.6 6.15.9-4.45 4.33 1.05 6.12L12 16.87l-5.5 2.88 1.05-6.12L3.1 9.3l6.15-.9z"/></svg></button><button type="button" role="radio" aria-checked="false" aria-label="5 sur 5" style="--i:4"><svg viewBox="0 0 24 24" aria-hidden="true"><path d="M12 2.8l2.75 5.6 6.15.9-4.45 4.33 1.05 6.12L12 16.87l-5.5 2.88 1.05-6.12L3.1 9.3l6.15-.9z"/></svg></button></div><button type="button" class="lt">Plus tard</button></div><div class="v2"><span class="cf" aria-hidden="true"><b style="--a:0deg;--c:#f59e0b"></b><b style="--a:26deg;--c:#ec4899"></b><b style="--a:52deg;--c:#22c55e"></b><b style="--a:78deg;--c:#3b82f6"></b><b style="--a:104deg;--c:#f59e0b"></b><b style="--a:130deg;--c:#ec4899"></b><b style="--a:156deg;--c:#22c55e"></b><b style="--a:182deg;--c:#3b82f6"></b><b style="--a:208deg;--c:#f59e0b"></b><b style="--a:234deg;--c:#ec4899"></b><b style="--a:260deg;--c:#22c55e"></b><b style="--a:286deg;--c:#3b82f6"></b><b style="--a:312deg;--c:#f59e0b"></b><b style="--a:338deg;--c:#ec4899"></b></span><p class="ti">Merci !</p><p class="ds">Ravis qu’elle te plaise. Tu nous laisses un avis sur la boutique ?</p><button type="button" class="go">Écrire un avis</button></div><div class="v3"><p class="ti">Que pouvons-nous améliorer ?</p><textarea rows="3" placeholder="Dis-nous ce qui te manque" aria-label="Ce que nous pouvons améliorer"></textarea><button type="button" class="go">Envoyer</button></div></div></div>Prompt pour l’IA
Collez-le dans ChatGPT, Claude ou Cursor : le bloc sera adapté à votre projet avec ces réglages, même sans React.
Plus dans Overlays
Voir tout : OverlaysOù l’utiliser
Demander un avis au bon moment aide la note sur la boutique, et orienter les mécontents vers un retour aide le produit. Cette fenêtre montre l'icône de l'appli et cinq étoiles qui se remplissent au survol ; quatre ou cinq étoiles affichent un remerciement avec confettis et un bouton pour écrire un avis, une à trois ouvrent une zone de commentaire.
Les étoiles sont des boutons bien étiquetés, Plus tard ferme sans insister et Échap fonctionne à chaque étape. Change la question avec le champ de texte.