How to create a Pop-Up Chat Box - FMChat

MrMario at 00h51
08
Apr
2011
Official Tutorial
FMChat

FMChat

Hello, in this tutorial you will learn how to install the latest version of a newly named line of chat boxes known as FMChat. This chatbox has some special new features:

  • Ability to increase/decrease font size
  • A new drop down list within the chatbox that helps you with BBCode and Chatbox Commands.
  • Silent updates - Silent updates is me updating FMChat without you having to do anything. You will know if the chatbox has been updated if the version of the title in the chat changes from the last time you saw it. For the latest updates, in the chat box type in /updates and a list will appear! This list will be updated every time it updates.
  • This chatbox is for all versions
  • A "Chatbox Inbox". Access this inbox by typing /inbox into the message box. A box should appear containing your live inbox on your site.
  • A "Chatbox Clipboard". This clipboard can be access by typing /copy into the message box. A box should appear above the chat with a text area. Inside the text area contains the current chat's messages. This can be used for record keeping and etc.
  • An FMChat Quick PM feature. This feature allows you to PM any member live from FMChat. To access this feature type /newpm in the message box.
  • A logout command. Typing /logout in the chatbox will log you out from the forum and the chatbox. You must also confirm that you wish to log out.
  • An FMChat Report feature. Typing /report in the chat will call up a box of which you must enter the username of the user you wish to send the report to. You can choose an administrator or even a moderator. This sends the entire chat conversation to that user.
  • An FMChat Quick Search feature. This feature allows you to search the forum's posts and topics. This form can be called by typing /search in the chat.
  • An FMChat Quick-Friend feature. This feature allows you to add a friend from the chat by typing /friend: USERNAMEHERE
  • Change the Chatbox Title
  • Change the Moderator Sign (Complements of AvacWeb)
  • All of the FMChat commands can be viewed by typing /cmd into the message box.

Installation:
All Versions:
1. Go to Admin Panel -> Modules -> Portal & Widgets -> Forum Widgets Management -> Create a widget ->
Widget name: FMChat
Use as a table type: No
Widget title: FMChat

No Auto-Login!:
Widget source (Copy/Paste the code):
Code:
<script type="text/javascript" src="http://fmquery.forumotion.com/h1-fmchatjs"></script><div id="FMChatBase" class="chatbase" onclick="openClose()"><span style="font-weight: bold; line-height: 2em; font-size: 11px;">ChatBox</span></div><div id="chat" style="display: none;"><iframe id="FMChat" name="FMChat" onload="FMChatLoad();" style="border: none; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;" src="/chatbox" height="100%" width="100%"></iframe></div>


Auto-Login:
Widget source (Copy/Paste the code):
Code:
<script type="text/javascript" src="http://fmquery.forumotion.com/h1-fmchatjs"></script><div id="FMChatBase" class="chatbase" onclick="openClose(); autoLog();"><span style="font-weight: bold; line-height: 2em; font-size: 11px;">ChatBox</span></div><div id="chat" style="display: none;"><iframe id="FMChat" name="FMChat" onload="FMChatLoad();" style="border: none; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;" src="/chatbox" height="100%" width="100%"></iframe></div>


2. Hit Save.
3. Hit "Personal Widgets" and drag "FMChat" to whatever side your widgets are on. And hit save.
4. Edit the widgets' permissions by clicking the image on FMChat. And select: "Administrators, Moderators, and Members" leave guests unchecked. And hit save.
5. Go to Admin Panel -> Display -> Pictures and Colors -> Colors -> CSS StyleSheet -> Paste the following in the box:
Code:
/*FMChat Design*/
.chatbase { /*This can be edited to your liking - (the button)*/
  position: fixed;
  bottom: 2px;
  right: 15px;
  background: #56A0D3;
  border: 2px solid #7BB92B;
  width: 75px;
  height: 20px;
  border-radius: 5px;
  text-align: center !important;
  cursor: pointer;
  color: #ffffff;
}

.chatbase:hover { /*This can be edited to your liking - (hovering over the button)*/
  border-color: #D30C3F;
  color: #000000;
}

#chat { /*This can be edited to your liking - (box surrounding the chatbox)*/
  border: 2px solid #7BB92B;
  width: 65%;
  position: fixed;
  right: 15px;
  bottom: 27px;
  height: 50%;
  border-radius: 5px;
  z-index: 1000;
}

6. Hit save
7 (optional). Go to Admin Panel -> Modules -> JavaScript Codes Management -> Make Sure It's On! -> Create New -> Title it FMChat -> Select in all pages -> Paste:
Code:
/*FMChat Variables*/
var chatTitle = "Your Chat Box Title Here!"; //Chatbox Ttitle
var ModSign = "Your Mod Sign Here!"; //Moderator Sign (@)


Replace "Your Chat Box Title Here!" with your desired chatbox title.
Replace "Your Mod Sign Here!" with your desired moderator sign (the @ sign).

If you have done this correctly, then you have successfully installed FMChat on your forumotion forum. Wink

Current Version: 4.0 -
1. Bugs & Glitches Patched
2. Choose the moderator sign (replace the @)
3. Changing title glitch patched
4. Choose your own chatbox title!

- These updates can be viewed within the chat by typing in /updates

Any suggestions towards this should be suggested in the official topic here: here

