AI WORLD HQHogyan adhatsz hozzá Alibaba Cloud AI chatbotot a WordPress oldaladhoz
Állíts be egy barátságos AI asszisztenst WordPress weboldaladon pár perc alatt, még akkor is, ha sosem kódoltál korábban.
Hook: Az útmutató végére lesz egy csevegőbuborékod, ami üdvözli a látogatókat, válaszol az alapvető kérdésekre, és működik WordPress oldalad minden lapján – programozási tapasztalat nélkül.
💡 Tipp: kattints egy lépés számára, ha kész vagy — zöld pipa jelenik meg, és a böngésződ megjegyzi, meddig jutottál.
- Alibaba Cloud fiók: regisztrálj az alibabacloud.com oldalon (az ingyenes szint elegendő egy egyszerű chatbot számára).
- WordPress oldal: szükséged lesz adminisztrátori hozzáférésre az irányítópulthoz.
- Webböngésző számítógépen vagy táblagépen (a Chrome, Edge vagy Firefox jól működnek).
- Néhány perc: a teljes folyamat általában 20-30 percet vesz igénybe.
- Opcionális: egy ingyenes bővítmény, például az „Insert Headers and Footers” megkönnyíti a kód hozzáadását.
Hozz létre egy új chatbot példányt
Nyisd meg a webböngésződet, menj a console.alibabacloud.com oldalra és jelentkezz be. A konzol jobb felső sarkában lévő keresősávba írd be, hogy „Chatbot”, majd nyomd meg az Entert; látni fogsz egy listát az AI szolgáltatásokról. Kattints a Create Robot gombra (vagy egy hasonlóra, mint a Create Instance). Megjelenik egy űrlap, amely nevet és rövid leírást kér. Miután beírtál egy nevet, például „FrontDeskHelper”, és rányomtál a Create gombra, a szolgáltatás létrehoz egy új botot, és megjeleníti egy táblázatban „Running” állapotban. Ha nem látsz „Create Robot” gombot, keress egy plusz alakú ikont vagy egy New Bot feliratú menüt.
Tudni fogod, hogy sikerült, amikor az új bejegyzés megjelenik a listában egy zöld pöttyel vagy a „Running” (fut) szóval.
Határozd meg a chatbot üdvözlőüzenetét
A botok listájában kattints az imént létrehozott bot nevére a beállítási oldal megnyitásához. A bal oldali menüben találsz egy szakaszt Greetings (üdvözletek) néven (néha Welcome Message – üdvözlőüzenet – felirattal). Belül van egy szövegmező, ahová beírhatod, amit a bot először mond a látogatóknak. Miután beírtál egy mondatot, például „Szia! Én vagyok a digitális asszisztensed – kérdezz a nyitvatartásról vagy a szolgáltatásokról!”, megjelenik az üzenet előnézete a mező alatt. Kattints a Save (mentés) gombra a változtatás tárolásához. Ha a menüben „Chat Prompt” szerepel a Greetings helyett, az ugyanaz a mező – csak keress egy nagyméretű szövegterületet.
Tudni fogod, hogy sikerült, amikor az előnézeti mező pontosan a beírt szöveget mutatja és megjelenik egy megerősítő felirat.
Válassz egy vizuális stílust, ami illeszkedik az oldaladhoz
Miközben még a bot beállításaiban vagy, válts az Appearance (megjelenés), Style (stílus) vagy Customization (testreszabás) fülre – a felirat változhat, de általában tartalmaz színpalettát és ikonfeltöltőt. Válassz egy színt, amely tükrözi az oldalad elsődleges árnyalatát (lemásolhatod a hexadecimális kódot, pl. #0066CC), és tölts fel egy kis logót (egy 100 × 100 pixeles PNG jól működik). A jobb oldali előnézet frissül, és megjelenít egy csevegőbuborékot a kiválasztott színben és a logóddal, mint digitális másolattal. Ha nem találsz színválasztót, keress egy fogaskerék ⚙️ ikont, ami megnyitja a „Theme Settings” (témabeállítások) részt.
Tudni fogod, hogy sikerült, amikor az előnézetben a képernyőn lévő buborék tükrözi a kiválasztott színt és ikont.
Másold ki a widget beágyazási kódját
Térj vissza a fő bot oldalra és nyomd meg a Publish (közzététel) vagy Deploy (telepítés) gombot – ezzel tudatod az Alibaba Clouddal, hogy a bot legyen nyilvánosan elérhető. Egy új panel fog előugrani, Embed Code (beágyazási kód), Web Widget (webes widget) vagy hasonló felirattal, amely tartalmaz egy kódrészletet, ami <script src="..."></script>-tel kezdődik. Kattints a Copy (másolás) gombra a mező mellett; a kód most a számítógéped vágólapján van. Ha nincs Másolás gomb, kattints a mezőbe, nyomd meg a Ctrl + C (vagy Mac-en Cmd + C) billentyűkombinációt a manuális másoláshoz.
Tudni fogod, hogy sikerült, amikor beillesztheted a kódrészletet egy egyszerű szöveges dokumentumba és megjelenik a teljes <script> címke.
Illeszd be a kódot a WordPress láblécébe
Jelentkezz be a WordPress irányítópultodra (oldalad-címe.hu/wp-admin). A bal oldali menüben menj a Megjelenés → Widgetek menüpontra. Keresd meg a Footer (lábléc) nevű widget területet (vagy „Lábléc 1” stb.). Kattints a Blokk hozzáadása gombra, válaszd az Egyéni HTML-t, majd illeszd be a kimásolt kódot a blokk szövegterületére. Nyomd meg a Frissítés vagy Mentés gombot a képernyő tetején. Az oldal mostantól minden lapon betölti a szkriptet, és egy csevegőbuboréknak kell megjelennie a jobb alsó sarokban, amikor megtekinted az előnézetet. Ha nem látsz Lábléc widget területet, telepítsd az ingyenes „Insert Headers and Footers” bővítményt, majd menj a Beállítások → Insert Headers and Footers menüpontra, illeszd be a kódot a „Scripts in Footer” (láblécben lévő szkriptek) mezőbe, és mentsd el.