Answered

How to resize chatbot in Wordpress

Like (0) Share

Report

Posted on 21 Jul 2021 13:45:58 by sylwiastep

I've created a chatbot, and have iFrame link, but when I embed it on our wordpress page the window where chat appears is extremely narrow. I tried to change the height bit on the code in wordpress, but it doesn't seem to do anything. I can't find anywhere in PVA to change the look of the chatbot, can anybody help me please?

I have the same question (0)

All responses (6)

Answers (1)

sylwiastep 11 on 22 Jul 2021 at 07:17:42

Like (1)

Report

Re: How to resize chatbot in Wordpress

Kill me if I haven't tried that before!!! Really, I did, and that didn't work... but now it does, so a big THANK YOU to you!! 🤗

Was this reply helpful? Yes No
Verified answer

CU22081450-0 Most Valuable Professional on 21 Jul 2021 at 20:55:40

Like (2)

Report
Re: How to resize chatbot in Wordpress

Hi @sylwiastep ,

Your issue is quite simple, you are adding your iframe with width and height using 100%.

Try to change to: (height: 500px) -> pixels

<iframe src="https://web.powerva.microsoft.com/...." frameborder="0" style="width: 100%; height: 500px;"></iframe>

Was this reply helpful? Yes No
sylwiastep 11 on 21 Jul 2021 at 14:31:26

Like (0)

Report

Re: How to resize chatbot in Wordpress

Currently it looks like this. https://surreycoalition.org.uk/chat-to-us/
And the window where messages appear is way too narrow 😞

Was this reply helpful? Yes No
CU22081450-0 Most Valuable Professional on 21 Jul 2021 at 14:14:02

Like (0)

Report

Re: How to resize chatbot in Wordpress

@sylwiastep ,

I already customized some PVA bots in a custom website. Can you share your WordPress public link that contains your bot implemented?

Maybe I can suggest some changes using your CSS file with the F12 developer tool. It'll help you to see the way to develop it.

Was this reply helpful? Yes No
sylwiastep 11 on 21 Jul 2021 at 14:10:27

Like (0)

Report

Re: How to resize chatbot in Wordpress

Thank you for that. I saw this, and I tried this, but it resulted in the chat window missing completely - just the title was showing. And I changed the Id where requested, and tried changing the link too... no luck at all 😞

Was this reply helpful? Yes No
CU22081450-0 Most Valuable Professional on 21 Jul 2021 at 13:59:53

Like (0)

Report

Re: How to resize chatbot in Wordpress

Hi @sylwiastep ,

You can use CSS style to customize your chatbot design:

https://docs.microsoft.com/en-us/power-virtual-agents/customize-default-canvas#customize-the-default-canvas-simple?WT.mc_id=BA-MVP-5003806

You can see a bot template customized using the hyperlink below, using the F12 developer tool:

COVID19 Volunteer - Self4Society (mygov.in)

Was this reply helpful? Yes No