New Feature in WordPress Members Chat: Choose what Display Name users will see

The RumbleTalk WordPress Members chat plugin is constantly introducing new features. One of the latest additions is the display name feature. It enhances the option for members to log in with a specific name. Here is a quick overview of this new feature and how it can be used.

What is the display name feature?

The new display name feature is an easy way to control what name will show in the member’s group chat.

The name that will show in the members’ chat is taken from the WordPress database. The options are:

  • User Name (default) This is the login name of a user.
  • Nick Name
  • First Name
  • Last Name
  • First Name + Last Name
  • Last Name + First name

members chat display name

How does the new WordPress members’ chat display name work?

After installing the chat plugin, you will see a new black arrow next to the member’s field, simply choose the option you like or leave it to use the default name.

How does the member display name feature work?

As with all plugins, just having access to a lot of features isn’t enough. You need to know how to leverage them effectively to justify integrating them into your membership site. Here is a quick overview of the new feature.

When a user clicks on the member’s checkbox, the plugin is basically activating a code in the WordPress service that connects your WordPress user base with the chat, this can also be done manually if you do not want to use the RumbleTalk WordPress plugin.

From this point, any user that logged in to your WordPress site will be automatically logged into the RumbleTalk chat room. Now the new feature will control what name will show as the username.

The feature was introduced in order to present maximum flexibility in deciding what a username will look like.

HTML Chat Room Service For Websites

This post will deal with the usage of HTML chat rooms in today’s communication arena.
Communication has been an essential part of our daily life as a human being.

Since the early days of civilization, a human has tried and improved so many communication methods. From fire beacons, smoke signs, more code, telephones, and now the Internet, we have advanced very far in our time methods of communication.

 

What does group communication mean?

In today’s world, communication is normally done online. As social human beings we look to talk to people, we form communities and we talk all day long using our mobile,PC, and laptop. The usage is endless. We see more and more online members chat communication done in areas that were face-to-face only not so long ago. Things like:

  • Online communities
  • Online fan clubs
  • Online traders
  • Online workshops
  • Online teaching
  • Online meeting
  • Online socializing
  • Online Bots
  • Online group therapy

One of the great advancements in communication methods is HTML chat room. Previously, we knew the IRC, ICQ, and some Internet messengers. They all came with certain applications to be installed in a computer with settings and preferences are also embedded in the computer. In today’s world HTML chat room is giving an answer to so much more than early chat software.

When someone is away from his computer or gadgets, practically he is unable to respond to any message. Although he can use someone’s computer or gadget, he still needs to adjust the settings and preferences to enable him to communicate.
This is how HTML chat room takes over.

No Installation HTML Chat Room

Can you imagine having a chat room where you can enter into it without having to install any application? Without having to be dependent on your smartphone or tablet?
HTML Chat room is the answer.

Creating your own chat, is easy, go to https://www.rumbletalk.com, and create an account with one or more chats (first chat is free). And then you can set it up to your liking as well as change the chat design.

html chat room service settings

Without any installation effort and messy setting up, RumbleTalk can provide all two- communication needs in today’s Internet era. It is time for us to forget the old chatting application, and start to use the chat that gives you full convenience.

We have a top-of-the-line technology that enables you to have your own group chat room in any HTML page you want, whether on your website, on your Facebook page and every place with HTML page, they all can have HTML chat room installed.

Multimedia Capable Room

We also enable you to attach your picture, audio, and video easily. Whether YouTube or Vimeo video, it can be embedded in a chat room. You can copy and paste the video in your HTML chat room. As a sophisticated service, RumbleTalk deploys HTML5 technology to enable a multimedia chatting experience in our chat platform.

 

For people who need video chat, an HTML chat room with WebRTC capabilities is also capable of delivering video chat for one-on-one calls. You can have a private conversation and have one-on-one audio and video chat seamlessly. Our technology is capable of giving HTML chat room multimedia features just like another video chat application only with your browser.

Your own html chat skin

A Secured Chat Room

We have mentioned how RumbleTalk is able to provide benefits to many businesses. Even businesses with a closely guarded secret like stock trading can utilize HTML chat room easily as we discussed. This is provided by our secure connection with SSL encryption. Therefore a private conversation, even a secret conversation will not be leaked out due to our very secure infrastructure.

In a public chat such as live event chat, you can assign a moderator to regulate the conversation. This is very much useful for live event chat, therefore everyone who engages in the chat room will have to follow the rule set by the moderator and they can also be given predestined privileges.

RumbleTalk HTML chat room also equipped with AntiSpam technology to prevent spammers from misusing your chat room. Our AntiSpam can also block words, by blacklisting unwanted words and preventing the abuse of your chat room. We always stay at the forefront of technology to provide the best chat experience. Therefore, a TV station and radio station can have their own chat room without the worry of spam.

Browser Independent Embed

As an HTML chat room, we need to be independent of browsers. We should not discriminate browsers by favor of one or few particular browsers. Therefore, we develop our service to be browser-independent. Regardless of the browser you use, It is supported in all browsers. You do not have to worry what type of browser you use because Rumble Talk supports all browsers.

