freshdesk-messaging-facade
Advanced tools
Changelog
v1.3.0
data-host attribute to the facade to set the host of the widget. The default is https://wchat.freshchat.com.Readme
The Freshdesk Messaging widget loads more than 1.1 MB (gzipped) of JavaScript on page-load.
This facade (less than 1 KB gzipped) prevents Freshdesk's JavaScript from loading until the chat widget is hovered over saving your users a lot of bandwidth and substantially improving page-load times.
| Freshdesk Messaging JS | Freshdesk Messaging Facade | |
|---|---|---|
| Number of assets | 28 | 2 |
| Page Complete | 6.3 s | 1.1 s |
| Network Transfer size | 1097 KB | 1 KB |
A div with an inline SVG of the Freshdesk Messaging icon is displayed in the bottom corner - appearing just like the real thing. When a user hovers within 200 pixels of it loads the Freshdesk Messaging script. A simple animated icon is displayed as the script loads.
Several quick start options are available:
git clone https://github.com/coliff/freshdesk-messaging-facade.gitnpm install freshdesk-messaging-facadeyarn add freshdesk-messaging-facadecomposer require coliff/freshdesk-messaging-facadeLoad the CSS and JS in your head:
<link rel="stylesheet" href="css/freshdesk-messaging-facade.min.css" media="screen">
<script src="js/freshdesk-messaging-facade.min.js" type="module" async></script>
Load the web component within your page:
<freshdesk-messaging-facade id="freshdesk-messaging-facade" data-token="" data-siteid="" hidden>
<div id="freshdesk-messaging-icon" tabindex="0" role="button" aria-label="Chat"></div>
</freshdesk-messaging-facade>
Add your 36-digit Freshdesk Messaging token to the data-token and your site's id to data-siteid.
You can optionally add a data-host attribute to set the host of the widget. The default is https://wchat.freshchat.com.
https://coliff.github.io/freshdesk-messaging-facade/
Q. How can I customize the chat widget's color?
A. You can modify the background-color value of #freshdesk-messaging-icon.
Q. Can I load this from a CDN?
A. Yep, it's available on JSDelivr.
Q. Does it work in IE 11?
A. No, but you can easily load the standard Freshdesk Messaging widget and add the nomodule attribute to it as a fallback for legacy browsers. View Gist
FAQs
A faster Freshdesk Messaging (formerly Freshchat) embed
The npm package freshdesk-messaging-facade receives a total of 83 weekly downloads. As such, freshdesk-messaging-facade popularity was classified as not popular.
We found that freshdesk-messaging-facade demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
The Python Software Foundation has secured a 5-year sponsorship from Fastly that supports PSF's activities and events, most notably the security and reliability of the Python Package Index (PyPI).
Security News
LDAPjs, an LDAP Client and Server API for Node.js, was decommissioned after its maintainer received an abusive email from a user, raising concerns about this form of abuse as a potential attack vector.
Security News
CISA launched a new project called Vulnrichment to enrich CVEs with details that help prioritize patching and mitigation efforts, as the NVD backlog of unenriched CVEs awaiting analysis surpasses 10,000.