The forum of the forums
Welcome on the Forumotion Support Forum.

To take full advantage of everything offered by our forum, please log in if you are already a member or join our community if you're not yet....



Create a free forum like this one.
How to create a Pop-Up Chat Box - FMChat 5 5 22

How to create a Pop-Up Chat Box - FMChat

The forum of the forums :: About Forumotion ::   :: Tips & Tricks

View previous topic View next topic Go down

How to create a Pop-Up Chat Box - FMChat

Post by MrMario on April 7th 2011, 4:51 pm

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.


Last edited by MrMario on November 29th 2011, 11:30 pm; edited 1 time in total

MrMario
Helper
Helper

Male
Posts: 22294
Language: English
Location: United States of America
Points: 74049
Join date: 2008-06-10

Back to top Go down

Re: How to create a Pop-Up Chat Box - FMChat

Post by Rideem3 on October 7th 2011, 6:16 pm

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...

----------------------------


Rideem3
Support Moderator
Support Moderator

Male
Posts: 3348
Language: English l CSS l HTML l JavaScript l PHP | Python | Java
Location: United States of America
Points: 4146
Join date: 2009-05-10

http://www.fmquery.com/forum/

Back to top Go down

Re: How to create a Pop-Up Chat Box - FMChat

Post by Rideem3 on February 6th 2012, 5:24 pm

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.

----------------------------


Rideem3
Support Moderator
Support Moderator

Male
Posts: 3348
Language: English l CSS l HTML l JavaScript l PHP | Python | Java
Location: United States of America
Points: 4146
Join date: 2009-05-10

http://www.fmquery.com/forum/

Back to top Go down

Re: How to create a Pop-Up Chat Box - FMChat

Post by Rideem3 on February 28th 2012, 7:26 pm

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.

----------------------------


Rideem3
Support Moderator
Support Moderator

Male
Posts: 3348
Language: English l CSS l HTML l JavaScript l PHP | Python | Java
Location: United States of America
Points: 4146
Join date: 2009-05-10

http://www.fmquery.com/forum/

Back to top Go down

Re: How to create a Pop-Up Chat Box - FMChat

Post by Rideem3 on March 8th 2012, 5:05 pm

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.

----------------------------


Rideem3
Support Moderator
Support Moderator

Male
Posts: 3348
Language: English l CSS l HTML l JavaScript l PHP | Python | Java
Location: United States of America
Points: 4146
Join date: 2009-05-10

http://www.fmquery.com/forum/

Back to top Go down

Re: How to create a Pop-Up Chat Box - FMChat

Post by Rideem3 on March 10th 2012, 2:57 pm

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!

----------------------------


Rideem3
Support Moderator
Support Moderator

Male
Posts: 3348
Language: English l CSS l HTML l JavaScript l PHP | Python | Java
Location: United States of America
Points: 4146
Join date: 2009-05-10

http://www.fmquery.com/forum/

Back to top Go down

Re: How to create a Pop-Up Chat Box - FMChat

Post by Rideem3 on May 14th 2012, 1:54 pm

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!

----------------------------


Rideem3
Support Moderator
Support Moderator

Male
Posts: 3348
Language: English l CSS l HTML l JavaScript l PHP | Python | Java
Location: United States of America
Points: 4146
Join date: 2009-05-10

http://www.fmquery.com/forum/

Back to top Go down

View previous topic View next topic Back to top

The forum of the forums :: About Forumotion ::   :: Tips & Tricks

Permissions in this forum:
You cannot reply to topics in this forum