Tessisamess

S	M	T	W	T	F	S
	1	2	3	4	5	6
7	8	9	10	11	12	13
14	15	16	17	18	19	20
21	22	23	24	25	26	27
28	29	30	31

P R E V I E W P A G E S
ALL-IN-ONE | PREMISE | RULES
FAQ | CAST LIST | APPLICATION

001: Informative Info

Here's a big one for you guys! There are two versions of this code. A clean and easy to navigate all-in-one setup for people who prefer all game info to be on one page, and separated pages for people who prefer to have more differentiation. Please note that these are for HTML pages only, so you need a Scribbld account, paid/permanent IJ account, or web hosting account to use them. Enjoy! <3

002: All-In-One Page

Paste the following into a code tester, then follow the directions below!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/2000/REC-xhtml1-20000126/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

@font-face{font-family: 'Open Sans';font-style: normal;font-weight: 400;src: local('Open Sans'), local('OpenSans'), url(http://themes.googleusercontent.com/static/fonts/opensans/v6/cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');}
@font-face{font-family: 'Open Sans';font-style: normal;font-weight: 600;src: local('Open Sans Semibold'), local('OpenSans-Semibold'), url(http://themes.googleusercontent.com/static/fonts/opensans/v6/MTP_ySUJH_bn48VBG8sNSnhCUOGz7vYGh680lGh-uXM.woff) format('woff');}

body{background:#222;margin:0;padding:0;font-size:12px;font-family:helvetica,arial,sans-serif;}
textarea{border:2px solid #ddd;width:99%;min-height:200px;max-height:400px;font-size:11px;font-family:Open Sans;color:#555;background:#f9f9f9;padding:5px;margin:8px 0;}
ul{list-style-type:none;}
li{display:block;height:16px;line-height:16px;margin-bottom:8px;background:url(http://i.imgur.com/f3y7wTy.png)left center no-repeat;padding-left:19px;}
b{font-family:Open Sans;}
#content{margin:0 auto;width:1000px;padding:60px 20px 20px 20px;color:#252525;text-align:justify;background:#f9f9f9;font-size:14px;}

#topbar{height:40px;background:#000;line-height:40px;position:fixed;z-index:100;top:0;left:0;right:0;color:#ddd;padding:0 10px;border-bottom:1px solid #333;}
#topbar a{padding:0 10px;width:120px;display:inline-block;margin:0;border-left:1px solid #252525;border-right:1px solid #333;text-align:center;text-decoration:none;color:#bbb;height:37px;line-height:37px;}
#topbar a:hover{color:#ddd;background:#252525;border-left:1px solid #333;border-right:1px solid #444;}
#gname{display:inline;font-weight:600;font-family:Open Sans;margin-right:10px;font-size:16px;}
#cred{width:20px!important;}

#info{margin-left:320px;line-height:190%;}
.title{display:block;font-size:19px;padding:7px 0;border-top:1px solid #ddd;border-bottom:1px solid #ddd;margin-bottom:10px;font-family:Open Sans;font-weight:600;}
.title img{height:19px;margin-bottom:-3px;opacity:0.6;}
.answer{border-left:3px solid #ddd;padding-left:5px;font-color:#444;margin:5px auto 15px auto;width:90%;}
#button{text-align:center;}
#button a{text-align:center;padding:4px 0;text-decoration:none;color:#444;display:inline-block;width:180px;margin:5px;background:#eee;border:1px solid #ddd;font-weight:600;font-size:17px;font-family:Open Sans;}
#button a:hover{background:#ddd;border:1px solid #ccc;}

#sidebar{position:fixed;z-index:50;width:300px;float:left;background:#eee;font-family:Open Sans;}
.sidetitle{padding:6px 10px;background:#666;color:#f9f9f9;font-size:18px;font-weight:600;}
#sidebar img{float:left;height:32px;margin-right:10px;opacity:0.6;}
#sidebar a{padding:10px;height:32px;line-height:32px;display:block;margin:0;border-bottom:1px solid #ddd;text-decoration:none;color:#444;}
#sidebar a:hover{background:#e5e5e5;border-bottom:1px solid #d5d5d5;color:#000;}

#castwrap{width:684px;margin:0 auto 30px auto;font-size:11px;}
.cast{display:inline-block;background:#eee;padding:5px;width:210px;margin:0 3px 9px 3px;line-height:140%;text-align:left;}
.castimg{float:left;width:70px!important;margin-top:0!important;opacity:1!important;}
.cast img{margin-right:5px;width:14px;margin-top:2px;opacity:0.7;}
.name{font-family:Open Sans;font-weight:600;color:#444;margin-bottom:3px;font-size:14px;}
.cast a{color:#000;text-decoration:none;}
.cast a:hover{color:#777;}

</style>

<div id="sidebar">
<div class="sidetitle">Navigate</div>
<a href="#1"><img src="http://i.imgur.com/vOV5hiD.png">Premise</a>
<a href="#2"><img src="http://i.imgur.com/QSOqIRQ.png">Rules</a>
<a href="#3"><img src="http://i.imgur.com/UsST869.png">FAQ</a>
<a href="#4"><img src="http://i.imgur.com/y8oK84w.png">Cast List</a>
<a href="#5"><img src="http://i.imgur.com/HWmOJsH.png">Application</a>
<a href="HOLDPAGELINK"><img src="http://i.imgur.com/kXqujpd.png">Holds & Wanted</a>
</div>

<div id="info">
<a name="1"><div class="title"><img src="http://i.imgur.com/vOV5hiD.png"> Premise</div></a>
Premise info here.<br><br>

<a name="2"><div class="title"><img src="http://i.imgur.com/QSOqIRQ.png"> Rules</div></a>
<b>Section Title</b>
<ul>
<li>Thing
<li>Thing
<li>Thing
<li>Thing
<li>Thing
</ul>

<b>Section Title</b>
<ul>
<li>Thing
<li>Thing
<li>Thing
<li>Thing
<li>Thing
</ul>

<br><a name="3"><div class="title"><img src="http://i.imgur.com/UsST869.png"> FAQ</div></a>
<b>Question?</b>
<div class="answer">Answer.</div>

<b>Question?</b>
<div class="answer">Answer.</div>

<div class="cast"><img class="castimg" src="http://i.imgur.com/YBG0uFL.png">
<div class="name">Name Here</div>
<a href="http://journalname.insanejournal.com/">journalname</a><br>
PB: PB Name<br>
<a href="DROPBOXURL" title="Dropbox"><img src="http://i.imgur.com/7advjHh.png"></a> 
<a href="BIOURL" title="Bio"><img src="http://i.imgur.com/ec7MqYd.png"></a> 
<a href="http://www.insanejournal.com/friends/add.bml?user=journalname" title="Add Friend"><img src="http://i.imgur.com/ALSguPl.png"></a> 
<a href="http://www.insanejournal.com/allpics.bml?user=journalname" title="Userpics"><img src="http://i.imgur.com/t6eegPj.png"></a> 
<img src="http://i.imgur.com/MEYB71G.png" title="AIM: Aimname">
</div>

<div class="cast"><img class="castimg" src="http://i.imgur.com/YBG0uFL.png">
<div class="name">Name Here</div>
<a href="http://journalname.insanejournal.com/">journalname</a><br>
PB: PB Name<br>
<a href="DROPBOXURL" title="Dropbox"><img src="http://i.imgur.com/7advjHh.png"></a> 
<a href="BIOURL" title="Bio"><img src="http://i.imgur.com/ec7MqYd.png"></a> 
<a href="http://www.insanejournal.com/friends/add.bml?user=journalname" title="Add Friend"><img src="http://i.imgur.com/ALSguPl.png"></a> 
<a href="http://www.insanejournal.com/allpics.bml?user=journalname" title="Userpics"><img src="http://i.imgur.com/t6eegPj.png"></a> 
<img src="http://i.imgur.com/MEYB71G.png" title="AIM: Aimname">
</div>

</div><a name="5"><div class="title"><img src="http://i.imgur.com/HWmOJsH.png"> Application</div></a>
Live view of your application.<br>

<textarea>Copy/paste view of your application.</textarea>

<div id="button">
<a href="http://www.insanejournal.com/update.bml">Post Application</a>
<a href="NEWCOMMENTLINK">Submit Application</a>
</div>

</div>
</div>
</body>
</html>

003: Separate Pages

PREMISE PAGE

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/2000/REC-xhtml1-20000126/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

#castwrap{width:684px;margin:0 auto 30px auto;font-size:11px;}
.cast{display:inline-block;background:#eee;padding:5px;width:210px;height:50px;margin:0 3px 9px 3px;line-height:140%;text-align:left;}
.castimg{float:left;width:50px!important;margin-top:0!important;opacity:1!important;}
.cast img{margin-right:5px;width:14px;margin-top:2px;opacity:0.7;}
.name{font-family:Open Sans;font-weight:600;color:#444;margin-bottom:3px;font-size:16px;}
.cast a{color:#000;text-decoration:none;}
.cast a:hover{color:#777;}

</style>

<div id="sidebar">
<div class="sidetitle">Navigate</div>
<a href="#1" class="current"><img src="http://i.imgur.com/vOV5hiD.png">Premise</a>
<a href="INFO URL1"><img src="http://i.imgur.com/QSOqIRQ.png">Rules</a>
<a href="INFO URL2"><img src="http://i.imgur.com/UsST869.png">FAQ</a>
<a href="INFO URL3"><img src="http://i.imgur.com/y8oK84w.png">Cast List</a>
<a href="INFO URL4"><img src="http://i.imgur.com/HWmOJsH.png">Application</a>
<a href="HOLDPAGELINK"><img src="http://i.imgur.com/kXqujpd.png">Holds & Wanted</a>
</div>

<div id="info">
<a name="1"><div class="title"><img src="http://i.imgur.com/vOV5hiD.png"> Premise</div></a>
Premise info here.

</div>
</div>
</body>
</html>

RULES PAGE

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/2000/REC-xhtml1-20000126/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

</style>

<div id="sidebar">
<div class="sidetitle">Navigate</div>
<a href="INFO URL1"><img src="http://i.imgur.com/vOV5hiD.png">Premise</a>
<a href="#1" class="current"><img src="http://i.imgur.com/QSOqIRQ.png">Rules</a>
<a href="INFO URL2"><img src="http://i.imgur.com/UsST869.png">FAQ</a>
<a href="INFO URL3"><img src="http://i.imgur.com/y8oK84w.png">Cast List</a>
<a href="INFO URL4"><img src="http://i.imgur.com/HWmOJsH.png">Application</a>
<a href="HOLDPAGELINK"><img src="http://i.imgur.com/kXqujpd.png">Holds & Wanted</a>
</div>

<div id="info">
<a name="1"><div class="title"><img src="http://i.imgur.com/QSOqIRQ.png"> Rules</div></a>

<b>Section Title</b>
<ul>
<li>Thing
<li>Thing
<li>Thing
<li>Thing
<li>Thing
</ul>
<b>Section Title</b>
<ul>
<li>Thing
<li>Thing
<li>Thing
<li>Thing
<li>Thing
</ul>

</div>
</div>
</body>
</html>

FAQ PAGE

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/2000/REC-xhtml1-20000126/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

#info{margin-left:320px;line-height:190%;}
.title{display:block;font-size:19px;padding:7px 0;border-top:1px solid #ddd;border-bottom:1px solid #ddd;margin-bottom:10px;font-family:Open Sans;font-weight:600;}
.title img{height:19px;margin-bottom:-3px;opacity:0.6;}
.answer{border-left:3px solid #ddd;padding-left:5px;font-color:#444;margin:5px auto 25px auto;width:90%;}
#button{text-align:center;}
#button a{text-align:center;padding:4px 0;text-decoration:none;color:#444;display:inline-block;width:180px;margin:5px;background:#eee;border:1px solid #ddd;font-weight:600;font-size:17px;font-family:Open Sans;}
#button a:hover{background:#ddd;border:1px solid #ccc;}

</style>

<div id="sidebar">
<div class="sidetitle">Navigate</div>
<a href="INFO URL1"><img src="http://i.imgur.com/vOV5hiD.png">Premise</a>
<a href="INFO URL2"><img src="http://i.imgur.com/QSOqIRQ.png">Rules</a>
<a href="#1" class="current"><img src="http://i.imgur.com/UsST869.png">FAQ</a>
<a href="INFO URL3"><img src="http://i.imgur.com/y8oK84w.png">Cast List</a>
<a href="INFO URL4"><img src="http://i.imgur.com/HWmOJsH.png">Application</a>
<a href="HOLDPAGELINK"><img src="http://i.imgur.com/kXqujpd.png">Holds & Wanted</a>
</div>

<div id="info">
<a name="1"><div class="title"><img src="http://i.imgur.com/UsST869.png"> FAQ</div></a>
<b>Question?</b>
<div class="answer">Answer.</div>

<b>Question?</b>
<div class="answer">Answer.</div>

</div>
</div>
</body>
</html>

CAST LIST PAGE

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/2000/REC-xhtml1-20000126/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

</style>

<div id="sidebar">
<div class="sidetitle">Navigate</div>
<a href="INFO URL1"><img src="http://i.imgur.com/vOV5hiD.png">Premise</a>
<a href="INFO URL2"><img src="http://i.imgur.com/QSOqIRQ.png">Rules</a>
<a href="INFO URL3"><img src="http://i.imgur.com/UsST869.png">FAQ</a>
<a href="#1" class="current"><img src="http://i.imgur.com/y8oK84w.png">Cast List</a>
<a href="INFO URL4"><img src="http://i.imgur.com/HWmOJsH.png">Application</a>
<a href="HOLDPAGELINK"><img src="http://i.imgur.com/kXqujpd.png">Holds & Wanted</a>
</div>

</div>

</div>
</div>
</body>
</html>

APPLICATION PAGE

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/2000/REC-xhtml1-20000126/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

</style>

<div id="sidebar">
<div class="sidetitle">Navigate</div>
<a href="INFO URL1"><img src="http://i.imgur.com/vOV5hiD.png">Premise</a>
<a href="INFO URL2"><img src="http://i.imgur.com/QSOqIRQ.png">Rules</a>
<a href="INFO URL3"><img src="http://i.imgur.com/UsST869.png">FAQ</a>
<a href="INFO URL4"><img src="http://i.imgur.com/y8oK84w.png">Cast List</a>
<a href="#1" class="current"><img src="http://i.imgur.com/HWmOJsH.png">Application</a>
<a href="HOLDPAGELINK"><img src="http://i.imgur.com/kXqujpd.png">Holds & Wanted</a>
</div>

<div id="info">
<a name="1"><div class="title"><img src="http://i.imgur.com/HWmOJsH.png"> Application</div></a>
Live view of your application.<br><br>

<div class="title"><img src="http://i.imgur.com/vjXd92m.png"> Checklist</div>
<ul>
<li>Check thing
<li>Check thing
<li>Check thing
<li>Check thing
<li>Check thing
</ul>

<textarea>Copy/paste view of your application.</textarea>

<div id="button">
<a href="http://www.insanejournal.com/update.bml">Post Application</a>
<a href="NEWCOMMENTLINK">Submit Application</a>
</div>

</div>
</div>
</body>
</html>

004: CTRL+F This Shit

Replacement guide works for both all-in-one and separate pages except where noted.
→Game Name Here to input your topbar title.
→commname1 to input your IC comm link.
→commname2 to input your OOC comm link.
→commname3 to input your networking comm link.
→HOLDPAGELINK to input your hold page entry link.
→Premise info here. to input your premise.
→Section Title (x2) and Thing (x10) to input rules. (Copy/paste this section as needed for your rule subsections.)
→Question? and Answer. (x5) to input FAQ.
→http://i.imgur.com/YBG0uFL.png to change cast userpic.
→Name Here to change cast member name.
→journalname (x4) to change journal name.
→PB Name to change PB name.
→DROPBOXURL to change player's dropbox URL.
→BIOURL to change player's bio URL.
→Aimname to change player's AIM name.
→Live view of your application. to input your app example.
→Copy/paste view of your application. to input your for-use application code and/or text.
→NEWCOMMENTLINK to input the comment posting link where you want your applications to be submitted.

Separated pages only:
→INFO URL1 through INFO URL4 to change the links to your other info pages.

Separate application page only:
→Check thing (x5) to fill out your application checklist (things a player should make sure they've done before applying.)

#f9f9f9

#eee

#e5e5e5

#ddd

#d5d5d5

#ccc

#bbb

#777

#666

#555

#444

#333

#252525

#222

#000

005: Rules and Shit

→Leave my credit.
→Do not redistribute in part or in whole.
→If you break something during editing don't be scared to ask me to see what happened. Yep. That's a rule.
→If you're a maker like I am and you do something cool with this I'd really like to see it, but it's not necessary.

→HTML means ya gotta BR them line breaks!

Tags: codes, codes: cast list, codes: games, html page

Profile

Title Here

Navigation

July 2024

Links List

Resources

Tags

Layout By

Full Game Code: Tidy Icons