Site Creator | Graphics | Sprites

Alex. Calling me SG2 for OOC stuff is fine too. Freelance artist and general art and graphics hobbyist. I like my animu and mangoes, if you couldn't tell. My video games are my children. Also I like cats.

SG2Tiger | Bracken | Ten
Tech Support | Domain | Servers | IRC

Tim is currently working on his bio in the meantime enjoy some placeholder words like this and that and the other one and oh that's a pretty cool word too words words words words words

character profile
Assistant | Greeter

My name is Julia, though you're welcome to call me Iris OOC if you'd like. When I'm not roleplaying I like to read, make jewelry, and eat chocolate.

character profile

Forum Seem Inactive?
Don't worry - we're not dead!! Most of our activity has just moved to DISCORD.
Join Our Server
We’ve even got our own custom bot. Come join us and check it out!! The forum WILL REMAIN available.

New Topic
New Poll

 [Resource] Thread Templates
 Posted: Dec 8 2015, 02:15 AM

online status

character race

Fire Earth

381 posts
ooc name


So I've been poking around here and there, trying to see how other RP forums tend to do things, in hopes of trying to unify our 'unique' style into something that is at least somewhat familiar and less likely to isolate veterans of more traditional communities. One of the things I'm noticing on quite a few is that...DoHTML templates are really popular.

I dunno if it's just the cool new aesthetic thing kids are doing these days, but I came across quite a few RPs where people were formatting their thread content behind a template. I thought this was kinda silly, because why would I want to confine my words into a narrow box (since most of them are quite small!!) hidden behind an image hover when I just want to read my replies? That sort of thing looks great in a miniprofile, or even a character app, but for thread content? It was all much too flashy for my tastes.

But in my digging around on Caution, I did manage to find a few 'simple' templates. No hovers, no tiny scrolling boxes...just something that makes things look a bit neater. And I thought, y'know, recolored a bit - and made a little wider - that might actually not be so bad!! Started trying one out in the AzaTen RP and I actually kinda like it. So I thought I'd share the template here for anyone else who would like to use it in the future - and keep this topic around for the possibility of collecting other templates in the future.


First things first, you're gonna want to write up your response and run it through this tool to wrap your paragraphs in <p> tags (unless you like doing that manually, for some masochistic reason). Once you've done that, plug it into the body of this code here:

<div class='meg-round'>
<img src='http://i.imgur.com/ltVw0J3.png' />
<h1><b>wordcount: </b>[WORDCOUNT NUMBER]</h1>
<h2><b>tagged:</b> @[USERNAME GOES HERE]</h2>


<h3><b>notes: </b>[NOTES OR COMMENTS ABOUT YOUR POST]</h3>

<div class='zeddit'>
<a href='http://cttw.jcink.net/index.php?showtopic=868' target='blank'>▲</a>  

<link href='http://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'> <style>#userlinks { z-index: 9999; } .meg-round { width: 550px; padding: 0 0 10px; margin: 15px auto; background-color: #eaeaea; box-shadow: 0 0 0 10px #eaeaea, 0 0 0 11px #ccc; border-top: 100px solid #181818; position: relative; text-align: justify; font-family: 'Roboto', sans-serif; font-size: 11px; color: #232323; line-height: 1.4em; letter-spacing: 0.03em;  } .meg-round img { -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; height: 150px; width: 150px; display: block; margin: -95px auto 0; background-color: #eaeaea; padding: 10px; position: relative; z-index: 3; } .meg-round h1, .meg-round h2, .meg-round h3 { width: 175px; font-weight: normal; color: #eaeaea; background-color: #232323; font-size: 9px; position: absolute; margin: 1px 0; padding: 0px 10px; } .meg-round h1 { top: 0; left: 0; text-align: left; height: 25px; line-height: 25px; } .meg-round h2 { top: 0; right: 0; text-align: right; height: 25px; line-height: 25px; } .meg-round h3 { position: relative; width: 330px; padding: 3px 10px; margin-top: 20px; } .meg-round p { margin-right: 20px; margin-left: 20px; } .meg-round p:nth-child(4) { padding-top: 0px; margin-top: 0px; } .meg-round p:last-child { padding-bottom: 0px; margin-bottom: 0px; }  .zeddit { position: absolute; bottom: -30px; left: 0; right: 0; text-align: center; }</style>[/dohtml]

...replacing all the [NOTES] I put in with your content. For tagging, just use the @ followed by the username you wish to tag, and that member will receive an alert. The notes box does expand downward if you write too much, but it's probably best to keep it to short and simple comments. Finally, you can change the default tiger logo by replacing the link in this line:

<img src='http://i.imgur.com/ltVw0J3.png' />

with your own image. It'll look nice even if you don't, though - which is important, since we don't faceclaim and pretty much have to make our own images 'round here (another reason I dislike how many of these sorts of templates prominently feature a huge area for a character image).

The Result

Your thread will end up looking something like this.

wordcount: 279

tagged: Esjitu

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam laoreet nunc urna, non mollis lorem feugiat eget. Integer porta vitae tellus ac commodo. Nullam at lacus dapibus, pretium sem vel, dapibus leo. Quisque lobortis vulputate orci id pretium. Phasellus et consectetur nisi. Etiam a libero risus. Nulla at luctus purus. Etiam tincidunt nisl et ante tincidunt, quis maximus velit laoreet. Nullam fringilla fringilla aliquet. Fusce tempor, neque nec porta lobortis, turpis quam rutrum justo, ac condimentum augue justo id diam.

Aliquam vel varius mauris. Aliquam elementum, ligula ut porta varius, nunc nisl consequat tellus, et hendrerit nunc nisi vitae felis. Proin pellentesque nibh a ex feugiat molestie. Aenean et lacinia augue, tristique lacinia lectus. Fusce commodo massa quis posuere vestibulum. Donec a arcu suscipit purus vulputate finibus non non massa. Proin pretium convallis quam, sed viverra felis. Proin bibendum, lorem a auctor pretium, odio nisl tempus velit, ut tempus nisl nisi tincidunt risus. Aliquam vestibulum placerat sapien ac eleifend. Fusce mollis elementum augue. Praesent tellus massa, hendrerit a mauris eu, eleifend volutpat risus.

Aenean pharetra quam ut enim cursus, eu molestie massa pulvinar. Curabitur id pretium urna. Quisque aliquet scelerisque libero sed tincidunt. Sed enim felis, lacinia eu neque sit amet, molestie sodales metus. Curabitur in magna vulputate, auctor diam ut, rhoncus risus. Phasellus eu neque consequat, rutrum tortor eu, blandit lacus. Aliquam in nibh finibus, hendrerit quam vel, imperdiet massa. Sed non rutrum sem, non faucibus lacus. Sed ut porttitor urna. Cras porta pulvinar mi sed eleifend. Ut ut lectus porttitor, fermentum est sed, mollis magna. Vivamus vel metus in lacus semper mollis vel vitae ligula. Sed feugiat congue augue, in fringilla dui tincidunt non.

notes: Not bad, eh?

Overall it's short and simple, and very easy to use even if you're not accustomed to editing HTML, and it'll make your RPs look a bit nicer. I even added some recolored CSS to the light IGNO Days skin so it wouldn't look out of place. Give it a go if you feel like it!!
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

Topic Options
New Topic
New Poll



skinned by missy at caution and shine.