tesscodes | Biosheet: Slides

•BIOGRAPHY•

•PERSONALITY & APPEARANCE•

•HISTORY•

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus non facilisis mauris. Aenean lacinia pretium tortor accumsan consectetur. Aliquam ultricies lacus sit amet augue scelerisque dignissim. In sit amet orci at dui feugiat semper. Sed tempor dignissim libero.

Morbi non ligula lectus, in ornare orci. Donec auctor rhoncus cursus. Morbi sit amet justo nunc, ut posuere nibh. Aliquam et tortor est, ac volutpat augue. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vivamus sed dolor sed est laoreet accumsan. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed at leo eget nunc ornare cursus vel vel dui. Aenean ligula massa, lacinia ut interdum in, malesuada pretium neque. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent auctor lacus sed orci scelerisque id vestibulum orci rutrum. Maecenas quis sodales dui. Aliquam eros sem, vehicula ut aliquet at, hendrerit mollis quam. Integer gravida sagittis tincidunt. In arcu risus, malesuada ut tempor sed, sagittis nec eros.

Maecenas venenatis sodales interdum. Morbi sit amet lorem eu dolor molestie dapibus. Pellentesque libero eros, congue at fringilla ac, venenatis sit amet nisl. Phasellus tincidunt lorem tincidunt elit tempor hendrerit sodales diam pellentesque. Donec bibendum gravida purus gravida lobortis. In quis tempor lacus. Vivamus porttitor, erat eget porttitor venenatis, purus lacus imperdiet massa, nec ultricies odio dolor sit amet massa. Fusce dictum blandit suscipit. Nullam convallis, mauris a lacinia laoreet, massa velit porttitor sapien, ac euismod metus dui vel ligula. Aenean lacinia bibendum dui non suscipit. Sed libero elit, ullamcorper vitae ornare eu, aliquet in turpis. Aenean a odio vitae leo pharetra semper. Maecenas velit urna, tristique sed eleifend sed, tempus quis lorem. Proin fringilla scelerisque pretium.

Suspendisse pharetra, ligula vitae suscipit sodales, dolor mi ultrices massa, vel ornare risus dolor in justo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sed sapien felis, quis pretium purus. Nam nec eleifend nibh. Donec molestie orci quis lacus aliquam tincidunt. Aenean mattis vestibulum nisi eget consectetur. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.

Quisque vel quam vel nunc vulputate vulputate ac nec dolor. Proin quis tellus risus, vitae tempus nisi. Vivamus non dui dolor, quis ornare lorem. Vivamus eleifend hendrerit bibendum. Sed velit quam, lobortis eu accumsan dignissim, adipiscing congue justo. Sed quis lorem a leo euismod blandit eget et nulla. Sed arcu velit, suscipit a facilisis egestas, ultrices non elit. Praesent quis rutrum augue.

In leo eros, faucibus at aliquet vel, condimentum vitae erat. Suspendisse eget justo quis ipsum posuere sodales. In hac habitasse platea dictumst. Maecenas quis lacus id nisi sodales luctus. In orci eros, ultrices eget vulputate nec, gravida eget orci. Cras laoreet augue in nulla pretium eget ultricies nibh fringilla. Integer eleifend bibendum libero, id aliquet augue suscipit a. Curabitur interdum feugiat felis, vel vulputate dolor tempor porttitor. Nulla luctus nulla a justo consectetur nec pretium lorem vestibulum. Vivamus viverra rutrum dui, ut adipiscing augue varius vitae. Cras iaculis auctor tellus, elementum aliquet felis aliquet sit amet. Aliquam vel lorem facilisis orci euismod viverra. Duis molestie, arcu a egestas tempus, erat mi adipiscing orci, vulputate volutpat sem neque nec justo.

•STATISTICS•

NAME: name NICKNAMES: nicknames AGE: age GENDER: gender HAIR: hair EYES: eyes HEIGHT: height WEIGHT: weight BUILD: build MARITAL STATUS: status SEXUALITY: sexuality OCCUPATION: job	LIKES: like, like, like DISLIKES: dislike, dislike, dislike MOVIES: movie, movie, movie TV: show, show, show MUSIC: band, artist, band PARENTS: mom and dad SIBLINGS: sib, sib, sib OTHER RELATIVES: here, here, here
•OOC• NAME: name AGE: age AIM: screenname EXPERIENCE: years rping etc. CONTACT: preferred contact, dropbox, etc. STYLE: ex: third person, past tense storybook. TIME ZONE: time zone

001: Informative Info

Here's a four-page character sheet for y'all. The arrows take you through each section, and you can click back, as well as seamlessly click through in a loop. You can have one header image for the whole thing, or a different one for each section (bio, personality/appearance, history, and stats/ooc). Please, if you're going to add a 5th page or more, know how to work with the magic click concept or ask me. The sections are all divided up really clearly, but the arrow links need to be changed in a few spots to include new pages, so pay attention to what you're doing! :D

I have a couple more new codes to post, but you all know how I feel about being a spammer lmao.

*Edited the code some to make it LJ-friendly.

002: The Code

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

<lj-raw><div style="margin:0 auto;overflow:hidden;width:718px;height:625px;">

<div style="width:500px;height:30px;background:#aaa url(CHARACTER IMAGE HERE)bottom center no-repeat;margin-bottom:5px;border-radius:90px 90px 0px 0px;padding-top:120px"><div style="font-size:16px;background:#fff;text-align:center;width:100%;text-transform:uppercase;letter-spacing:4px;color:#111;">•BIOGRAPHY•</div></div><div style="height:450px;overflow-y:auto;"><span style="float:left;padding-right:5px;line-height:40px;font-size:54px;">

