Hey , I am working on a streamlit application and I want to integrate my chatbot that I made with dialogflow, the problem is that the message bar is not displayed completely, I have to show you the difference between using a page HTML and the web app with streamlit, the chatbot must be displayed in streamlit as in the html page . I will show the code that i used :
Hi @Gheouany_Saad, welcome to the Streamlit community!
I didn’t realize that integrating a chatbot with a Streamlit app could be this simple. Really cool!
I tried embedding my own chatbot and ran into the same issue. To display the entire chatbot window, try increasing the value of the height parameter for components.html
. The default value for height is 150 pixels.
Increasing to height=700
worked perfectly on my end:
import streamlit as st
import streamlit.components.v1 as components
components.html(
"""
<script src="https://www.gstatic.com/dialogflow-console/fast/messenger/bootstrap.js?v=1"></script>
<df-messenger
chat-title="Web-Search"
agent-id="xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"
language-code="en"></df-messenger>
""",
height=700, # try various values to see what works best (maybe use st.slider)
)
Let us know if increasing the height
of the frame works
Happy Streamlit-ing!
Snehan