Embedded FAB Pickaxe Chatbot Not Remaining Visible On WP Site

Bugs / Site Issues
1

Hi Folks,

I’ve had a client’s website admin respond as follows after I sent through the embed code for a FAB chatbot for a Wordpress website:

“We have added the code to the site. From what we can see, the box only pops up before you start scrolling down the page, and doesn’t stay there.”

Is there a solution to have the chatbot box remain visible or floating in view, on your screen, while scrolling?

I would appreciate any help with this for a non-techie.

Many thanks. :grinning_face:
George.

2

Hi!

Thank you for reaching out.

This has been reported by other users as well, and I’ve already flagged it to our engineering team.

In the meantime, you can use this workaround:

In your embed div, add a class, for example:

<div class="embed-embed" id="deployment-xxxx"></div>
<script src="https://studio.pickaxe.co/api/embed/bundle.js" defer></script>

Then add this to your CSS or inside a tag:

.embed-embed > .pxe-absolute.pxe-z-50 {
      position: fixed !important;
      z-index: 2147483647 !important;
}

Alternatively, you can use the deployment id directly:

#deployment-xxxx > .pxe-absolute.pxe-z-50 {
      position: fixed !important;
      z-index: 2147483647 !important;
}

The .pxe-absolute.pxe-z-50 selector targets the chat drawer inside the embed.
I created a test page with a FAB embed and this fix worked for me. Link to the test page: (link)

1 Like
3

Hi Danny,

Thanks for your quick response! I will hand this coding to the website admin and see how they get on.
Once again, many thanks for helping out. :clap:

Best regards.
George. :nerd_face:

4

Hi @webinaire,

It should be fixed now, thanks! No need to update the CSS.

1 Like
5

Hi Stephen,

Many thanks for this update. It works a charm! :+1: :grin:

2 Likes