Table of Contents
● Introduction
- Helpful Links
- The Basics
● Imgur {Your Image Friend}
- Getting Your Gifs
- Putting Them In
● Color Codes {Adding Color to your CS}
- The Site
- How to Use
- Adding it to your CS
● FontMeme {for all your font needs}
- Getting Your Header
- Putting it on your CS
● Advanced Image Placement
- Words Beneath Image
- Center Text | Left & Right Images
- Images Besides Images
Introduction
Greetings & Salutations Lovelies (ﾉ´ヮ´)ﾉ*:･ﾟ✧
First & foremost, I'd like to warmly welcome you to RPGateway! If you've been directed to this forum it means that you had some questions regarding the ins and outs of making a character sheet. Don't feel bad, darling. Not everyone is a pro their first go 'round. This site can seem disorienting at first but once this walk-through is finished, you will be on your way to making beautiful character sheets for the whole of the internet to see. My name is ibecameinsane and I will be your guide through this wonderful little misadventure.
You'll see all of the newest roleplays here but if none of those strike your fancy you can always go to the Interest Check forum the Roleplayers Wanted forum. There are a lot of great ideas you can look into there. Keep in mind, there is a difference between the Interest Checks forum and the Roleplayers Wanted forum. They are both great places to browse for roleplays but be aware that the Interest Check forum is for roleplays that haven't started yet. The GM is looking to generate interest or gather a following. The Roleplayers Wanted forum, on the other hand, is for roleplays that already exist and have character slots that need to be filled. If you're looking to jump into something right away, that's where you should start.
I implore you to look into the site's rules before doing anything else, just to get a handle on our guideline. If you need any help getting started feel free to PM me or send me an instant message. I'm almost always available.
If you're having technical issues you can check out this forum or the FAQs.
If you still have questions, our lovely Moderators are always available.
Now, you may be saying, "Insane, I know all this already! Show me how to make a character sheet!" Well, feel free to use the Table of Contents to skip ahead if you feel confident enough. Again, welcome to the site! I look forward to seeing you around!
Helpful Links
For a guide on how to use the BBCode, I'd go here. It'll tell you everything you need to know about how to center, left, and right your text as well as bold, underline, and italicize. Not to mention useful tools on how to link to another website as well as color your text. For another guide on how to do all of this, go here. Now, if you're completely lost on how this whole site works, I'd highly recommend Maestro's Guide on the Roleplay Tab. My buddy Maestro will show you a little bit of background information on how to work the site in regards to all of the tabs and plug-ins.
The Basics
So you've found a roleplay you want to join, huh? Well fret not lovelies, ibecameinsane is here to tell you how to submit a character. Now, first things first, more often than not a GameMaster will have a Character Sheet provided on the main page of their roleplay. Once you scroll down and find it, all you have to so is select all:
and Copy it onto your clipboard.
With that loaded and ready, all you have to do is scroll back up to the top of the main page and click on the Submit A Character link
Typically, this is what you'll encounter:
Now I'm going to walk you through what all of that stuff means. At the top, you'll see Character Name. It's pretty much self-explanatory, really. That's where you'll put your character's name. Proceed with caution! Once you submit your character, you can't change your character's name. My advice? Make sure it's what you want and that it's spelled correctly.
Beneath that is the synopsis:
It shows up right beside your character's thumbnail. Typically it's a quote that best represents your character. Or, if you can, you can sum up your character in a few words like: Quiet Mercenary (if you catch my drift). In order to add a thumbnail, you'll have to save a 100x100 pixel image onto your computer and upload it using the Choose File button beneath the synopsis. If it's not 100x100, it won't be accepted. And if you scroll down-...
You'll see a big empty box! All you have to do is click inside of it with your right mouse button and click paste. If your amount of characters isn't too large, you'll even see a preview of what your sheet will look like down below!
Now, I know what you're thinking, "Insane, what do we do now?" Well, it's simple. All you have to do is fill in the blanks. More often than not, you'll find roleplays that have a character sheet template for you to fill out and they're very simple to use. All you really have to do is put your characters beneath name, their age beneath age, and so on and so forth.
A common question I get is, "What's [hr]?" That's just a line. Have you ever wondered how they separate their character sheets into sections? Well, they use the lines. You can one, two, as many as you want. The code for it is:
- Code: Select all
[hr][/hr]
For inserting images, colors, and font images, you'll have to see the rest of the tutorial.
Imgur {Your Image Friend}
Alright lovelies! So you want to learn how to put images into your character sheet, do you? Whelp, I've got you covered. Now, personally, I don't grab urls straight from Google or Tumblr. That can lead to broken links and then the next thing you know, your image is gone. So what do I use? I use Imgur. This isn't a sponsor of anything, I've just found it a very reliable source to get my images. You can upload them from your computer or grab them right off the internet! It even formats the code for you! It's very convenient and I'm going to show you how to use it.
Now, if you're not using Imgur but you still want to put images on your sheet. Do this little number:
- Code: Select all
[img]image url[/img]
Make sure your codes are in tact and just paste the image's url where it says 'image url'
Getting Your Gifs
Before we do anything, here's what you'll be looking at when you log on:
You'll find a huge site dedicated to uploading and sharing images online. Now, what you'll need to do is click on the Upload Image button to get started. What you'll find will look like this:
As I said before, you can upload your images straightaway from your computer, and all you have to do is click the browse your computer button and search through your device. "But what if I want to grab a gif from online?" you may be asking. Well, I'll show you. Go to any search engine {Google} and search up gifs of your FaceClaim. Once you find one you like, right click the image and select Copy Image URL
Then just go back to Imgur and paste your url into the little slot
After you've got all of the images you want, all there's left to do is to upload. It's as easy as clicking a button.
Putting Them In
Once it's done uploading, you'll see a bunch of codes pop up in a sidebar to the right You'll want to save the BBCode one. You can double click the link itself and copy it that way of click the little clipboard beside it.
After that, all there's left is putting the code where you want it. Click between brackets to avoid any broken codes and be sure to set up a direction on the page where you want your image to be (i.e. right, left, or center)
For more tips on gif placement, see the Advanced Image Placement section below
Color Codes {Adding Color to your CS}
Now, you may all be wondering, "Insane, why is there a section on Hex Colors? Can't we just use words?" Yes, you can. But what about those people who more variety in their colors? Who's going to help them. Me, that's who. I've looked all around and by far my favorite site for Hex Color Codes is ComputerHope. There's a HUGE list of colors to choose from. Just scroll down and explore!
How to Use
This is REALLY simple. Say you're scrolling down and you find the color you want. Purple Jam, for example.
Just click the link and it'll take you to the color's specific page. All there is to do is copy the code.
This is important! Just be sure to include the '#' in the code or the code will not work.
Once you've got it copied all you have to do is paste it. Do so after the '=' in the BBCode for adding color to your text. For those that don't know it's
- Code: Select all
[color=][/color]
And if your code isn't broken it should look like this:
Now, if it doesn't look like that, check to see if any of your brackets are out of place or that there isn't a space between your '=' and your '#'. Those are both common mistakes.
FontMeme {for all your font needs}
What's that you said? You want fonts on your sheet like this:
Well look no further lovelies! I've got a site for you to use. When using fonts like that, their normally used for your character's name. Sometimes you'll find something like this on your CS template:
- Code: Select all
[img]NAME[/img]
This means that your GM probably wants you to use one of these nifty font headers for your character's name. But how do you go about it? In my experience, FontMeme has always been a reliable source for headers like these. It's really easy to use and there are hundreds upon thousands of fonts to choose from.
Getting Your Header
When you click the link, it might not look like what you'd expect from a font site. Rest assured, you're in the right place. To access the fonts easier, just go to the By Themes link in the upper-left
Once that's out of the way, you'll find many themes to choose from, all with links that'll take you to an abundance of fonts that fit that theme. For this tutorial, we'll click on the Art Deco theme:
Now scroll. You'll come to an interactive box with a list of fonts you can use at your disposal as well as a place to put your text, a size box, and a color selection. We'll get to all of that in time. For the purpose of moving things along, we'll choose the RitzyNormal. If you want to preview the font, just click the Generate button.
With your font selected, we'll pick our color. You may recall the color Purple Jam from earlier in the tutorial. Well, with most roleplays you might be required to have a dialogue color or a character color. You'll need to make your font that color. If you've already got one selected, just highlight the area that says 0000ff
Paste your color without the '#' and it'll show up
Next, choose your size. You might need to adjust it according to the size of the font itself
Personally, 50 is a safe bet
After that, put your character name's in the dialogue box above the color wheel
and Generate
Putting it on your CS
You'll see a Download button near the one that says Generate. Now don't worry, you won't get any viruses by downloading images from this site. It's free to use. Once you've clicked Download it should automatically save itself to your computer.
Now that's it loaded up in your Download bar at the bottom of your browser, you can go to Imgur and Drag&Drop. If you don't have browsers like Chrome or Firefox, you can easily hit Browse Your Computer and find it in your Downloads folder.
Copy the Code. Paste it on you sheet. (Treat it just like a Gif)
And here's your result:
It'll save to your computer as a .png so the transparency is kept in tact. And you don't have to stop at just your name! You can label the sections (i.e. personalty, history, etc) of your character sheet just as you did creating your header for your name. If you need any help with that, PM me and I'll walk you through it.
Advanced Image Placement
For some these may be advanced methods of image use on a character sheet, but once I'm done with you this'll be a walk in the part. Below I have explained how to accomplish a few tricks I've learned in my year of being on this site and you're welcome to use them at your own disposal. If there's anything I haven't covered below, feel free to PM me and I'm sure I can help you work something out.
Words Beneath Images
Don't know what I'm talking about? Well let me walk you through a scenario. Say you want to make a roleplay yourself and you want to display gifs of the characters that are available while advertising whether or not they're open or not. Like this:
It's easy once you know how to format the gif onto the page. By simply using the center code around an image, you put in in the middle of the page. However, if you hit enter after the [/img] on your image, you can write down all the information you want. Like so:
- Code: Select all
[img]image url[/img]
[font=garamond]| Name | Age | Role | FC | OPEN |[/font]
See? It's that simple. Not to mention, it saves you a bunch of time.
Center Text | Left & Right Images
What this one your Character Sheet?
Putting words beneath two rows of gifs is really simple once you know how to do it. Typically you'd use gifs 245 pixels in width when doing this. Normal 500 pixel width images simply won't fit.
Focus on this bit here:
- Code: Select all
[left][img]http://i.imgur.com/2p8Sd5y.gif[/img]
[img]http://i.imgur.com/tJZi5eN.gif[/img][/left][right][img]http://i.imgur.com/cE0dRmd.gif[/img]
[img]http://i.imgur.com/XeHR0VF.gif[/img][/right]
[center][font=garamond][size=110][b]{[/b][/size] [size=110]Owner[/size] [size=110][b]}[/b][/size]
When putting images on the left and right, you want to make sure that the codes are touching. If you want to line the gifs up vertically on the left side, hit enter. Putting three gifs in the [left] code gifs me three columns. So long as the [left] and [right] codes touch, they'll be aligned. To add text just end the code and add text as shown above. If it's still too complicated, I'll be glad to talk you through it.
Images Besides Images
So long as you keep the width under 1,000 pixels, you can put images beside one another like so:
Coding looks like this:
Just code it the way it's supposed to and put a space between them. Easy-peasy.
Outro
This forum gives a little insight on how to make a character sheet. What you see above is just a little walkthrough of FAQs I've come in contact with since I've been on the site. If you encounter any problems, please PM me and let me know. I'm always willing to lend a hand. If you have any comments, questions, or concerns you can either post them here or leave me a message. Thank you for taking the time to review this. I hope it was at least a little helpful!
Sincerely yours,
ibecameinsane
