So können Sie den chatbot als pop-up in Ihre website einbinden:
Tragen Sie folgenden code im body-tag der html Datei ein.
Verwenden Sie dabei die Chat-ID, die Sie von uns erhalten haben.
<script type="module">
import Chatbot from "https://antex.chat/js/web.js"
Chatbot.init({
chatflowid: "<Chat-ID>",
apiHost: "http://proxy01.antex.chat",
})
</script>
Wenn Details des layout angepasst werden sollen, kann folgendermaßen vorgegangen werden:
<script type="module">
import Chatbot from "https://antex.chat/js/web.js"
Chatbot.init({
chatflowid: "<Chat-ID>",
apiHost: "http://proxy01.antex.chat",
chatflowConfig: {
// topK: 2
},
theme: {
button: {
backgroundColor: "#3B81F6",
right: 20,
bottom: 20,
size: "medium",
iconColor: "white",
customIconSrc: "https://raw.githubusercontent.com/walkxcode/dashboard-icons/main/svg/google-messages.svg",
},
chatWindow: {
welcomeMessage: "Hallo! Willkommen im antex-chat",
backgroundColor: "#ffffff",
height: 700,
width: 400,
fontSize: 16,
poweredByTextColor: "#303235",
botMessage: {
backgroundColor: "#f7f8ff",
textColor: "#303235",
showAvatar: true,
avatarSrc: "https://raw.githubusercontent.com/zahidkhawaja/langchain-chat-nextjs/main/public/parroticon.png",
},
userMessage: {
backgroundColor: "#3B81F6",
textColor: "#ffffff",
showAvatar: true,
avatarSrc: "https://raw.githubusercontent.com/zahidkhawaja/langchain-chat-nextjs/main/public/usericon.png",
},
textInput: {
placeholder: "Wie kann ich Ihnen helfen?",
backgroundColor: "#ffffff",
textColor: "#303235",
sendButtonColor: "#3B81F6",
}
}
}
})
</script>