Widget working on PC screen but not mobile?

Hi everyone, I've used a rectangle as a placeholder for some live chat widget code. It works perfectly on the PC variant, but the mobile variant isn't working... IT doesn't show, but oddly enough, when I click on the menu button, that brings up a pop-up menu, it shows at the bottom of the screen! Very weird. So I've tried placing the rectangle placeholder in the mouseoff layer and in it's own layer above all the others called mouseofflivechat. Same thing. So not sure what to do with it, any ideas?

Thank you in advance for your help :)

If the Placeholder code used an id attribute then then second instance of such code is ignored in HTML by design.

If is is appearing at the screen bottom, it is possible you have not correctly terminated your code block.

Acorn

Quote:

---

Originally Posted by Acorn

If the Placeholder code used an id attribute then then second instance of such code is ignored in HTML by design.

If is is appearing at the screen bottom, it is possible you have not correctly terminated your code block.

Acorn

---

Hi Acorn, thanks for your reply, but why would this work perfectly on my desktop but not on my phone? Both have the same code... The code itself was a cut n paste from the code generated by the service provider.

Quote:

---

Originally Posted by wwdileie

Hi Acorn, thanks for your reply, but why would this work perfectly on my desktop but not on my phone? Both have the same code... The code itself was a cut n paste from the code generated by the service provider.

---

A Main and a Variant are contained in the same, single HTML file.
If you have a Placeholder with the same code twice and it uses a an id attribute that is the same in both Placeholders then any browser will find the first block of code (here Main) and ignore the second block (Variant).

By now, you should realise that generalities doe not sort things out quickly.
If the code is 'cut n paste' then provide it and you will get a better answer, possibly even a solution.

Acorn

Hi Acorn, I usually find there often a simple solution at first, which is why I asked in case there was a simple fix. As a newbie at html, your first reply seems to assume a certain knowledge of the workings and usage of it that I don't have, which is why I asked what you were referring to. But no worries of course, happy to place code here of course that you asked for it :).

<chat-widget style="--chat-widget-primary-color: #188bf6; --chat-widget-active-color:#188bf6 ;--chat-widget-bubble-color: #188bf6" location-id="..." prompt-msg="Hi there, have a question? Contact us here." use-email-field="true" success-msg="We will contact you shortly." prompt-avatar="https:..." agency-name="..." agency-website="..." ></chat-widget> <script src="https:..." data-resources-url="https:..." > </script>

Though the id attribute is referencing a component on a web address, so do I need to create a separate widget for the mobile variant?

Thanks :)

Quote:

---

Originally Posted by wwdileie

Hi Acorn, I usually find there often a simple solution at first, which is why I asked in case there was a simple fix. As a newbie at html, your first reply seems to assume a certain knowledge of the workings and usage of it that I don't have, which is why I asked what you were referring to. But no worries of course, happy to place code here of course that you asked for it :).

<chat-widget style="
--chat-widget-primary-color: #188bf6;
--chat-widget-active-color:#188bf6 ;
--chat-widget-bubble-color: #188bf6"
location-id="..."
prompt-msg="Hi there, have a question? Contact us here."
use-email-field="true"
success-msg="We will contact you shortly."
prompt-avatar="https:..."
agency-name="..."
agency-website="..." >
</chat-widget>
<script src="https:..." data-resources-url="https:..." > </script>

Though the id attribute is referencing a component on a web address, so do I need to create a separate widget for the mobile variant?
Thanks :)

---

There is no direct reference to an id (location-id is not the same).
<chat-widget> is not a normal HTML Tag so there will be JavaScript coding unpacking all this.

The only reference I have come across is Reason Technology ChatBot.

Without knowing the supplier and with no access to its configuration, all I can suggest is dropping the <script> tags in the Variant.

Acorn

Quote:

---

Originally Posted by Acorn

There is no direct reference to an id (location-id is not the same).
<chat-widget> is not a normal HTML Tag so there will be JavaScript coding unpacking all this.

The only reference I have come across is Reason Technology ChatBot.

Without knowing the supplier and with no access to its configuration, all I can suggest is dropping the <script> tags in the Variant.

Acorn

---

Thanks for your reply, ok, I'll have a play with that and see what happens. I still find it odd that although I use the same browser on both my PC and mobile, the results are so differernt, not only for this, but also for popups and link rectangles. On my PC, all work flawlessly, but have had considerable trouble on mobile. Very odd!

Quote:

---

I still find it odd that although I use the same browser on both my PC and mobile, the results are so different, not only for this, but also for popups and link rectangles. On my PC, all work flawlessly, but have had considerable trouble on mobile. Very odd!

---

I think it may help if you can provide some examples about what you find to be odd with popups and links. I've not found many issues that cannot be resolved one way or another.

Gary