Designing your group chats using RumbleTalk API


Reading your group chats design

GET
https://api.rumbletalk.com/chats/{chatId}/design

Response format

  • Parameter
  • Type
  • Description
  • status
  • boolean
  • true on success, false otherwise
  • skinId
  • integer
  • The ID of the skin of the design
  • dir
  • string
  • The written text direction
  • dlgBg
  • string
  • The background design of the dialogs
    Format options:
    • color image repeat attachment position
    • color
  • dlgBorder
  • string
  • The border design [width, color (in hex), and border radius] of the dialogs
  • dialogPadding
  • integer
  • The padding of the dialogs
  • dialogMargin
  • integer
  • The margin of the dialogs
  • dlgText
  • string
  • The text design [color, weight, size, and font] of the dialogs.
  • usersWidth
  • integer
  • The width [in percentage] of the users list area
  • listBg
  • string
  • The background design of the users list area
    Format options:
    • color image repeat attachment position
    • color
  • usersBorder
  • string
  • The border design [width, color (in hex), and border radius] of the users list area
  • usersPadding
  • integer
  • The padding of the users list area
  • usersMargin
  • integer
  • The margin of the users list area
  • listText
  • string
  • The text design [color, weight, size, and font] of the users list area
  • chatBg
  • string
  • The background design of the group chat's messages area
    Format options:
    • color image repeat attachment position
    • color
  • chatBorder
  • string
  • The border design [width, color (in hex), and border radius] of the group chat's messages area
  • chatPadding
  • integer
  • The padding of the group chat's messages area
  • chatMargin
  • integer
  • The margin of the group chat's messages area
  • chatText
  • string
  • The text design [color, weight, size, and font] of the group chat's messages area.
  • textHeight
  • integer
  • The height of the typing area
  • textBg
  • string
  • The background design of the typing area
    Format options:
    • color image repeat attachment position
    • color
  • textBorder
  • string
  • The border design [width, color (in hex), and border radius] of the typing area
  • textPadding
  • integer
  • The padding of the typing area
  • textMargin
  • integer
  • The margin of the typing area
  • textText
  • string
  • The text design [color, weight, size, and font] of the typing area
  • generalText
  • string
  • The text design [color, weight, size, and font] of the viewers/speakers area
  • background
  • string
  • The background design of the chat
    Format options:
    • color image repeat attachment position
    • color
  • messageColors
  • string
  • The [comma-separated] background colors [in hex] of each of the messages
  • colors
  • string
  • The [comma-separated] background colors [in hex] of each of the users
  • messageBorder
  • string
  • The border design [width, color (in hex), and border radius] of each of the messages
  • messagePadding
  • integer
  • The padding of each of the messages
  • messageMargin
  • integer
  • The margin of each of the messages
  • css
  • string
  • Custom CSS that will affect the chat on desktop and laptop browsers
  • mobileCss
  • string
  • Custom CSS that will affect the chat on mobile browsers

cURL example

curl \ -X GET \ "https://api.rumbletalk.com/chats/123/design" \ -H "Authorization: Bearer <token>"

Response example

{ "status": true, "skinId": 40000, "dir": "ltr", "dlgBg": "aaaaaa", "dlgText": "000000 normal 14 Arial", "listBg": "transparent url(background.png) scroll left center", "chatBg": "transparent", "textBg": "ffffff", "generalText": "ffffff normal 11 Arial", "listText": "FFFFFF normal 14 Arial", "chatText": "000000 normal 14 Arial", "textText": "000000 normal 15 Arial", "background": "ffffff url(background.jpg) no-repeat scroll left center", "dlgBorder": "1 969696 5", "usersBorder": "1 b3b4b4", "chatBorder": "1 969696", "textBorder": "0 b4b4b4 5", "usersPadding": 0, "chatPadding": 7, "textPadding": 6, "dialogPadding": 5, "usersMargin": 0, "chatMargin": 5, "textMargin": 0, "dialogMargin": 5, "messageBorder": "1 d6d6d6 1", "usersWidth": 25, "textHeight": 30, "messageColors": "ff0000,00ff80,0080ff", "colors": "00ff00,AA2211", "messagePadding": 10, "messageMargin": 3, "css": null, "mobileCss": null }

Updating your group chat design

PUT
https://api.rumbletalk.com/chats/{chatId}/design

