Gå til hovedinnhold

Avansert: plasser chatboksen med JavaScript API

Styr plasseringen av chatboksen direkte i koden, med mulighet for ulike plasseringer på desktop og mobil.

Skrevet av Michal Jindra

Utviklere kan enkelt tilpasse hvor chatboksen vises ved å legge til noen ekstra innstillinger i Smartsupp-installasjonskoden. Her viser vi deg hvordan du kan plassere chatboksen til venstre, flytte den bort fra standardposisjonen og bruke en egen plassering på mobil.

Avansert: plassering i installasjonskoden

🟡 Merk: Du må ha utviklertilgang til nettsidens kode. For å plassere chatboksen til venstre trenger du Solo-pakken eller høyere.

Legg innstillingene inn i konfigurasjonsdelen av installasjonskoden: rett etter linjen med _smartsupp.key og før loaderen (delen som starter med window.smartsupp||). Chatboksen leser disse når den lastes inn, så de må ligge klart før loaderen kjører.

Plasser chatboksen til venstre:

<script>var _smartsupp = _smartsupp || {};_smartsupp.key = 'YOUR_SMARTSUPP_KEY';_smartsupp.orientation = "left";// ...resten av installasjonskoden (loaderen)</script>

Flytt chatboksen bort fra standardposisjonen (oppgi verdier i piksler):

_smartsupp.offsetX = 20;  // flytter den vekk fra siden_smartsupp.offsetY = 100; // flytter den opp fra bunnen

Bruk en annen plassering kun på mobil:

<script>var _smartsupp = _smartsupp || {};_smartsupp.key = 'YOUR_SMARTSUPP_KEY';if (window.innerWidth < 768) {  _smartsupp.offsetY = 150;}// ...resten av installasjonskoden (loaderen)</script>

Slik gjør du det:

  1. Åpne nettstedets kode og finn Smartsupp-installasjonsskriptet.

  2. Legg inn de innstillingene du ønsker rett etter linjen med _smartsupp.key, før loaderen starter.

  3. Juster verdiene så de passer utseendet på nettsiden din.

  4. Lagre endringene og last inn nettsiden din i et inkognito- eller privat vindu for å sjekke den nye plasseringen. Husk også å teste på mobil.

💡 Tips: Kommandoer som smartsupp('chat:position', ...) støttes ikke. Chatboksen ignorerer slike kommandoer og nettleserkonsollen din vil vise "Unknown API command". Vil du se alle mulige innstillinger? Sjekk utviklerdokumentasjonen.


Hva nå?

💡 Trenger du hjelp? Ta kontakt med vårt støtteteam – vi hjelper deg gjerne!

Svarte dette på spørsmålet?