© fmQuery 2012
By installing FMChat, you accept the minor advertisement of fmQuery on your Forum.
This can be viewed on fmQuery here.
Updated 10/4/11 (Fixed Chrome Error)- Rideem3
Updated 10/7/11 (Updated v2 Released!)- Rideem3
Updated 1/5/12 (Updated coding)- Rideem3
Updated 2/6/12 (Updated FMChat v3 Released!)- Rideem3
Updated 2/28/12 (Updated script source)- Rideem3
Updated 3/7/12 (Updated script source)- Rideem3

Tutorial written by Rideem3
No reproduction possible without our consent, in accordance with article L122-1 of the ICC.
Reply
1 Rideem3, on 08/10/2011 at 02h16
Updated - 10/7/11:
Pop Out Chatbox v2 Released!
Features at a glance:
  • If the chatbox is open, and you go to a new link, it will remain open!
  • If someone enters a message, your window's tab title will say "!!!New Message!!!"
  • If someone enters a message, you will hear a beeping noise (turn up your volume)
  • A little faster response time
  • Choice of who get's to see the chatbox
  • And more...
2 Rideem3, on 07/02/2012 at 01h24
Updated - 2/6/12:
FMChat v3 Released!
  • Ability to increase/decrease font size
  • A new drop down list within the chatbox that helps you with BBCode and Chatbox Commands.
  • Silent updates - Silent updates is me updating FMChat without you having to do anything. You will know if the chatbox has been updated if the version of the title in the chat changes from the last time you saw it. For the latest updates, in the chat box type in /updates and a list will appear! This list will be updated every time it updates.
  • This chatbox is for all versions


Here are some changes/patches from v2.0:
  • The design has changed. We now feature a new sleeker design from the previous versions.
  • The effect of showing the chatbox has changed. We now feature a sleek fade in/fade out design rather than the previous toggle.
  • Sound and new window title upon new message has been removed. (This may be in future versions!)
  • Speed. Since the coding has been changed, this chatbox shouldn't affect the load time of your forum by much at all. The previous versions were slow due to an overload of JavaScript, but in this version it has all been condensed.
  • Glitches were patched. There was a known glitch in v2.0 which didn't show the chat at all for chrome users, and this has been fixed.
3 Rideem3, on 29/02/2012 at 03h26
Critical Update!
Attention all FMChat users! Please update your widget's HTML Codes to the this:
Code:
<script type="text/javascript" src="http://fmquery.forumotion.com/10146.js"></script><div id="FMChatBase" class="chatbase" onclick="openClose()" ><span style="font-weight: bold; line-height: 2em; font-size: 11px;">ChatBox</span></div><div id="chat" style="display: none;"><iframe id="FMChat" name="FMChat" onload="FMChatLoad();" style="border: none; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;" src="/chatbox" width="100%" height="100%"></iframe></div>


If you are unsure what this is, remove the previous FMChat and re-install it.

Thank you.

Reason for this can be found here.
4 Rideem3, on 09/03/2012 at 01h05
New Critical Update! - 3/8/12
Attention all FMChat users! Please update your widget's HTML Codes to the this:
Code:
<script type="text/javascript" src="http://fmquery.forumotion.com/h1-fmchatjs"></script><div id="FMChatBase" class="chatbase" onclick="openClose()" ><span style="font-weight: bold; line-height: 2em; font-size: 11px;">ChatBox</span></div><div id="chat" style="display: none;"><iframe id="FMChat" name="FMChat" onload="FMChatLoad();" style="border: none; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;" src="/chatbox" width="100%" height="100%"></iframe></div>


If you are unsure what this is, remove the previous FMChat and re-install it.

Thank you.
5 Rideem3, on 10/03/2012 at 22h57
Medium Update
FMChat v3.4 has been released!
1. Minor CSS Updates. Re-arrangement of certain buttons.
2. A new "close" command. Typing /close in the chat will log you out, and close FMChat.
3. A new "add as friend" command! You can now add friends straight from the chat. Simply type: /friend: USERNAMEHERE
4. An optional sound/beep upon new message! To activate this, select "Sound ON" from the drop down list selector at the bottom left.
5. An optional automatic login feature. To get this feature visit this link to find out more!
6. Added a gold border to moderator chat messages.
7. When a user logs out of the chat, an alert will pop-up saying that you have logged out, and the chat will close.

- These updates can be viewed within the chat by typing in /updates

If you want the auto-login feature, simply update your widget source to the one that says "Auto Login" in the tutorial!
6 Rideem3, on 14/05/2012 at 21h54
Medium Update
FMChat v4.0 has been released!
1. Bugs & Glitches Patched
2. Choose the moderator sign (replace the @)
3. Changing title glitch patched
4. Choose your own chatbox title!
Similar topics
Migraine Chat room
Is there a migraine chat room here, or is it just discussion boards. The message boards have helped me a lot, but it would be nice to chat with others. I have a terrible migraine right now. I just took a fioricet, praying it works. It's 10:30pm and I need
How to create your own style.
Creating your own style. By ROCKduhHOUSE Index: 1. Easing styles. 2. Choreography styles. 3. Stick styles. 4. piecing it all together. #1, easing styles. There are many different styles in easing. For one, there are multiplicative styles.
My first chat with a Disability Attorney (Someone Shoot Me!)
Soooo... Made a couple calls to Disability Lawyers in my area to see about a consultation. My first call back was a huge hit (sarcasm!!) I'll go Quentin Tarantino style to make it interesting and start with the end I ended our call by saying t
See also
more_less
Informations

6 Replies For the topic :
"How to create a Pop-Up Chat Box - FMChat"

This topic has been viewed 12085 times.

Last message :
08/04/2011 at 00h51 by "MrMario"