Request format

  • Parameter
  • Type
  • Description
  • dir
  • string
  • The written text direction
    options: 'rtl' or 'ltr'
  • dlgBg
  • string
  • The background design of the dialogs
    The format options are as followed:
    color image repeat attachment position color
    e.g.
    ffffff url(background.jpg) no-repeat scroll left center ffffff
  • dlgBorder
  • string
  • The border design [width, color (in hex), and border radius] of the dialogs
    e.g. for width of 3, blue color, and border radius of 5:
    3 0000ff 5
  • dialogPadding
  • integer
  • The padding of the dialogs
  • dialogMargin
  • integer
  • The margin of the dialogs
  • dlgText
  • string
  • The text design [color, weight, size, and font] of the dialogs.
    e.g. for bold font-weight, text-size of 20px, text color of blue, and font family Arial:
    0000ff bold 14 Arial
  • usersWidth
  • integer
  • The width [in percentage] of the users list area
  • listBg
  • string
  • The background design of the users list area.
    The format options are as followed:
    color image repeat attachment position color
    e.g.
    ffffff url(background.jpg) no-repeat scroll left center ffffff
  • usersBorder
  • string
  • The border design [width, color (in hex), and border radius] of the users list area
    e.g. for width of 3, blue color, and border radius of 5:
    3 0000ff 5
  • usersPadding
  • integer
  • The padding of the users list area
  • usersMargin
  • integer
  • The margin of the users list area
  • listText
  • string
  • The text design [color, weight, size, and font] of the users list area.
    e.g. for bold font-weight, text-size of 20px, text color of blue, and font family Arial:
    0000ff bold 14 Arial
  • chatBg
  • string
  • The background design of the group chat's messages area
    The format options are as followed:
    color image repeat attachment position color
    e.g.
    ffffff url(background.jpg) no-repeat scroll left center ffffff
  • chatBorder
  • string
  • The border design [width, color (in hex), and border radius] of the group chat's messages area
    e.g. for width of 3, blue color, and border radius of 5:
    3 0000ff 5
  • chatPadding
  • integer
  • The padding of the group chat's messages area
  • chatMargin
  • integer
  • The margin of the group chat's messages area
  • chatText
  • string
  • The text design [color, weight, size, and font] of the group chat's messages area;
    e.g. for bold font-weight, text-size of 20px, text color of blue, and font family Arial:
    0000ff bold 14 Arial
  • textHeight
  • integer
  • The height of the typing area
  • textBg
  • string
  • The background design of the typing area
    The format options are as followed:
    color image repeat attachment position color
    e.g.
    ffffff url(background.jpg) no-repeat scroll left center ffffff
  • textBorder
  • string
  • The border design [width, color (in hex), and border radius] of the typing area
    e.g. for width of 3, blue color, and border radius of 5:
    3 0000ff 5
  • textPadding
  • integer
  • The padding of the typing area
  • textMargin
  • integer
  • The margin of the typing area
  • textText
  • string
  • The text design [color, weight, size, and font] of the typing area.
    e.g. for bold font-weight, text-size of 20px, text color of blue, and font family Arial:
    0000ff bold 14 Arial
  • generalText
  • string
  • The text design [color, weight, size, and font] of the viewers/speakers area.
    e.g. for bold font-weight, text-size of 20px, text color of blue, and font family Arial:
    0000ff bold 14 Arial
  • background
  • string
  • The background design of the chat
    The format options are as followed:
    color image repeat attachment position color
    e.g.
    ffffff url(background.jpg) no-repeat scroll left center ffffff
  • messageColors
  • string
  • The background colors [in hex] of each of the messages;
    you may supply a (up to 16 items) comma-separated list of colors that will rotate between the users
    e.g 0000ff,ff00ff,0e30e1
  • colors
  • string
  • The colors [in hex] of each of the user names and messages text;
    you may supply a (up to 16 items) comma-separated list of colors that will rotate between the users
    e.g 0000ff,ff00ff,0e30e1
  • messageBorder
  • string
  • The border design [width, color (in hex), and border radius] of each of the messages
    e.g. for width of 3, blue color, and border radius of 5:
    3 0000ff 5
  • messagePadding
  • integer
  • The padding of each of the messages
  • messageMargin
  • integer
  • The margin of each of the messages
  • css
  • string
  • Custom CSS that will affect the chat on desktop and laptop browsers
  • mobileCss
  • string
  • Custom CSS that will affect the chat on mobile browsers

Response format

  • Parameter
  • Type
  • Description
  • status
  • boolean
  • true on success, false otherwise

cURL example

curl \ -X PUT \ "https://api.rumbletalk.com/chats/123/design" \ -H "Authorization: Bearer <token>" \ -d "{\"messageBorder\":\"3 0000ff 5\"}"

Response example

{ "status": true }

Set the chat's skin

Changing the chat's skin will RESET the chat's design variables

PUT
https://api.rumbletalk.com/chats/{chatId}/design/skin

Request format

  • Parameter
  • Type
  • Description
  • skinId
  • integer
  • The ID of the skin of the design
    For skin options,

Response format

  • Parameter
  • Type
  • Description
  • status
  • boolean
  • true on success, false otherwise

cURL example

curl \ -X PUT \ "https://api.rumbletalk.com/chats/123/design/skin" \ -H "Authorization: Bearer <token>" \ -d "{\"skinId\":\"40000\"}"

Response example

{ "status": true }