A Hostinger Website Builderben van egy Custom code (egyéni kód) mező, amellyel külső szkripteket tehetsz az egész oldaladra, és a Yaplet widgetnek csak erre van szüksége. Beilleszted ide a Yaplet kódot, frissíted a weboldalad, és megjelenik a chat gomb az oldaladon. Fejlesztő nem kell hozzá.
A Hostinger súgója a szerkesztőt ma már Hostinger AI Builder (kézi mód, manual mode) néven említi. A menüpontokat angolul írjuk, ahogy a Hostinger angol nyelvű súgója mutatja, zárójelben a magyar jelentésükkel. Ha a szerkesztőd más nyelven jelenik meg, ugyanott keresd a megfelelő menüpontokat.
1. Másold ki a Yaplet kódodat
A Yaplet bal oldali menüjében menj a Márka → (a márkád) → Chat widget → Telepítés útvonalra. Ha a fül megkérdezi, min fut a weboldalad, válaszd a Más weboldal lehetőséget. Másold ki a kódot a kódblokk másolás gombjával.
Ha a kimásolt kód így kezdődik: !function (Yaplet, akkor még nincs körülötte <script> tag. A Hostinger Custom code mezője a HTML-tagek alapján rendezi el a kódot, ezért a 3. lépésben hozzáadod ezeket a tageket.
2. Nyisd meg az integrációs beállításokat
A szerkesztőben kattints a More (további) gombra (a ⋯ jelre), és válaszd az Integrations (integrációk) pontot.
3. Illeszd be a kódot a Custom code mezőbe
A Custom code (egyéni kód) mezőbe illeszd be a Yaplet kódot. A kódnak egy <script> sorral kell kezdődnie, és egy </script> sorral kell végződnie. Ha a kimásolt kód ehelyett így kezdődik: !function (Yaplet, írd elé egy új sorba, hogy <script>, utána pedig egy új sorba, hogy </script>. A kész kód így néz ki:
<script>
(a Yaplet kódod)
</script>Ha a mezőben már van más kód, a tiédet az alá illeszd be, sose egy másik kódrészlet közepébe. A Hostinger a <script> tagek közötti kódot minden oldal végére teszi.
4. Mentsd, és frissítsd a weboldalt
Mentsd a módosításokat, majd frissítsd (tedd közzé) a weboldaladat. A kód csak a frissítés után kerül fel az élő oldalra.
5. Nézd meg az oldaladat
Nyisd meg az élő oldaladat egy új böngészőfülön, és frissítsd. A Yaplet chat gombja megjelenik a jobb alsó sarokban. Kattints rá, és nézd meg, hogy megnyílik-e a chat.
A teljes ellenőrzőlistát itt találod: Telepítés ellenőrzése.
Ha nem jelenik meg a chat
- A szerkesztőben nézed. Az egyéni kód csak előnézet módban és az élő oldalon fut, a szerkesztőben nem.
- Nem frissítetted a weboldalt. A mentés önmagában nem elég. Frissítsd a weboldaladat, hogy az új kód felkerüljön az oldalaidra.
- Hiányoznak a
<script>tagek. Nézd meg, hogy a kód előtti sorban ott van-e a<script>, a kód utáni sorban pedig a</script>, majd mentsd és frissítsd újra a weboldalt. - A kód hozzáadása után elromlik az oldalad. Menj az Integrations → Custom code (Integrációk → Egyéni kód) részre, töröld az összes kódrészletet, és frissítsd a weboldalt. Utána egyenként tedd vissza őket, hogy kiderüljön, melyik okozza a hibát.
- Még mindig a régi oldalt látod. A böngésződ egy tárolt változatot mutathat. Frissítsd az oldalt, vagy nyisd meg egy privát ablakban.
Mi a következő lépés?
Ha meg szeretnéd tudni, mit csinál a kód, és hol találod a widget azonosítóját, olvasd el ezt: A Yaplet telepítése.