Here it is. The very first shoutbox that is basicly built into your forum! There are many features with this shoutbox, and more will be added later. The shoutbox that I have created fully is only for FireFox, and there is a section in the code where you can add in your own shoutbox for the IE users.
Updates Since - 10/18/2007-The shoutbox will automaticly change pages when a new page is added.
Features-Only on the Index
-Allow guests to view or not view shouts.(Guests can't shout)
-Either Allow all members to view the Info section, or just certain Members
-Hide The Board for the Shoutbox topic(s)
-Add the shoutbox to the bottom or top of your forum. You choose!
Step OneYou will need to create a new board...
Admin >> Boards >> Add Board.
Call the new board "Shoutbox" and put it where ever you would like.
Make sure all the groups can view that board.
If you want, you can have it so that the post count doesn't go up.
Once Added, go to Step 2.
Step 2Go to the new board you created and look up top at the URL. You will see somthing like this:
http://shoutbox.smfforfree3.com/index.php/board,1.0.html
Rembmer that number.
NOTE: The number will be different than the one above.
Step 3Now when your in that board, create a new topic. Call the topic Shoutbox, then, if your not already in the topic, go to it. Look up at the top at the URL. You will see somthing like this:
http://shoutbox.smfforfree3.com/index.php/topic,3.0.html
NOTE: The number will be different than the one above.
Step 4Now that you have those steps done, you may add the shoutbox code to your footers.
Where it says BOARD NUMBER in the code, replace it with the number you had in Step 2.
Where is says TOPIC NUMBER in the code, replace it with the number you had in Step 3.
Step 5Here is the part where you get to sorta customize it.
This is what each of the features are. These features are mainly for the Firefox Users.
Change the "0" to a "1" to make it work:
guestview - If set to "1", you can let the guests see the Shouts
hideboard - If set to "1", the Shoutbox board you created wouldn't appear on the index.
ieforff - If set to "1", this will allow the Firefox users see the Internet Explorer Shoutbox.
Step 6In this step, you will be able to set who you want to see the info, which is a little nifty part of the shoutbox that showes the latest updates.
Look at this part of the code:
var infos = ["MEMBER"];
Just replace the MEMBER part with a name. If you want to add more people, just do this:
var infos = ["MEMBER","MEMBER"];
And So on.
If you want to have it so that everyone can see the info, just leave it like this:
var infos = [""];
Step 7Here is where you get to choose the IE shoutbox. Just go to any website, like http://www.cbox.ws to get your own shoutbox for it.
Once you get the code for it, you will need to make sure you take out all the ENTER's. The code will only work if all of them are out.
Step 8Now you can choose where you want the shoutbox to be.
When you look at the code, you will see something like this:
$("#bodyarea").prepend("<span id='shoutboxff'></span>")
$("#bodyarea").after("<span id='shoutboxie'></span>")
The top part is for the Firefox shoutbox, and the bottom is for the Internet Explorer one.
How it is set right now, the FF shoutbox will be at top, and the IE will be at bottom. I am pretty sure you will want to change it though right? This is how:
Just replace the little coding above with this:
FF shoutbox on Bottom/IE shoutbox on Top:$("#bodyarea").append("<span id='shoutboxff'></span>")
$("#bodyarea").prepend("<span id='shoutboxie'></span>")
Both On top:$("#bodyarea").prepend("<span id='shoutboxff'></span>")
$("#bodyarea").prepend("<span id='shoutboxie'></span>")
Both On Bottom:$("#bodyarea").append("<span id='shoutboxff'></span>")
$("#bodyarea").append("<span id='shoutboxie'></span>")
Step 9Add this code into your Footers and Change the information like I mentioned above!
<script>
var board = BOARD NUMBER;
var topic = TOPIC NUMBER;
var guestview = 0;
var hideboard = 0;
var ieforff = 0;
var infos = [];
var infos = ["MEMBER"];
var ieusers = 'SHOUTBOX HERE'
$("#bodyarea").prepend("<span id='shoutboxff'></span>")
$("#bodyarea").after("<span id='shoutboxie'></span>")
</script>
<script src="http://h1.ripway.com/smcodes/shoutbox.js"></script>
There ya go! I hope you like the code!
If you have any questions about how to set it up, just ask for help!