B</span>iography here.

</div></div></td><td><a href="#two"><img src="http://i.imgur.com/eykj4.png" width="90" title="Personality & Appearance"></a></td></tr></table></a>

<div style="width:500px;height:30px;background:#aaa url(CHARACTER IMAGE HERE)bottom center no-repeat;margin-bottom:5px;border-radius:90px 90px 0px 0px;padding-top:120px"><div style="font-size:16px;background:#fff;text-align:center;width:100%;text-transform:uppercase;letter-spacing:4px;color:#111;">•PERSONALITY & APPEARANCE•</div></div><div style="height:450px;overflow-y:auto;"><span style="float:left;padding-right:5px;line-height:40px;font-size:54px;">

P</span>ersonality & appearance here.

</div></div></td><td><a href="#three"><img src="http://i.imgur.com/eykj4.png" width="90" title="History"></a></td></tr></table></a>

<div style="width:500px;height:30px;background:#aaa url(CHARACTER IMAGE HERE)bottom center no-repeat;margin-bottom:5px;border-radius:90px 90px 0px 0px;padding-top:120px"><div style="font-size:16px;background:#fff;text-align:center;width:100%;text-transform:uppercase;letter-spacing:4px;color:#111;">•HISTORY•</div></div><div style="height:450px;overflow-y:auto;"><span style="float:left;padding-right:5px;line-height:40px;font-size:54px;">

H</span>istory here.

</div></div></td><td><a href="#four"><img src="http://i.imgur.com/eykj4.png" width="90" title="Statistics"></a></td></tr></table></a>

<div style="width:500px;height:30px;background:#aaa url(CHARACTER IMAGE HERE)bottom center no-repeat;margin-bottom:5px;border-radius:90px 90px 0px 0px;padding-top:120px"><div style="font-size:16px;background:#fff;text-align:center;width:100%;text-transform:uppercase;letter-spacing:4px;color:#111;">•STATISTICS•</div></div><div style="height:450px;overflow-y:auto;"><table style="color:#333;font-family:georgia,times,serif;line-height:155%;text-align:justify;font-size:11px;" align="center" width="100%" cellpadding="0" cellspacing="0"><tr><td width="50%" valign="top">

<b>NAME:</b> name<br>
<b>NICKNAMES:</b> nicknames<br>
<b>AGE:</b> age<br>
<b>GENDER:</b> gender<br>
<b>HAIR:</b> hair<br>
<b>EYES:</b> eyes<br>
<b>HEIGHT:</b> height<br>
<b>WEIGHT:</b> weight<br>
<b>BUILD:</b> build<br><br>

<b>MARITAL STATUS:</b> status<br>
<b>SEXUALITY:</b> sexuality<br>
<b>OCCUPATION:</b> job

</td><td width="50%" valign="top">

<b>LIKES:</b> like, like, like<br>
<b>DISLIKES:</b> dislike, dislike, dislike<br>
<b>MOVIES:</b> movie, movie, movie<br>
<b>TV:</b> show, show, show<br>
<b>MUSIC:</b> band, artist, band<br><br>

<b>PARENTS:</b> mom and dad<br>
<b>SIBLINGS:</b> sib, sib, sib<br>
<b>OTHER RELATIVES:</b> here, here, here

</td></tr><tr><td colspan="2"><br><br><div style="font-size:16px;background:#aaa;text-align:center;width:100%;text-transform:uppercase;letter-spacing:4px;color:#fff;">&bull;OOC&bull;</div><br>

<b>NAME:</b> name<br>
<b>AGE:</b> age<br>
<b>AIM:</b> screenname<br>
<b>EXPERIENCE:</b> years rping etc.<br>
<b>CONTACT:</b> preferred contact, dropbox, etc.<br>
<b>STYLE:</b> ex: third person, past tense storybook.<br>
<b>TIME ZONE:</b> time zone

</td></tr></table></div></div></td><td><a href="#one"><img src="http://i.imgur.com/eykj4.png" width="90" title="Biography"></a></td></tr></table></a>

</div><div style="text-align:center;color:#999;font-family:georgia,times,serif;font-size:8px;padding-top:5px;letter-spacing:2px"><a href="http://tessisamess.insanejournal.com/" style="text-decoration:none;" target="_blank"><font color="#999">&copy; TESSISAMESS</font></a></div></lj-raw>

003: CTRL+F This Shit

Biography here. to fill in your biography section.
Personality & appearance here. to fill in your personality and appearance section.
History here. to fill in your history section.
•STATISTICS• to fill in your stats and OOC info.
CHARACTER IMAGE HERE (x4) to put in your header image (or multiple header images if you want a different one for each section). Your image(s) should be 500px wide by 150px high or they'll distort when resized in the code.

If you want to change the section names EVERYWHERE they appear (ie. on each header and on hover of the arrows) CTRL+F them to find all instances of them: BIOGRAPHY, PERSONALITY & APPEARANCE, HISTORY, and STATISTICS. Each label should appear four times in the code (the HTML comment, the header title, and two of the arrow links' titles).

georgia,times,serif to change the font.
#333 to change bulk text color.
#111 to change header title color.
#FFF to change the header background color.
http://i.imgur.com/eykj4.png to change forward arrow.
http://i.imgur.com/Vjxx2.png to change back arrow.
border-radius:90px 90px 0px 0px; to remove rounding on the headers.

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

→LJ-RAW means ya gotta BR them line breaks!
→Probably should be behind a cut, js js.