Welcome to Trickster Online Revolution Sign in | Join | Help
  Search

Damsel's Avatar/Signature Guide! (Also a brief guide to HTML...)

Last post 09-26-2008, 11:08 AM by Damsel. 44 replies.
Page 1 of 5 (45 items)   1 2 3 4 5 Next >
Sort Posts: Previous Next
  •  03-17-2008, 9:29 AM 138674

    • Damsel is not online. Last active: Tue, Jan 06 2009, 8:16 PM Damsel
    • Top 10 Contributor
    • Joined on 09-07-2007
    • Maybe here, maybe there. Keep your eyes open?
    • Posts 6,498

    Damsel's Avatar/Signature Guide! (Also a brief guide to HTML...)

    A lot of new faces have been showing up, and some have never used a forum before.  So, I decided it might be a good idea to make a guide on how to create/implement an avatar and/or signature.

    Signatures

        Often called "siggy" for short.  It can be just text, or an image, or a combination of text and images.  People often "make siggies", but what they're really making are banners.  A banner is a (usually) small image set within a rectangle that is wider than it is tall.

    To create your Signature:

    Click your name in the upper right corner of the forum.

     

    Signature is the first option, so simply enter what you want in the box.


    •  Using HTML

                    HTML is a code system that uses tags <> to hold code.  The default code in this forum is BBC, so HTML code is visible unless you enter it by clicking on the HTML button on the blue bar above the text entry box when you're posting.

    Most HTML tags MUST be closed in order for them to work.  </>

    Common HTML tags:

    • Text 

    <b>      This bolds text                             </b>   (You need to end this.)
    <br>     Inserts a line break                                    (like pressing "Enter" on a keyboard)
    <p>     This starts a new paragraph                         This is very useful for splitting up your text
    <i>     This makes text in italics                    </i>     (You need to end this.)
    <u>     This underlines text                        </u>    (You need to end this.)

    <font size="1">type your text here</font>

    • Size 1 text
    • Size 2 text
    • Size 3 text
    • Size 4 text
    • Size 5 text
    • Size 6 text
    • Size 7 text

    <font color="red"> text here </font> would appear as text here.

    • Images

    <img src="IMAGE URL"></img>  THE QUOTES ARE VERY IMPORTANT!
    You can also add a border around the image by adding <img src="IMAGE URL" border="2">

    Border="0" no border
    Border="1" thin border
    Border="2" thicker border

    • Links

    <a href="PAGE URL"></a>
    You can create a linked image by inserting the code for an image <a href="PAGE URL">here</a>; doing so will make it so that the image can be clicked on to take you to the page you're linking with.
     

     

    •  Alignment

    <div align="center"></div>
    <div align="left"></div>
    <div align="right"></div>
    <div align="justified"></div> (This one is only useful if you're working exclusively with text)

    • Using BBC code

    Since BBC code is what translates in posts, I can't display the codes here.  However, click here for Wikipedia's list of BBC codes. ;P
    Wikipedia doesn't have everything, so here is another source that has some BBC codes Wikipedia left out.  ^^
     

    After you've created your signature, click "Save Changes". 

     

    Avatars

    This forum pulls an image from your computer to use as your avatar.  If you wish to pull an image from a website, you must first save it to your computer.
         From the same area that you set your signature, you can set your avatar.

    Click "Browse" and find the image you desire, then click "Update".   Sometimes it takes a while for your new avatar to show up.  It says it can take up to 10 minutes, but I've had it take longer.  The thing is, while you see the previous image, OTHER people see the new one.  -shrug-

    I hope this helps!  If anyone has anything to add, please feel free to let me know, and I will update as needed! 

    Update(3/17): I forgot to mention that since characters are limited in signatures, it's advisable to use BBC instead of HTML because the coding for BBC is shorter.

    Update(3/18): I realized I forgot to explain how to do links, so I added that.  :)

    Update(3/31): I've had some people asking me how to make a siggy, so (sorry if it's big):

     

    Phoneuma:

    Hyperlinks to Trickster Forum Posts
    Due to the limitations on sig length, every character counts. To add a hyperlink, you would normally have something like:

    <a href=http://forum.ntreev.net/trickster/forums/threads/14676.aspx>
    <img=http://www.imageshack.us/mypics/apicture09x.png></a>

    Deleting the http:// from each of those links forces the forum to append those URLs to the current thread's URL, which leads to "Page Not Found" errors. That example would also take up a sizable chunk of your permissible siggy size. However, since you're hyperlinking to a post in the same forum, you can take advantage of the appendix function.

    If we tried to use our current hyperlink sans http:// while on post 17834, the forum would reference the following URL:

    http://forum.ntreev.net/trickster/forums/threads/17834.aspx#forum.ntreev.net/trickster/forums/threads/14676.aspx

    This is definitely not what you'd want. You could try deleting all but the post's number, but that would yield the following:

    http://forum.ntreev.net/trickster/forums/threads/17834.aspx#14676.aspx

    Knowing anything after <a href= without an HTTP:// preceding it will be appended to the current post's URL, all you need to worry about is getting your hyperlink to shift the focus from the current URL to the parent URL. What is the parent URL? Let's take the above example and break down its structure.

    HTTP://  Hyperlink call
    forum.ntreev.net  Domain name
    trickster  Great-grandparent URL (in the case of this example)
    forums  Grandparent URL
    threads  Parent URL
    14676.aspx  Child URL

    In this case, we want to reference the parent URL, which is threads (we can leave off the slashes). To do this, you need to know a little coding trick used in DOS. In referencing paths, periods have a special function. A single period followed by a slash will reference the parent, while two periods will reference the grandparent. If you needed to, you could combine them. For example, ./../ would reference the great-grandparent. Or ../../ would reference the Great-great-Grandparent (the Domain in this case). Now you can cut out all that extra URL from your hyperlink!

    <a href=./14676.aspx><img=http://www.imageshack.us/mypics/apicture09x.png></a>

    Voila!

     


  •  03-17-2008, 9:32 AM 138676 in reply to 138674

    Re: Damsel's Avatar/Signature Guide!

    Wow, that must have took forever to make, but it's really thorough and looks great! Maybe now I can add a signature when I find some :D
  •  03-17-2008, 9:36 AM 138678 in reply to 138676

    • Damsel is not online. Last active: Tue, Jan 06 2009, 8:16 PM Damsel
    • Top 10 Contributor
    • Joined on 09-07-2007
    • Maybe here, maybe there. Keep your eyes open?
    • Posts 6,498

    Re: Damsel's Avatar/Signature Guide!

    Nah, it didn't take long.  I've been working with HTML for years now, and I knew of a few online sources I could pull from to refresh my memory.  And Wikipedia is endlessly helpful with such things.  ^^;;  The only really time-consuming part was taking the screen shots, cropping them, and uploading them...which took...-shrug-

    Ok, I started this right after I posted saying I was gonna make it, so it took me from the time of that post to the time shown of posting this to make it. XD  (Couldn't have been more than 20 minutes!) 


  •  03-17-2008, 9:38 AM 138679 in reply to 138678

    Re: Damsel's Avatar/Signature Guide!

    Huzzah you did it! And quick :D Good guide ^_^



    Fantasia - 15x Champion - You don't need my name :P
  •  03-17-2008, 9:42 AM 138683 in reply to 138679

    • Damsel is not online. Last active: Tue, Jan 06 2009, 8:16 PM Damsel
    • Top 10 Contributor
    • Joined on 09-07-2007
    • Maybe here, maybe there. Keep your eyes open?
    • Posts 6,498

    Re: Damsel's Avatar/Signature Guide!

    Thanks! ^^  I hope everyone finds it helpful.  I'll be happy to answer any further questions. ;P

  •  03-17-2008, 10:51 AM 138702 in reply to 138683

    Re: Damsel's Avatar/Signature Guide!

    If people keep asking the same question someone should add a link to this in their siggy.

  •  03-17-2008, 11:01 AM 138707 in reply to 138702

    • Damsel is not online. Last active: Tue, Jan 06 2009, 8:16 PM Damsel
    • Top 10 Contributor
    • Joined on 09-07-2007
    • Maybe here, maybe there. Keep your eyes open?
    • Posts 6,498

    Re: Damsel's Avatar/Signature Guide!

    Hmm.  Maybe I'll do that.  I'd have to switch from html to bbc to fit it in though. XD  Too lazy for that now...if it continues to be an issue, I will though.

  •  03-31-2008, 11:56 AM 147676 in reply to 138707

    • Damsel is not online. Last active: Tue, Jan 06 2009, 8:16 PM Damsel
    • Top 10 Contributor
    • Joined on 09-07-2007
    • Maybe here, maybe there. Keep your eyes open?
    • Posts 6,498

    Re: Damsel's Avatar/Signature Guide!

    bumpage~!  XP

  •  04-01-2008, 3:11 PM 148085 in reply to 147676

    Re: Damsel's Avatar/Signature Guide!

    Wow! I'm adding this to my Bookmarks. (AKA Favorites)
    Really good guide, Thanks.

    IGN: Zarky
    Lv: 19x
    Job: Scientist/Main

    IGN: HolyEnchanterEX
    Lv: 7x
    Job: Magician

    IGN:ScorchingEarth
    Lv:7x
    Job: Bard
  •  04-01-2008, 3:56 PM 148126 in reply to 148085

    Re: Damsel's Avatar/Signature Guide!

    Really good job on this, Damsel. Hadn't it been that its quite the limitations on signatures what they can contain, I'd link to it.
    My opinion is mine alone. Stop making assumptions.

Page 1 of 5 (45 items)   1 2 3 4 5 Next >
View as RSS news feed in XML