fubar Blog by «§te_v_ens³»: How To's

How To's
author:	«§te_v_ens³» 2nd day of Vacation I cant find my clothes :( I needs a ... Jacksonville, FL
last post:	2009-08-29 15:30:28
posts:	10
views:	8719
who can view:	everyone.
who can comment:	everyone.

this blogs newest posts
(How To) NSFW_List 2009-08-29 15:30:28 (1073 views) (18 comments)
(How To) Clear Cookies & Cache {Repost} 2009-08-21 13:26:21 (936 views) (1 comments)
(How To) Basic_Lounge_Skin {Updated} 2009-08-13 02:33:53 (1019 views) (5 comments)
(How To) for Newbies 2009-06-19 14:17:53 (2170 views) (2 comments)
(How To) Different_Color_Names 2009-04-27 14:07:46 (1115 views) (3 comments)
Blogging part 1 2009-04-20 23:57:54 (167 views) (2 comments)
(How To) Code Lounges 2009-03-11 22:59:34 (2660 views) (6 comments)
(How To) Screen Grab 2009-01-09 15:45:29 (387 views)
(How To) Salute 2009-01-09 15:44:29 (378 views) (1 comments)
(How To) Fu-Own 2009-01-09 15:44:25 (225 views) (1 comments)
(see all)

other blogs by this author
blog	Posts	Last Post
Top Secret	1	2009-11-02
Halloween Skin{Test Blog}	4	2009-10-05
Players and Codes	1	2009-09-16
How To's	10	2009-08-29
Fubar_Pastor_Blog	3	2009-08-11
Real Life	2	2009-06-16
Private_1	23	2009-05-24
Important Inoformation (Anything)	1	2009-05-08
Password	4	2009-03-02
Browser Stuff / Tweaks	5	2009-01-19
Fubar Support	9	2008-12-08
Interactive Fubar Tutorials	9	2008-10-17
blog testing	29	2008-09-02
Lounge Skins	2	2008-08-20
Poems	2	2008-07-29
Lounge Expert Requirements	1	2008-06-25
Funny Thing I find	4	2007-11-21
ALL CSS Properties	1	2007-10-29
Computers	7	2007-10-08
Yahoo Chat Fix	1	2007-10-02

Share this blog:

(How To) Code Lounges
created @ 2009-03-11 22:59:34

So you want to code a FUBAR Lounge.. To be able to create a Lounge you must be at minimum level ten or above img_level

. Its not rocket science when coding a lounge. Below I will give small examples of how a lounge is coded, at the bottom of the page ill have it linked to a fubar basic lounge template I currently use in all lounges I code.. I will only go over the major Parts of The Lounge Coding. Everything else can be obtained in the live code blog. there are also two different sections. As you can see below if the code has <style type="text/css"></style> in it then it will go into the motd section of edit lounge.

General
The General tab is where the Lounge Settings are Placed

General

Skin

MOTD

Music

Video / Custom 1

Custom 2

Custom 3

Promote

Modify general lounge settings
lounge name:
lounge keywords - NEW! (enter up to 10 keywords for your lounge, separated by commas, to show up in more lounge searches)
Posting type:
private (members/invite only)		profanity filter
display bar tab/shoutbox

lounge icon:	(click on icon to change it)

Skin
The Skin Tab is where the Lounge's Pure CSS codes are Placed

General

Skin

MOTD

Music

Video / Custom 1

Custom 2

Custom 3

Promote

Last change made by: Stevens³~ Fubar Bouncer² / Lounge Expert¹ (1 month ago)

NOTE: For this to work correctly with your skins, please omit all HTML tags, including the STYLE tag. They will be added around your skin code, automatically.

edit lounge skin:

Click here to upload a CSS file

Motd
The MOTD Tab is where the CSS Images and Other HTML Content is Placed

General

Skin

MOTD

Music

Video / Custom 1

Custom 2

Custom 3

Promote

Last change made by: Stevens³~ Fubar Bouncer² / Lounge Expert¹ (2 months ago)

Would you like to customize?

default motd style:

div.new_lounge_motd_div { text-align: center; font-size: 18px; margin: 10px;}
To customize,copy this and click the Skin tab.
 Then, paste or enter what you you see above.
Make the changes that you would like.

edit lounge motd:

Body_Code_Skin	Body_Code_Motd
This code symbolizes what needs to be added to the skin section of edit lounge	This code symbolizes what needs to be added to the motd section of edit lounge
body{ visibility: show!important; display:--!important;}	<style type="text/css">/* Places Background In Lounge */ body{ background-image: url('Background URI Here')!important; stress: 75; background-repeat: repeat!important; background-attachment: fixed!important; background-position: center center!important;}</style>

Header_Codes

Top_Header

The top header holds pretty much everything from the menu to the Happy Hour sponsor to the scrolling online members.

Top_Right_Header

The right portion of the top.header is comprised of the scrolling online members.

Motd_Area

The MOTD is where most of a lounges main content goes into

Links / User_colors

Color_Names

Stevens

Stevens

Stevens

Stevens

Stevens

Stevens

Stevens

Stevens

Stevens

Stevens

Stevens

Stevens

Stevens

Chatbox_Codes

Saybox

say:

The say box is the entry way into the chatbox portion. Its pretty much where everything is typed before being placed onto the chatbox

Saybox

Stevens³~ Fubar...: This is the text for staff members delete

SCRAPPER: This is the text for non-staff members.. delete

The chatbox is where eveything that was typed in the saybox gets placed

Extra_Chatbox_Codes / Staff, Non-staff Text

Non-Staff	Staff
/Non-Staff Shout/ td.lounge_shout_msg{visibility: show!important; display:--!important; color: #F8F8FF!important; zoom: 100%; font-size: 11pt!important; font-family: calligraph421 BT; font-weight: bold!important; text-decoration: none!important;}	/* Staff Chat Text */ span.new_lounge_staff_shout{visibility: show!important; display:--!important; color: #DC143C!important; zoom: 100%; font-size: 13pt!important; font-family: pristina; font-weight: bold!important; text-decoration: none!important;}

Lounge_Enter	Lounge_Exit
/* Enter */ td.lounge_enter_notice{visibility: show!important; display:--!important; font-size: 11pt; color: #FF0000!important; font-family: arial, times new roman, san sarif;}	/* Exit */ td.lounge_exit_notice{visibility: hidden!important; display: none!important; font-size: 11pt; color: #FF0000!important; font-family: arial, times new roman, san sarif;}
Buy_Round	Lounge_Emote
/* Drinks */ td.lounge_round_notice{visibility: show!important; display: -!important; font-size: 11pt; color: #FF0000!important; font-family: arial, times new roman, san sarif;}	/* Emotes */ td.lounge_shout_emote{visibility: show!important; display:--!important; font-size: 11pt; color: #FF0000!important; font-family: arial, times new roman, san sarif;}
Lounge_Subscribe	Lounge_Notice
/* Subscribe */ td.lounge_shout_subscribe {visibility: show!important; display:--!important; font-size: 11pt; color: #FF0000!important; font-family: arial, times new roman, san sarif;}	/* Shows when Members are Ejected/Banned / td.lounge_shout_notice{visibility: show!important; display:--!important; font-size: 11pt; color: #FF0000!important; font-family: arial, times new roman, san sarif;}/ important chat room notices to user such as that they've been silenced */ div.new_lounge_notice_div {text-align: center; margin: auto; color: #7FFF00; font-weight: bold; font-size: 14pt;}

Lounge_Info	Lounge_Options
The Lounge Info box is where all the lounges information is held (ie. Lounge Name, Subscribed Members, Date Lounge was Created, and The Owner of the Lounge.	The Lounge Options box is where all the lounges links are contained (ie. Show Subscribed Members, Buy Lounge Drinks, (Owner's only: Promote Lounge), Edit Lounge Settings / Code, Banned Members and Subscribe / Unsubscribe.
/* Changes the Lounge Info Table */ div.new_lounge_info_div{visibility: show!important; display: -!important; background: #000000!important; background-color: #000000!important; top: 0px; filter: alpha(opacity=75); -moz-opacity:0.75; opacity:0.75; -khtml-opacity:0.75;}	/* Changes the Lounge Options Table */ div.new_lounge_opts_div{background: #000000!important; background-color: #000000!important; top: 0px; filter: alpha(opacity=75); -moz-opacity:0.75; opacity:0.75; -khtml-opacity:0.75;}
div#new_lounge_info_div {border: 2px groove #FFA500; position: relative; float: right; /width: 250px;/ width: 25%; margin: 10px; margin-bottom: 5px; padding: none; clear: right; display: block; overflow-x: hidden;}	div#new_lounge_opts_div {border: 2px groove #FFA500; position: relative; /width: 250px;/ width: 25%; float: right; margin: 10px; margin-top: 5px; margin-bottom: 5px; padding: none; clear: both; display: block}
table.lounge_info {height: 15%; /filter: alpha(opacity=75); -moz-opacity:0.75; opacity:0.75; -khtml-opacity:0.75;/}	table.lounge_opts { height: 15%; /filter: alpha(opacity=75); -moz-opacity:0.75; opacity:0.75; -khtml-opacity:0.75;/}
th.lounge_info{font-size: 16px; color: #FF0000!important; padding: 5; font-family: arial, times new roman, san sarif; font-weight: bold; border-bottom: 1px groove #F8F8FF;}	th.lounge_opts{ font-size: 16px; color: #FF0000!important; padding: 5; font-family: arial,times new roman, sans serif; font-weight: bold; border-bottom: 1px groove #F8F8FF;}
td.lounge_info{ zoom: 100%; font-size: 12px; background-color: transparent!important; color: #F8F8FF!important;}	td.lounge_opts{ text-align: left: padding: 5; font-size: 12px; background-color: transparent!important;}
td.lounge_info a{color:--!important; font-weight: bold!important;}	td.lounge_opts a{font-weight: bold!important; color:--!important;}

Online_Member_Box

The Lounge Online Member box shows pretty much any logged in memeber in a box shown above. It displays the members image. Below is what happens when you hover or click a name in that box..

This is for Mozilla Based Browser

And this is for All IE based browsers

Pretty much this concludes the easy part of creating a Lounge. If you have any addition questions on Lounges you can either message me or you can contact a Lounge Expert by going to this blog. I'll be adding more useful tools to this blog in a short time. If you have any ideas you think I missed out please do lemme know.. For a full Version of a working lounge code please go here

Edits:
1/28/09, 2215 PST: Started creating live boxes replacing images, as well as took out top_left banner hide.
3/12/09, 2255 PST: Live Boxes 75% complete, Worked on overall codes for updating.

2660 views

6 comments

0 ratings

Report as NSFW (Not Safe For Work) [?]

Recent readers