Results 1 to 20 of 20
  1. #1


    FORUM FEATURES: BBCode, Tabs

    USING BBC CODING IN FORUMS:
    To get the most out of this or other forums, it's important to know how to use the text icons which are available when you 'reply' to a post. You can always 'mouse over' an icon to see what it is for.

    Essentially it works like this (remove the **** before trying): [****img] your http:// web url to an image here [/img]. As you can see the code uses special brackets '[' and ']'. The two tags, one at beginning/end also adds an extra '/' in the last tag.



    STEP BY STEP INSTRUCTIONS:
    We will use insert an image into your post as an example. You need to: first, have the image hosted somewhere (see our tutorial on how to host an image in our Screen Shot tutorial.

    Second, you need to add special coding in front of and behind the link to your image. So lets do a quick example:
    • Here's a link to an image: http://i302.photobucket.com/albums/n...hotexample.png As you can see, the link shows up in this post and if you lick on it you can see the image, but the image itself is not within the post. This is because it is missing the special IMAGE tags at the beginning and the end.
    • If I click on the IMAGE TAG BUTTON I get this: [****img][/img] without the **** which is inserted so you can actually see the code. If **** wasn't inserted you would not see anything as the code works behind the scenes, so we insert it so you can see what the code looks like.
    • What we need to do is insert the link to the image between the IMAGE TAG CODE in this location: [****img]http:// image url here[/img]
    • This would produce the result [****img]http://i302.photobucket.com/albums/nn83/arc362/screenshotexample.png[/img] and the final result as shown here (I've removed the **** so the tags actually work as intended):




  2. #2
    -HH-President GreenBean-HH-'s Avatar
    Join Date
    May 2008
    Location
    New York City
    Posts
    4,943
    Blog Entries
    4
    FarCry-Games



    Re: Do not read yet I'm just doing tests for the HTML

    SMF FORUM HELP SECTION


    Description

    Here you'll find various options and techniques available in HACKHUNTERS forum.



    Click Here >>> SMF FORUM HELP SECTION



  3. #3


    FORUM FEATURES

          • Most of the informations you could need about all the function buttons above are available here:

            http://www.hackhunters.com/forum/ind...=post#standard


            Of course rather than using these buttons, you can type directly the code yourself if you want to practice or when you have to edit a few details in an existing message.

            I'll simply give you a few additionnal informations and hints here that may be helpful.

            Anyway feel free to ask for any informations here and someone will take good care of you.

            _________________________________________________

            Size Font

            I'm sure you noticed the "font size" button don't have a scroll list allowing you to switch the size of the font. That means you have to type the size yourself. When you press this button, the default setting is [**size=10pt][/size]. So if you want bigger letters you have to change the size value in the box.

            Examples:

            [**size=12pt]12[**/size] 12
            [**size=14pt]14[**/size] 14
            [**size=16pt]16[**/size] 16
            [**size=18pt]18[**/size] 18
            [**size=20pt]20[**/size] 20
            [**size=24pt]24[**/size] 24
            [**size=30pt]30[**/size] 30

            _________________________________________________

            Color

            It's easy because you have a scolling list available. Just want to say when you want to change the actual color for a new one, you can simply edit the code by deleting the precedent color and typing yourself the new one.

            Examples:

            [**color=green][**/color] Green
            [**color=red][**/color] Red
            [**color=yellow][**/color] Yellow
            [**color=blue][**/color] Blue


            Here's another example where you can change the color setting yourself.

            The Glow button: default setting is red [**glow=red,2,300][/glow] but you can select other colors just by replacing the actual color by another one.

            Examples:

            [**glow=red,2,300][*/glow] RED
            [**glow=green,2,300][*/glow] GREEN
            [**glow=yellow,2,300][*/glow] YELLOW
            [**glow=blue,2,300][*/glow] BLUE

            _________________________________________________

            Horizontal Rule

            Just a little precision.... Generaly with HTML coding the color of the Horizontal Rule can be changed by adding the appropriate code but it's not possible here. Also, it's very important to know if you have personalized settings like Font Size, Font Color, ..., after a Horizontal Rule these settings are automatically resetted to the standard value. That's why you have to specify all these settings between every Horizontal Rule.

            _________________________________________________

            Font face

            The default setting for the font is [**font=Verdana][/font]. You'll probably never need to change for another font but the reason why I'm giving you this information is because a "Font Size" clickable button is available. So at least you'll know how it's working.

            [size=12pt]Examples[/size]

            [**font=Arial]HackHunters Forum[**/font] HackHunters Forum
            [**font=Times Roman]HackHunters Forum[**/font] HackHunters Forum
            [**font=Courrier]HackHunters Forum[**/font] HackHunters Forum
            [**font=Modern]HackHunters Forum[**/font] HackHunters Forum

            _________________________________________________

            General informations

            It's probably not very useful to know that but because it's working here, I'm giving you the information. The code to jump to a new line is simply [**br].

            Examples:

            [**br]A[**br]B[**br]C[**br]D[**br]E[**br]F[**br]
            [br]A[br]B[br]C[br]D[br]E[br]F[br]

            [**br]A[**br][**br]B[**br][**br][**br]C[**br][**br][**br]D
            [br]A[br][br]B[br][br][br]C[br][br][br][br]D

            (Normally the code to switch to a new paragraph is simply [**p] but it's not working here.)

            _________________________________________________

            List

            I would like to add some little informations about the Inset List button.

            This is what you get when you press this button:

            [**list]
            [**li][**/li]
            [**li][**/li]
            [**/list]

            Every items on your list must be insert between [**li][**/li] code. That means you have to copy and paste this code for each item.

            BTW, when creating a list, whatever the way you enter the code, every item will be on a different line.

            Examples:

            [**list][**li]Item one
          [**li]Item two[**/li][**li]Item three[**/li][**li]Item four[**/li]


        • Item one
        • Item two
        • Item three
        • Item four


        [**list]
        [**li]Item one[**/li]
        [**li]Item two[**/li]
        [**li]Item three[**/li]
        [**li]item four[**/li]
        [**/list]

        • Item one
        • Item two
        • Item three
        • item four


        If you want to add blanks between lines, adding empty lines will do nothing

        Example:

        [**list]
        [**li]Item one[**/li]

        [**li]Item two[**/li]

        [**li]Item three[**/li]

        [**li]Item four[**/li]


      • Item one
      • Item two
      • Item three
      • Item four



      If you really want / need to leave blanks between lines, you can do this by using the [**br] code I talked about sooner. But it'll step two lines at a time.

      Example:

      [**list]
      [**li]Item one[**/li][**br]
      [**li]Item two[**/li][**br]
      [**li]Item three[**/li][**br]
      [**li]Item four[**/li][**br]


    • Item one
    [br]
    • Item two
    [br]
    • Item three
    [br]
    • Item four


    Of course you can also change easily the Font Size and the Color or a few other options if you want. But to do this, you have to put the appropriate code for every items of the list between the [**li][**/li].

    Example:

    [**list]
    [**li][**color=red]Item one[**/color][**/li]
    [**li][**size=14pt]Item two[**/size][**/li]
    [**li][**color=green][**size=14pt]Item three[**/size][**/color][**/li]
    [**li][**move][**size=14pt]Item four[/size][**/move][**/li]
    [**/list]

    • Item one
    • Item two
    • Item three
    • Item four


    _________________________________________________

    Suggestion

    I'm sure you noticed in some cases the order of the code is not really important and it'll work anyway. But a good suggestion is to always use the same code patterns in your posts. This way it's simpliest and when you're searching for errors it's easier. Personnaly, I recommand to go like this:

    1 - Size
    2 - Attributes (Bold, Italic, Underline, Strikethrough)
    3 - Color
    4 - Effect (Marquee for moving text, ...)

    *** (Rarely used but if you switch for another type of Font, ideally it should be the first code to put. I mean before the size.)


    Example:


    [**move][**color=yellow][**u][**b]][**size=12pt]Suggested order[**/size][**/b][**/u][**/color][**/move]

    Suggested order


    _________________________________________________

    Very important

    I would like to add a last thing in this litle HTML first lesson related to this forum. It's not so complicated but keep in mind sometimes small mistakes may be the reasons why the code is not executed and why something is not working correctly.

    Seems you're lucky here because it's working anyway. But on many forums, just a space where it's not supposed to have one is the reason why a link or a pic. is not shown. in a post. So ideally get into the habit to never leave space between a link and the code.

    Good luck!

    Ov3rCast

  4. #4


    (working on the) How to work with tables in the forum lesson

    TABLES, How to make them:

    Sometimes it can be useful to work with tables, especially if you want to write a document with colums. But there is some informations you should know before.

    Here you have two examples. The first one is very basic but as you can see in the second one we can put a lot of things in a table.



    column 1 column 2 column 3 column 4


    A B C D


    E F G H


    I J K L





    column 1 column 2 column 3 column 4


    A ABCDEF C D


    E GHIJKL GHIJKL


    :P E F



    _________________________________________________

    The usual settings like the background color and especially the usual ones related to the width or the space between the columns is not working here. So to help you to figure how to do this, I’ll show different ways to do the job.

    The maximum width of a column is determined only by the row (being part of the specific column) having the maximum number of characters. For that reason, if the informations are differents, the witdh of each column won’t be the same.

    Of course you can type everything on the same line like:

    [**table]
    [**tr]
    [**td]A[**/td]
    [**td]B[**/td]
    [**td]C[**/td]
    [**/tr]
    [**tr][**td]D[**/td][**td]E[**/td][**td]F[**/td][**/tr][**tr][**td]G[**/td][**td]H[**/td][**td]I[**/td][**/tr][**/table]

    but as you can see, it's complicated to read so I recommand highly to go with 1 item per line like:

    [**table]
    [**tr]
    [**td]A[**/td]
    [**td]B[**/td]
    [**td]C[**/td]
    [**/tr]
    [**tr]
    [**td]D[**/td]
    [**td]E[**/td]
    [**td]F[**/td]
    [**/tr]
    [**tr]
    [**td]G[**/td]
    [**td]H[**/td]
    [**td]I[**/td]
    [**/tr]
    [**/table]

    Here is the result of our table :



    A
    B
    C


    D
    E
    F


    G
    H
    I



    The final result is a well organized table but like I said before, the width is fixed by the number of characters. That's why there is no space between them.

    _________________________________________________

    Now we'll use the same example but adding an empty row with blank spaces on the top to force the width of the different columns

    [**table]
    [**tr]
    [**td] [**/td]
    [**td] [**/td]
    [**td] [**/td]
    [**/tr]
    [**tr]
    [**td]A[**/td]
    [**td]B[**/td]
    [**td]C[**/td]
    [**/tr]
    [**tr]
    [**td]D[**/td]
    [**td]E[**/td]
    [**td]F[**/td]
    [**/tr]
    [**tr]
    [**td]G[**/td]
    [**td]H[**/td]
    [**td]I[**/td]
    [**/tr]
    [**/table]









    A
    B
    C


    D
    E
    F


    G
    H
    I



    _________________________________________________

    If you don't force the maximum width yourself, maybe you'll have something looking like this:



    Action
    Base
    Communication


    Distance
    End
    Fire


    General
    Haze
    Infiltrate




    Now the same example but with blank spaces on the first row. The number of blank spaces must be based on the longer word. In that case "Communication" This word contains 13 letters. If we want a space between the words, we must add a few additionnal blank spaces. Okay now let see the result with 13 + 5 = 18 spaces

    [**table]
    [**tr]
    [**td] [**/td] (18 blank spaces)
    [**td] [**/td] (18 blank spaces)
    [**td] [**/td] (18 blank spaces)
    [**/tr]
    [**tr]
    [**td]Action[**/td]
    [**td]Base[**/td]
    [**td]Communication[**/td]
    [**/tr]
    [**tr]
    [**td]Distance[**/td]
    [**td]End[**/td]
    [**td]Fire[**/td]
    [**/tr]
    [**tr]
    [**td]General[**/td]
    [**td]Haze[**/td]
    [**td]Infiltrate[**/td]
    [**/tr]
    [**/table]








    Action
    Base
    Communication


    Distance
    End
    Fire


    General
    Haze
    Infiltrate



    _________________________________________________




  5. #5
    -HH-President GreenBean-HH-'s Avatar
    Join Date
    May 2008
    Location
    New York City
    Posts
    4,943
    Blog Entries
    4
    FarCry-Games



    Re: FORUM FEATURES

    Dragging Text:

    You can select text and drag it to a new location. It takes a little practice: select text, it should look something like this: text , place cursor in middle and at its base of text and click & drag vertically while it is still selected, if it doesn't de-select you can drag it to a new location.

    Especially useful when you put html tags in the wrong location.



  6. #6


    Re: FORUM FEATURES: BBCode, Tabs

    A very nice & extensive tutorial .

    About the spoiler: http://custom.simplemachines.org/mod...x.php?mod=1082

    cheers.
    [/url]


  7. #7


    Re: FORUM FEATURES: BBCode, Tabs

    The function is now added. Look for this button:

    Sorry for the delay but I've read your precedent message only today end of afternoon.

    I made a few tests and I found an easy way to do this. I sent you a pm with the "recipe".

    BTW greenbean the image you added for the Spoiler button is very cool




    O3CT

    Not sure if I'm right or not but seriously I'm afraid some ppl will have...


    [spoiler]BIG FUN USING THIS NEW OPTION!!! [/spoiler]

  8. #8
    -HH-President GreenBean-HH-'s Avatar
    Join Date
    May 2008
    Location
    New York City
    Posts
    4,943
    Blog Entries
    4
    FarCry-Games



    Re: FORUM FEATURES: BBCode, Tabs

    hmmm,

    How much is this going to cost us Ov3rCasT?




    [spoiler][/spoiler]














  9. #9


    Re: FORUM FEATURES: BBCode, Tabs




    Oh no, now everyone will know what I look like in real life.


  10. #10
    -HH-President GreenBean-HH-'s Avatar
    Join Date
    May 2008
    Location
    New York City
    Posts
    4,943
    Blog Entries
    4
    FarCry-Games



    Re: FORUM FEATURES: BBCode, Tabs

    Spoilers... they work perfectly in Safari.... but i can see they don't in FireFox and Opera.

    i suspect they're not working in Internet Explorer as well.

    What browser are you using Ov3rCasT?

    omg, here we go again. you all must be wondering what I've been posting as I've been using spoilers all over the place.



  11. #11


    Re: FORUM FEATURES: BBCode, Tabs

    Quote Originally Posted by -HH-GreenBean
    Spoilers... they work perfectly in Safari.... but i can see they don't in FireFox and Opera.

    i suspect they're not working in Internet Explorer as well.

    What browser are you using Ov3rCasT?

    omg, here we go again. you all must be wondering what I've been posting as I've been using spoilers all over the place.

    I'm using IE (Internet Explorer) and in my case they are working only if I'm logged in.

    Maybe it's kind of standard to have this feature working only when connected.

    Well, I'll try to take time to investigate on my side....




  12. #12
    -HH-President GreenBean-HH-'s Avatar
    Join Date
    May 2008
    Location
    New York City
    Posts
    4,943
    Blog Entries
    4
    FarCry-Games



    Re: FORUM FEATURES: BBCode, Tabs

    Interesting...

    I'm pretty sure those that were posting were logged in and didn't see it. What version of IE are you using?


    Still, I think we'll have to grab a different mod... if we delete the current mod, do you think everything under the spoiler will be eliminated, or will it just sit there until another mod activates? i think the latter.

    thanks O



  13. #13


    Re: FORUM FEATURES: BBCode, Tabs

    At work I have IE 7, at home IE 6.

    Concerning spoilers, both IE versions are working the same for me. I mean I have to be logged in to have the spoilers doing their job.

    The file is already on my PC (since all the problems I had with IE) so tonight I'll reinstall Firefox to make tests from home. I'm curious too.



  14. #14
    -HH-President GreenBean-HH-'s Avatar
    Join Date
    May 2008
    Location
    New York City
    Posts
    4,943
    Blog Entries
    4
    FarCry-Games



    Re: FORUM FEATURES: BBCode, Tabs

    You know how you were able to see the spoiler button but I wasn't... maybe it has something to do with the fact it was downloaded to your computer and not others... i don't know why but the button was weird that it worked for you.... almost like it was referring to your computer for files and not what you uploaded.



  15. #15
    -HH-President GreenBean-HH-'s Avatar
    Join Date
    May 2008
    Location
    New York City
    Posts
    4,943
    Blog Entries
    4
    FarCry-Games



    Re: FORUM FEATURES: BBCode, Tabs

    Making a FavIcon for your site. Favorite Icon is the little icon you see listed in your browsers favorites...

    go here, it's easy, fast and free:

    http://www.htmlkit.com/services/favicon/



  16. #16


    Re: FORUM FEATURES: BBCode, Tabs

    If you want, I still have some sort of 'button creator', it's perfect for a favicon .

    cheers
    [/url]


  17. #17


    Re: FORUM FEATURES: BBCode, Tabs

    The order of the coding have generally no major effect but in this post, I will show you how you can easily highligt something in a sentence just by playing with the order of the coding.

    Depending the order of the Underline / Strikethrough coding and the color coding, the result won't be the same. You can even add a second color for the option.



    Cases 1 & 4 ==> underline or strikethrough / color / WORD / color / underline or strikethrough

    Cases 2 & 5 ==> color / underline or strikethrough / WORD / underline or strikethrough / color

    Cases 3 & 6 ==> color 2 / underline or strikethrough / color 1 / WORD / color 1 / underline or strikethrough / color 2



    1- I like to play MOHAA, it's my favorite game.

    2- I like to play MOHAA, it's my favorite game.

    3- I like to play MOHAA, it's my favorite game.

    _________________________________________________

    4- I like to play MOHAA but I don't like hackers.

    5- I like to play MOHAA but I don't like hackers.

    6- I like to play MOHAA but I don't like hackers.


    Hope it helps

    O3CT



  18. #18
    -HH-President GreenBean-HH-'s Avatar
    Join Date
    May 2008
    Location
    New York City
    Posts
    4,943
    Blog Entries
    4
    FarCry-Games



    Re: FORUM FEATURES: BBCode, Tabs

    Cool, so you're saying that the Underline in exampe 6 is a different color than the word.

    Thanks for the add.


    Code:
    4- I like to play MOHAA but I don't like hackers.
    
    5- I like to play MOHAA but I don't like hackers.
    
    6- I like to play MOHAA but I don't like hackers.



  19. #19


    Re: FORUM FEATURES: BBCode, Tabs

    I had some problems when working with List so I decided to made some tests and found surprising but interesting information. So this post is a kind of little tutorial to help ppl to use the list feature in their posts.

    _________________________________________________

    For a list, you can use the regular coding given by the site when you press the Insert List button but a more flexible solution is to use a * between [ ] for each line rather than the li and /li beginning and end of each line.

    When using that second option, the advantage is you can also apply particular settings like the color and size to the entire list. Also the dot at the beginning of each line can be the same color than the rest so the final result is looking better. It is also possible to have a different color for the text. You can also use a general color and select a different one for each line.

    Nothing is better than giving examples so here we go:

    Code:
    MOHAA
    
    
    • FFA
    • TDM
    • OBJ
    MOHAA

    • FFA
    • TDM
    • OBJ


    Code:
    MOHAA
    
    • [color=red]
    • FFA
    • TDM
    • OBJ


    MOHAA
    • [color=red][size=10pt]
    • FFA
    • TDM
    • OBJ


    Code:
    MOHAA
    
    • [color=red][size=10pt]
    • FFA
    • TDM
    • OBJ
    MOHAA
    • [color=red][size=10pt]
    • FFA
    • TDM
    • OBJ


    Code:
    MOHAA
    
    • [color=red][size=10pt]
    • [size=12pt]FFA
    Code:
    • TDM
    • OBJ
    MOHAA
    • [color=red]
    • [size=12pt]FFA
    • TDM
    • OBJ

    ..

    But there are a few particular things to know.

    First thing => Curiously, when applying a setting to an entire list, you have only to put the first [coding] at the beginning of the list. If you put also the [/coding] at the end, the last coding will be shown.

    Example:

    Code:
    MOHAA
    
    • FFA
    • TDM
    • OBJ
    MOHAA
    • FFA
    • TDM
    • OBJ

    *
    Second thing => Not a so big surprise but the result about the no end coding is rest of the following text will be the same color. That means you'll probably need to put the coding of the original color rest of the text.

    Third thing

    Curiously after a list coding, depending what's the coding inside, it is possible whatever the number of empty lines you let empty, the rest of the text will begin next line. So if you want some blank lines, you have to use a little trick discovered by GreenBean. The way to do that is very simple. You just need to add some letter or symbol the same color than the background color. I'm sure you noticed the background color here is black so it's very simple. so it can be as simply:



    Code:
    1 line: 
    
    .
    
    2 lines:
    
    .
    
     
    3 lines:
     
    .
    .
    .

    Hope it'll help ppl who want to work with the list feature.


    Good luck,

    O3CT

  20. #20
    -HH-President GreenBean-HH-'s Avatar
    Join Date
    May 2008
    Location
    New York City
    Posts
    4,943
    Blog Entries
    4
    FarCry-Games



    Re: FORUM FEATURES: BBCode, Tabs

    this is great, really saves on having to type
    • and
    after each line and obviously offers a lot of flexibility in formatting. Thanks for the tutorial.



Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
Hosting by CSR Web Services