Please who has been able to successfully integrate the chatbot in this repo: GitHub - JiteshGaikwad/Chatbot-Widget to a Wordpress site?
Integrating Chatbot-Widget ((https://github.com/JiteshGaikwad/Chatbot-Widget) ) to a Wordpress site?
@sleekmike What you trying to archive? You can integrate this Github Repo on Wordpress site but it will overlap with the Wordpress pages. Even the GUI will also changed.
@sleekmike
> <div id="webchat">
> </div>
> <script src="https://cdn.jsdelivr.net/npm/rasa-webchat/lib/index.min.js"></script>
> <link rel="stylesheet" type="text/css" href="https://">
> <script>!(function () {
> let e = document.createElement("script"),
> t = document.head || document.getElementsByTagName("head")[0];
> (e.src =
> "https://cdn.jsdelivr.net/npm/rasa-webchat@1.0.1/lib/index.js"),
> (e.async = !0),
> (e.onload = () => {
> window.WebChat.default(
> {
> selector: "#webchat",
> initPayload: "/get_started",
> customData: {"language": "en"}, // arbitrary custom data. Stay minimal as this will be added to the socket
> socketUrl: "http://localhost:5005",
> customMessageDelay: (message) => {
> let delay = message.length * 30;
> if (delay > 3 * 200) delay = 3 * 200;
> if (delay < 100) delay = 100;
> return delay;
> },
>
> socketPath: "/socket.io/",
> title: "Street Bot",
> tooltipPayload: "/get_started",
> tooltip: true,
> tooltipDelay: 500,
> subtitle: "Powered by XYZ",
> connectingText: "Waiting for server...",
> profileAvatar: "https://",
> openLauncherImage: "https://",
>
> params: {"storage": "session"},
>
> mainColor: "#ffd600",
> userBackgroundColor: "#ffd600",
> userTextColor: "#cde9ce",
> showMessageDate: false,
> inputTextFieldHint: "Hi.Type your message here...",
> badge: " ",
> displayUnreadCount: true,
> isChatOpen: false,
> embedded: false,
> showCloseButton: true,
> fullScreenMode: true,
> showFullScreenButton: true,
> docViewer: false,
>
>
> },
> null
> );
> }),
> t.insertBefore(e, t.firstChild);
> })();
>
>
>
> </script>@sleekmike for style.css
.rw-conversation-container
|-- .rw-header
|-- .rw-title
|-- .rw-close-function
|-- .rw-loading
|-- .rw-messages-container
|-- .rw-message
|-- .rw-client
|-- .rw-response
|-- .rw-replies
|-- .rw-reply
|-- .rw-response
|-- .rw-snippet
|-- .rw-snippet-title
|-- .rw-snippet-details
|-- .rw-link
|-- .rw-imageFrame
|-- .rw-videoFrame
|-- .rw-sender
|-- .rw-new-message
|-- .rw-send
For example: In style.css
>
> .rw-conversation-container .rw-widget-container{
> position: fixed;
> bottom: 13%;
> right: 42px;
> height: 720px;
> width: 420px;
> background: #db5d28;
> border-radius: 10px 10px 10px 10px;
> box-shadow: 0 0px 1px 0 rgba(0, 0, 0, 0.16), 0 0px 10px 0 #00000096;
>
> }
It is just a example, try see the main webchat GitHub and customised as per your need. Good luck with the project!!
@nik202 Thanks for your assistance in helping me resolve the issue that I was having, I have now integrated Rasa-webchat to my Wordpress site.
1 Like
Hello @nik202, Please how to I format the response/replies of the bot if its a very long text to newline. Thanks
@sleekmike I will suggest, if you have longer text message, as I seen your mail. I will suggest provide the URL link like
domain.yml under your response
Your text you want to show( not much as it will looks odd in the small widget screen) [read more…] (https:rasa.com]
Example from my other thread solution:
utter_what:
- text: |
- what
- are
- you
- doing
- today
- ?
This will come line by line, within a few sec.
Next, separate line in one output:
utter_what:
- text : " what \n
are\n
you \n
doing\n
today\n
?"
Do, share the text only few sentences, else customer or user will be bored. Try make a bullet points.
Good Luck! Got it?
1 Like
Thanks a lot mate, will try it like you just depicted 
yes it worked like magic
hey @nik202 I have a question (I hope it’s not that stupid 
). So I open my index.php file from my WordPress site, but there is no body section. It has only main and div. where should I put this code? Is it ok to add inside the main tag?
@EvanMath You need to put the rasawebchat code in insert header and footer body section, that plugin should be there in setting, if not add new plugin please, do update the version to 1.0.1 if you are using rasa 2.3.X version below that 1.0.0.
1 Like