HTML Tutorial

This thread is going to explain exactly how to code some of the more useful functions that can be done in the posts with HTML, such as adding a character name and avatar to your player info bar, and image and music.

So, how do you add your character name, etc?

The first thing you need to do is deactivate your regular avatar. You'll have to add it in manually from now on, if you want the option to change pictures once in a while. I actually have the code for my 'regular' avatar in my signature area, so I can turn it off when I need to manually insert one for an NPC, and on without having to retype all the code. But the code is as follows:

Code:


</div></div>

<dl><dt><a href="/profile.forum?mode=viewprofile&u=5"><img src="http://www.rooftopsolutions.nl/resources/images/posts/1year.gif" height=20% width=20% alt="Claymore's Profile"/></a>


The

Code:

</div></div>

commands are what tricks the forum into thinking the message box ends early, meaning any code that follows it will appear to the right of it. It was really just luck that everything lined up that way. This wouldn't look right, for example, if the player info bar were on the left, coded before the text box.

Anyway, the "/profile.forum?mode=viewprofile&u=5" is added to the homepage address to for a complete link to my profile. And "http://www.rooftopsolutions.nl/resources/images/posts/1year.gif" is the image itself. (This link could just as easily point to something from our gallery.) Just right click any picture and select 'copy image location'. You may have to play with the height and width number a bit, dependong on the original size of the image. And it doesn't have to be a percent either, it could just be a straight pixel count. I prefer percents because by keeping them the same number, you ensure the image doesn't get distorted.

If you want to add a character name below the picture, add

Code:

<span style="color:#15D104"><br /><strong>Gwen Crane</strong></span>

.

One note on all this though, the code for the message stating when a post has been edited happens to come immediately after the text box. So, with these alterations, if you edit your post after someone's already replied to it, that messaged will end up getting wedged between your picture and username.

Hmmm... I can't seem to get it to work like yours. It ends up like you have described at the end, but it was like that initially, rather than only when it was edited.

Oh, all that code has to come at the very end of your post. Remember, the first two commands tell the page when the text box ends and the player info bar begin. So if you put that before your post, it thinks your post belongs in your player info bar too, after the picture.

I fixed it. For some reason it seems to be adding a lot of extra space between your character avatar and player info though, I'm not sure what's up with that. But I can toy with it later.

Cheers!