Want to build your own 24/7 FAQ knowledge base?
LibraryH3lp subscriptions include unlimited independent internal or public-facing knowledge bases.


Search the LibraryH3lp Knowledge Base

 

How do I include a chat box on a web page without using JavaScript?

3744 views   |   Last updated on Jun 17, 2019    chat widget installation

 

There are two common ways to include chat on your web page without using JavaScript: IFRAMEs and links.  An IFRAME lets you include a chat box within the flow of your page.  A hyperlink can be used to pop out a chat box on click.

IFRAMEs

You can embed a chat box on your web page using an IFRAME. IFRAMEs are handy if you cannot use JavaScript within a web page.  A chat box embedded using an iframe will always be visible and change status to show guests when you are offline.  There is no customizable offline display.

In both examples below:

  • Replace my-queue-name or my-user-name with a queue or user name from your subscription. This controls how incoming chats are routed to operators.
  • Replace the skin number using a skin ID found on the Widgets page in the admin dashboard. The skin controls the cosmetic appearance of your chat box (colors, operator identity, sound on or off by default, custom CSS, etc...) but has nothing to do with chat routing. In the examples below, skin ID 123456 is NOT a valid skin ID.
  • The width and height dimensions for your chat box, to match your web site's available real estate. Percentage values are perfectly fine and essential if you wish to make your chat box responsive.
  • If desired, the style of the frame border.  

For chat boxes attached to queues:

United States server example:

<iframe src="https://libraryh3lp.com/chat/my-queue-name@chat.libraryh3lp.com?skin=123456" frameborder="1" style="border: 2px inset black; width: 350px; height: 300px;"></iframe>

Canada server example:

<iframe src="https://ca.libraryh3lp.com/chat/my-queue-name@chat.ca.libraryh3lp.com?skin=123456" frameborder="1" style="border: 2px inset black; width: 350px; height: 300px;"></iframe>

Europe server example:

<iframe src="https://eu.libraryh3lp.com/chat/my-queue-name@chat.eu.libraryh3lp.com?skin=123456" frameborder="1" style="border: 2px inset black; width: 350px; height: 300px;"></iframe>

Asia/Pacific server example:

<iframe src="https://sg.libraryh3lp.com/chat/my-queue-name@chat.sg.libraryh3lp.com?skin=123456" frameborder="1" style="border: 2px inset black; width: 350px; height: 300px;"></iframe>

For chat boxes attached to users

Important Note: Chats on widgets attached to specific users can't be transferred and won't show up in Activity or Reports. If you'd like to direct chats to an individual but would like to keep a record of chats, create a queue and assign only that one user to it.

United States server example:

<iframe src="https://libraryh3lp.com/chat/my-user-name@libraryh3lp.com?skin=123456" frameborder="1" style="border: 2px inset black; width: 350px; height: 300px;"></iframe>

Canada server example:

<iframe src="https://ca.libraryh3lp.com/chat/my-user-name@ca.libraryh3lp.com?skin=123456" frameborder="1" style="border: 2px inset black; width: 350px; height: 300px;"></iframe>

Europe server example:

<iframe src="https://eu.libraryh3lp.com/chat/my-user-name@eu.libraryh3lp.com?skin=123456" frameborder="1" style="border: 2px inset black; width: 350px; height: 300px;"></iframe>

Asia/Pacific server example:

<iframe src="https://sg.libraryh3lp.com/chat/my-user-name@sg.libraryh3lp.com?skin=123456" frameborder="1" style="border: 2px inset black; width: 350px; height: 300px;"></iframe>

 

Hyperlinks

You can create hyperlinks to chat boxes by combining your queue's name with a chat box skin ID.  Here's an example of a hyperlink that uses a chat image:

FAQ URL:

More Help

Search By Topic

Share this FAQ