Share feedback, ideas and get community help

D
F
M
a
g

Header panel

Any suggestions to add a header panel like we see on other providers? If we could do using the existing framework it will be cool. Anyone done anything like this?

Sharing an example of crisp.
Attachment
image.png
1
a
c
W
7 comments
Crisp is a chat system, more like Chatwoot.. But you can create your own theme if you like to make this header https://docs.typebot.io/theme/overview
I used css to create a header: .typebot-chat-chunk::before {
font-weight: bold;
color: white;
content: " πŸ‘©β€πŸ¦±" " Amanda - NYC Limo Virtual Suppport"; border: 1px solid #000;
padding-left:30px;
padding-top:10px;
padding-bottom:10px;
background: #003bc4;
font-size:14px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
margin-top:-40px;
margin-left:-30px;
margin-right:-30px;
}
.typebot-chat-chunk:nth-child(even)::before {display:none;}
.typebot-chat-chunk:nth-child(n+2)::before {display:none;}

.typebot-picture-button {border: 1px solid #dadada;}
@claudiob - one additional query, i get the header on the Theme page in typebot, but when i share it as html/javascript, it does not appear on my website? any idea about it?
It appears in the popup mode but not in bubble mode. @Baptiste please let know if you have an opinion on this.
This is custom CSS, it's out of Typebot scope, I can't really help about it! Ask an web developer friend if you can πŸ˜‰
Add a reply
Sign up and join the conversation on Discord
Join