Html5 for members chat room

As a result of rapid technological advancement in the field of information technology, there are so many technologies available. In order to standardize them, industry leaders develop common standards. Such a standard is followed strictly by Internet applications. Therefore, a RumbleTalk platform can integrate smoothly into the latest technology.

HTML Chat Room With Freedom of Style

One distinctive feature of our chat platform is the freedom we provide for you, our users.
We have developed a technology that allows you to control your own chat style. You can control the size of your chat window, and you can choose whether to embed your chat room window as a floating window or as a part of the page. You can have your own chat room window viewed as an independent window, which you can adjust its size and separate from the main browser’s window. Or else, you can have it integrated into the main window. It is all up to your preferences.

freedom of html chat room css styling
freedom of HTML chat room CSS styling

The freedom is in your hand. One thing for sure is when you have installed a chat room, your own stylish chat room is now in your possession.

Join our Facebook page or Google Plus and Twitter to keep updated with the latest information from the best HTML chat room available.

Create your own HTML chat room here.

11 CSS tricks to style up your mobile group chat theme

When you want to design your chat theme using CSS, you can design your web version with the admin panel. This will change the chat’s look on your PC & laptop. See here instructions on how to do it. Now, since the mobile version is totally different than the web version, one has the option to create their own custom mobile CSS design.  RumbleTalk introduced a feature that allows customers to design also their mobile group chat theme using CSS.

All you have to do is:

  1. Copy the CSS code you find suitable from this post.
  2. Log into your RumbleTalk admin panel.
  3. In the chat settings, under “Design”, click on “Add CSS for Mobile Browsers”.
  4. Paste your code and close the box.

learn more about CSS tricks here

Using CSS adjustment is an advanced feature that is available for customers with CSS knowledge. You can see below some common tricks asked by customers to control their mobile design.

1. Changing the default image of a guest user using CSS

User icon guest   You may change the default guest user for your mobile group chat to any image by using your own image URL.

#list > div:not(.admin) .user-image,
.main-message-container:not(.admin) .message-user-image {
  width: 0 !important;
  padding-right: 32px;
  background-image: url("//rumbletalk-images-upload.s3.amazonaws.com/cc244d13c0e7e7bb6c4b63830314dc61/1444667334-usericon-blue.png");
  background-repeat: no-repeat;
}

user image change via css

2. Changing the ADMIN image

User icon admin   You may change the default ADMIN user to any image by using your own image URL.
.admin .user-image,
.admin .message-user-image {
background-image: url("//rumbletalk-images-upload.s3.amazonaws.com/cc244d13c0e7e7bb6c4b63830314dc61/1444667334-usericon-white.png");
}

2. Changing the ADMIN text color

You may change the default ADMIN text color.
.admin .message-user-name,
.admin .user-name {
color: #2DA8E0 !important;
}

3. Changing the Top and/or Bottom Bar color

You may change the color of the header and footer area of your mobile chat.
.top-bar,
#top-bar-left,
#top-bar-right { background-color: #3D5B9B; }
#bottom,
#bottom button { background-color: #3D5B9B; }

header and footer color change

4. Changing the chat background color

You may change the chat background from white to any color you want.
#chat { background-color: #607D8B; }

5. Load the background image

You may load any image as your mobile chat background.
#chat { background: url("//d1pfint8izqszg.cloudfront.net/images/skins/40000/background.jpg") no-repeat scroll center center; }

change chat background color

6. Change Fonts size

You may change the size of the font to your own liking.

Font of the messages a user sends:
#chat { font-size: 20px; }
 
Username font in the chat area (next to the messages):
.message-user-name { font-size: 20px; }
 
The username font in the user’s list:
.user-name { font-size: 20px; }
 
The font in the setting buttons:
#options-mobile li a span { font-size: 20px; }

 

7. Hide Buttons in the chat menu

You may hide buttons in the mobile menu view.

Hide Full-Screen button
.options-dialog .popup {
display: none !important;
}

Hide QR code button
.options-dialog .qr-option {
display: none !important;
}

Hide font size buttons

.options-dialog .font-size {
display: none;
}

Hide pin the position button
.pin-li { display: none; }

Hide sound on/off button
.options-dialog .toggle-sound {
display: none;
}

Hide logout button
.options-dialog .logout {
display: none !important;
}

Hide export transcript button

.options-dialog .export {
display: none !important;
}

8. Change Message Background Color

Changing the message background color includes, changing the background, changing the text color and changing the tip of the message (the small triangle pointing to the user image).
.message-bubble { background-color: #333333 !important; }
.message-text { color: #ffffff; }
.main-message-container::after {
border-left-color: #333333;
border-right-color: #333333;
}

9. Change the user’s list background color

Changing the user’s list background.
#list-frame { background-color: #183f07; }

Admin-only CSS tricks

10. Removing the admin mode option from the chat menu

This will remove the admin mode option.

.options-dialog .admin-mode-switch { display: none; }

11. Removing the option to delete chat messages from the chat menu

This will remove the option to delete chat messages.

.options-dialog .clear-messages { display: none !important; }