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.
No description
5 Replies
altomarketing
altomarketing•4w ago
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
claudiob
claudiob•3w ago
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;}
William Lewis
William Lewis•3w ago
thanks guys @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.
Baptiste
Baptiste•3w ago
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 😉
William Lewis
William Lewis•3w ago
ok