Att lägga till AI-Estimator i din kundupplevelse kan göras på två sätt: genom att bädda in ett självcitatverktyg direkt på din webbplats, eller genom att bjuda in kunder att logga in och få personliga offerter genom GelatoConnect. Den här guiden förklarar båda alternativen steg för steg.
Lägga till självcitatfunktionalitet på din webbplats
Du kan integrera AI-Estimator så att när användare klickar på din "Få en offert"-knapp öppnas en inbäddad iframe som visar offertverktyget. En exempelimplementation finns tillgänglig som referens.
Implementeringssteg
Knappdetektering
Lägg till klickhändelselyssnare till din befintliga "Begär offert"-knapp. Dessa bör förhindra standardnavigering och istället utlösa iframe-läget.Innehållsersättning
När iframe öppnas, dölj huvudsidans innehåll och sidfot medan rubriken förblir synlig. Detta kan uppnås med CSSdisplayellervisibilityegenskaper.Iframe-integration
Infoga en iframe i full bredd som laddar offert-URL:en som tillhandahålls av Gelato (https://printconnect.gelato.com/XX_XXX).Använd
height: calc(100vh - 80px)för att lämna utrymme för sidhuvudet (justera 80px baserat på ditt faktiska sidhuvuds höjd).Ställ in
width: 100%för att säkerställa att iframe täcker hela sidans bredd.
Stäng-knapp
Placera en flytande "Stäng"-knapp i det övre vänstra hörnet av iframe-området.Close
Konfigurera den för att dölja iframe:n, återställa det ursprungliga innehållet och återaktivera rullning när den klickas.
Rullningsförebyggande
Inaktivera rullning meddocument.body.style.overflow = 'hidden'när iframe är aktiv. Återställ den tillautonär den stängs.Tillståndshantering
Använd en boolesk flagga för att spåra om iframe:n är öppen eller stängd. Detta gör att du kan växla mellan den inbäddade vyn och din webbplats normala layout.
Viktiga CSS-stilar
height: calc(100vh - [header-height]px)för korrekt iframe-storlekwidth: 100%för fullbreddslayoutposition: fixedför stängknappenoverflow: hiddentillämpas på body när iframe är aktivVillkorlig dölj och visa av huvudinnehållet
Bjuda in kunder att få personliga offerter
Du kan också bjuda in kunder så att de får en inloggning för att själva begära offerter. Detta säkerställer att de får personlig prissättning enligt de prisregler du har ställt in för dem. Detta tar också bort behovet för dem att manuellt ange detaljer som namn eller e-post, och separerar förfrågningar från verifierade kunder
Se videodemo för instruktioner (24:28 – 29:28)
Så här fungerar det
Inloggade kunder behöver använda sidan direkt (inte som en iframe) eftersom det krävs för en säker upplevelse.
De kommer att få den länken via e-post när de bjuds in, och de kan också komma åt den på https://printconnect.gelato.com/XX_XXX/login.