[Resolved] Salesforce Embedded Chat

[Kris]

Hi Tom & Team,

I am attempting to add a Salesforce Embedded Chat implementation to a GP website. Most of it works perfectly… but Salesforce is using what looks like a custom setup for the Close and Minimize buttons. They are using the <svg> element for the _ (minimize) and X (close).

The problem is that the _ and X are not showing so you cannot see that there are buttons there. When you highlight the <g> element you can see they are there. Just not sure why they are not showing up.

I did try adding SVG Support plugin to the site with no changes and I change the icon type to SVG. Neither resolved the issue.

I think I will need to login to the chat on the Salesforce side for you to see the HTML and CSS as it looks like some JS is injecting HTML.

Any ideas to what I can change to fix this?

[Ying]

Hi Kris,

Seems the svg is missing a width, try this CSS:

svg.slds-icon.slds-icon-text-default.slds-icon_x-small {
    width: 20px;
}

[Kris]

Ying, Thank you so much for that. They are showing great now. This is why we use GP for all of our websites!
Thanks, Kris

[Ying]

You are welcome Kris, glad to help 🙂

[Author]

Posts