(PROMIUM FAQ insieme a PROMIUM FORM compone la soluzione completa per i contatti web mediati dalla AI,  PROMIUM WEB CONTACT)

Introduzione PROMIUM FAQ

Il sistema FAQ Promium offre un’interfaccia di ricerca intelligente e interattiva che può essere facilmente integrata nel tuo sito web. Il widget può presentarsi in due modalità: una barra di ricerca completa o un pulsante minimale che, quando attivato, si espande in un’interfaccia completa per la ricerca delle FAQ.

Caratteristiche principali:

  • Interfaccia responsive e adattiva con due modalità di visualizzazione (default/minimal)
  • Supporto per temi chiari e scuri con rilevamento automatico
  • Posizionamento flessibile (center, left, right)
  • Dimensioni personalizzabili (width/height)
  • Integrazione seamless con il tuo sito
  • Supporto per container specifici

⚠️ Posizionamento dello Script

Scenario 1: Utilizzo con data-target (Raccomandato)

Quando si utilizza l’attributo data-target, inserire lo script prima della chiusura del tag </body>:

<div id="faq-container"></div>

<!-- Posizionare prima della chiusura del body -->
<script 
    src="https://promium-embed.s3.amazonaws.com/promium_embed/faq_ui/faqexternal.js" 
    data-id="nome-azienda" 
    data-target="faq-container" 
    async defer></script>
</body>

Scenario 2: Utilizzo senza data-target

Inserire lo script direttamente nel punto del DOM dove si desidera che appaia il widget:

<div class="header">
    <!-- Altri elementi dell'header -->
    <script 
        src="https://promium-embed.s3.amazonaws.com/promium_embed/faq_ui/faqexternal.js" 
        data-id="nome-azienda" 
        data-mode="minimal" 
        async defer></script>
    <!-- Altri elementi dell'header -->
</div>

Opzioni di Configurazione

Il widget può essere personalizzato attraverso i seguenti attributi data:

Attributo Valori Default Descrizione
data-id stringa – Identificativo dell’azienda (obbligatorio)
data-mode “default” | “minimal” “default” Modalità di visualizzazione (barra completa/bottone)
data-theme “light” | “dark” “light” Tema dell’interfaccia
data-position “center” | “left” | “right” “center” Posizionamento della barra/bottone
data-target selettore CSS – Selettore dell’elemento dove inserire il widget
data-width CSS width “100%” Larghezza del widget (es: “400px”, “50%”)
data-height CSS height “90px” Altezza del widget (es: “60px”)

Esempi di Configurazione

1. Configurazione Base

<script src="https://promium-embed.s3.amazonaws.com/promium_embed/faq_ui/faqexternal.js" 
    data-id="i-tech" 
    async defer></script>

2. Modalità Minimal con Posizionamento

<script src="https://promium-embed.s3.amazonaws.com/promium_embed/faq_ui/faqexternal.js" 
    data-id="i-tech" 
    data-mode="minimal"
    data-position="right"
    data-width="150px"
    async defer></script>

3. Configurazione Completa

<div id="faq-container"></div>
<script src="https://promium-embed.s3.amazonaws.com/promium_embed/faq_ui/faqexternal.js" 
    data-id="i-tech" 
    data-mode="default"
    data-theme="dark"
    data-position="left"
    data-target="faq-container"
    data-width="500px"
    data-height="70px"
    async defer></script>

Modalità di Visualizzazione

Modalità Default

  • Mostra una barra di ricerca completa con input text
  • Include ombreggiatura e effetti hover
  • Ideale per pagine FAQ dedicate

Modalità Minimal

  • Mostra solo un bottone “Cerca” in stile minimal
  • Design pulito senza ombreggiature
  • Perfetto per header o sidebar

Risoluzione dei Problemi

Checklist di Verifica

  • Verifica che l’attributo data-id sia corretto e in minuscolo
  • Controlla la console del browser per eventuali errori
  • Se usi data-target, verifica che l’elemento esista
  • Assicurati che le dimensioni specificate siano valide

Debug Mode

Il widget include una modalità debug che fornisce informazioni dettagliate nella console del browser. Verifica i log contrassegnati con emoji per il tracciamento degli eventi:

  • 🔍 Ricerca elementi e selezione target
  • 📝 Lettura parametri di configurazione
  • ✅ Conferme di inizializzazione
  • ⚠️ Avvisi e problemi non critici
  • ❌ Errori che richiedono attenzione

Supporto Tecnico

Se hai bisogno di ulteriore aiuto, contattaci:

  • Email: assistenza@promiumai.com
  • Telefono: +39 379 158 2010