iFlyChat
  • Documentation
  • Installation
    • WordPress Chat Plugin
    • Drupal Chat Module
    • PHP Chat Client
  • WordPress
    • Embed Chatroom in WordPress Post
    • Disable Popup Chat
    • Hide Popup Chat from a Page
    • Embed Inbox View
    • View Chat Logs
    • Guest User Access
    • Show/Hide Popup Chat On Specific Pages
    • WordPress Filters and Hooks
  • API Reference
    • Create a new chat room
    • Retrieve list of all chat rooms
    • Edit a chat room
    • Retrieve list of all online users
    • Kick a user from the chat
    • Retrieve list of all users online in a chat room
    • Delete a chat room
    • Retrieve Thread History
  • JavaScript SDK
    • Quickstart
    • Custom Label In Chat Window
    • User Chat Button Widget
    • Reference
      • message receive
      • message send
      • user list update
      • connect
      • disconnect
      • ready
      • iflychat.startChat
      • iflychat.closeChat
      • iflychat.minimiseChat
      • iflychat.init
      • iflychat.setStatus
      • iflychat.sound
      • iflychat.openAdminDashboard
      • current user status update
      • current user sound update
      • iflychat.renderLabelInChatWindow
  • Help
    • General
      • Introduction
      • Accounts and Billing
      • Chat Theme and Colors
      • Chat Notification Sound
      • Going Offline
      • Change billing card information
    • Embedded Chatroom
      • Create a New Room
      • Create a New Embed Room
      • Embed Room in PHP
    • Feature Description
      • Moderated Chatroom
      • Group Chat
      • Private Embedded Chatroom
      • Change Guest Name
      • Resize Popup Chat Window
      • Mute Sound Notification
      • Change User Status
      • Desktop Notification
      • Popout or Full Screen Mode
      • Share Media Files
      • Video Chat
    • Chat Moderation
      • Kick/Ban/BanIP
      • Delete or Clear Messages
      • Popup Chat Position
      • Popup Chat Launcher Position
      • App Dashboard
      • Emoji Packs
      • Message Display Format
      • Time Display Format
      • Mobile Web Chat
      • Show Only Admins in Chat
      • Hide Recent Chats Section
      • Hide Users in Popup Chat List
      • Hide Popup Chat List
      • Minimize Popup Chat List
Powered by GitBook
On this page

Was this helpful?

  1. JavaScript SDK

User Chat Button Widget

Want to add a chat button in a nav bar or menu or user profile page? We have a widget for that!

You can add a chat button to your website by using the following HTML code:

<div 
  class="iflychat-widget-theme-light iflychat-widget-user-chat-button" 
  data-id="{user-id}" data-name="{user-name}" 
  data-online-text="Click to chat with me!" 
  data-offline-text="User is offline" 
  data-height="20px" 
  data-online-text-color="#59A903" 
  data-offline-text-color="#222" 
  data-online-background-color="#FFF" 
  data-offline-background-color="#FFF" 
  data-font-size="14px" 
></div>

The chat button accepts following attributes:

  • data-id - id of the user to start chat with. Replace {user-id} with the id of the user in the code given above.

  • data-name - name of the user to start chat with. Replace {user-name} with the name of the user in the code given above.

  • data-online-text - text to display when the user is online

  • data-offline-text - text to display when user is offline

  • data-height - the height of the chat button widget

  • data-online-text-color - text color to render when the user is online

  • data-offline-text-color - text color to render when the user is offline

  • data-online-background-color - background button color to render when the user is online

  • data-offline-background-color - background button color to render when the user is offline

  • data-font-size - the font size of text in chat button widget

PreviousCustom Label In Chat WindowNextReference

Last updated 5 years ago

Was this helpful?

Please note that you should be using or plan in order to be able to use this feature.

Professional
Enterprise
Add this chat button anywhere on your profile page
When you click on chat button it will automatically launch chat window