Crimson Horizon
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Intro to BB code, images on this forum and other useful stuff :)

2 posters

Go down

Intro to BB code, images on this forum and other useful stuff :) Empty Intro to BB code, images on this forum and other useful stuff :)

Post  Nahkti Sun Jan 11, 2009 8:07 am

Using images in the forum

Basics

First thing you will need to do is host your image somewhere, the easiest site to use is :

imageshack.us

Use the 'Browse' button to locate the image on your PC then use the 'Host it' button to upload the image on to their site.

On the next page that appears use the 'show advanced linking' option, ignoring their request not to use it Smile

Highlight and copy the code from the 'Direct link to image' field that appears.

To include the image in your post use the Image button Intro to BB code, images on this forum and other useful stuff :) Imagebuttoncs6
Paste the code you copied into the field that appears and click 'OK'

You should now have something that looks like this in your post

Code:
[img]http://img70.imageshack.us/img70/8031/imagebuttoncs6.jpg[/img]

To make sure all worked well use the 'Preview' button before clicking send.

Aligning the image within a post

By default the image is set to align left
Intro to BB code, images on this forum and other useful stuff :) Testbm4

You can alter the alignment of the image by using the text align buttons Intro to BB code, images on this forum and other useful stuff :) Alignrh8, from left to right the buttons are 'Left' , 'Center' and 'Right'.

Note: When you use any of these buttons, the first time you click it the button will change colour , it will remain that colour until you click it again, this is because using that button inserts what is called a 'start tag' into your post and will subsequently format everything you input until you click it again which inserts a 'closing tag', the closing tag tells the browser to stop formatting the content.

To centre an image use the 'Center' button and then use the 'Image' button to insert the image, use the 'Center' button again to stop centering content.

Intro to BB code, images on this forum and other useful stuff :) Testbm4


The code in your post should look like this:
Code:
[center][img]http://img142.imageshack.us/img142/5828/testbm4.jpg[/img][/center]

The same process is used to align the image right, just use the 'Right' button instead.

Intro to BB code, images on this forum and other useful stuff :) Testbm4


Code:
[right][img]http://img142.imageshack.us/img142/5828/testbm4.jpg[/img][/right]

You can use the same process to add an image to your signature.


Last edited by Nahkti on Tue Feb 03, 2009 3:02 am; edited 3 times in total
Nahkti
Nahkti

Number of posts : 74
Location : London
Class : Tempest of Set
Registration date : 2009-01-10

Back to top Go down

Intro to BB code, images on this forum and other useful stuff :) Empty BB Code the basics

Post  Nahkti Sun Jan 11, 2009 9:48 am

All forums use a code for formating content which works very much like a simplified version of HTML. Like HTML BB Code uses what are called 'Tags'. When posting in this forum you will notice the buttons above the field you enter your text, these buttons input a BB Code 'Tag', when you hover your mouse over these buttons they give a tooltip that tells you what they do. In most cases when you first use a button it will change colour, it will only revert to its original colour once you press it a second time, this is because most 'Tags' need to be 'closed' so that the browser knows to stop formatting or inserting content. Note: like HTML BB Code uses the American spellings of words like Colour (color) and Centre (center).

What is a Tag?
Think of a 'Tag' as a label, the label is there to tell the browser to start doing something, either formating the content (like change text colour) or insert something like a picture. Browsers are stupid and unless we tell them to stop doing something they will continue to do it, we tell the browser to stop formatting or inserting content by using a 'closing tag'. The only difference between an opening tag and a closing one is that the closing tag will contain a forward slash ( / ). When you want to format something or insert something (like an image) it will need to be inserted between a pair of tags (opening and closing). For example to format some text as bold you use the following tags:
Code:
[b]This is bold text[/b]
Which looks like this : This is bold text

Without the closing tag (the brackets containing the / ) all content will be formatted as bold, it's therefore important to remember to use the closing tag.

Using multiple tags or 'Nesting' tags
Sometimes you might want to use several formatting techniques on your text, you might want to use bold text and give it a different colour. When we use more than one kind of tag we call it 'nesting' because the tags are 'nested' within each other. There is an important point to remember when using nested tags, the order of opening tags must match the order of closing tags. In an example with coloured and bold tags if we start by using the bold tag we must 'nest' the color tag within that bold tag properly, so we start with the bold tag then use the color tag, insert our text then use the closing color tag followed by the closing bold tag so that color is nested within bold:
Code:
[b][color=yellow]Yellow bold text[/color][/b]
Yellow bold text

We can take that a step further by underlining the text aswell
Code:
[u][b][color=yellow]Yellow bold text[/color][/b][/u]
Yellow bold text

Lets centre it too Smile
Code:
[center][u][b][color=yellow]Yellow bold text[/color][/b][/u][/center]
Yellow bold text


As you can see the order of the closing tags is the reverse order of the starting tags or you could look at it as the content has the order of opening and closing tags going > outwards.


Common Text Formatting Tags

bold
Code:
[b]bold[/b]

Underline
Code:
[u]Underline[/u]

italic
Code:
[i]italic[/i]

Strikethrough
Code:
[strike]Strikethrough[/strike]

Very Small Text
Code:
[size=7]Very Small Text[/size]

Small Text
Code:
[size=9]Small Text[/size]

Large Text
Code:
[size=18]Large Text[/size]

Huge Text
Code:
[size=24]Huge Text[/size]


Changing the Font
The important thing to remember if you decide to change the font is to use a font you can guarantee that anyone viewing the page will have that font installed on their machine, common fonts like Arial and Times should be used, as Age of Conan installs the Hyborian font on your machine it's safe to say that anyone using these forums will have it installed on their machine.

Hyborian Font
Code:
[font=Hyborian]Hyborian Font[/font]

Aligning text and images
The default alignment is left so it is rare you will need to use it.

left aligned text

Code:
[left]left aligned text[/left]

right aligned text

Code:
[right]right aligned text[/right]

centered text

Code:

[center]centered text[/center]

Coloured Text
When using the color tag you can simply type the name of the colour after the = sign within the color tag, this forum has a limited amount of colours you can use this way, these are as follows:
darkred, red, orange, brown, yellow, green, olive, cyan, blue, darkblue, indigo, violet, white and black.
To get Dark Blue text:

Dark Blue Text
Code:
[color=darkblue]Dark Blue Text[/color]

You can also use something called a 'hexidecimal' value for a colour, you can find the 'hex' value of a colour using something like Photoshop (colour picker) or the Extension for Firefox called 'ColorZilla'. Using a hex value for a colour increases your choice from 14 colours to literally millions!

Ouch Bright Pink !
Code:
[color=#FF00E2]Ouch Bright Pink ![/color]


Images
To an insert an image first you need to have the web address of that image, if your hosting or want to upload your own please see this thread on using images in this forum. You can also find the web address of any image on a web page by right clicking on it and selecting properties. The image address needs to be inserted between image tags.

Intro to BB code, images on this forum and other useful stuff :) Testbm4
Code:
[img]http://img142.imageshack.us/img142/5828/testbm4.jpg[/img]


Links
There are two ways to format a link, you can either simply post the link as the link text or maybe you want to use something like 'click here' as the link text.

Using the web address as a link:
http://forums-eu.ageofconan.com/index.php
Code:
[url]http://forums-eu.ageofconan.com/index.php[/url]

Using other text as the link:
Age of Conan forums
Code:
[url=http://forums-eu.ageofconan.com/index.php] Age of Conan forums [/url]

Quotes
To use a quote :

people are like slinkys: mostly useless but fun to watch falling down the stairs
Code:
[quote]people are like slinkys: mostly useless but fun to watch falling down the stairs[/quote]





I think that covers most of the basics, any questions feel free to ask

Have Fun !
Nahkti
Nahkti

Number of posts : 74
Location : London
Class : Tempest of Set
Registration date : 2009-01-10

Back to top Go down

Intro to BB code, images on this forum and other useful stuff :) Empty Your Gallery

Post  Nahkti Sat Jan 31, 2009 5:47 am

I've enabled a plugin for the forums which allows users to have their own gallery. This means that you don't have to upload your pictures at imageshack if you want to post them in the forums, you can upload them here Very Happy

Using your gallery

  • Activate your gallery
    • Use the gallery link from the main menu
    • Click 'Your Personal gallery'
    • Use the link displayed to activate your gallery

  • Adding pictures
    • go to your personal gallery
    • use the 'Upload Pic' button
    • Enter a short title for your picture in the 'Image' field
    • Enter a brief description (optional)
    • Use the 'Choose' button to browse for the image on your machine you want to upload.
    • Click 'Save' to upload the picture
  • Posting pictures from your gallery in a forum thread
    • Go to your personal gallery
    • Click on the thumbnail of the picture you want to post
    • Scroll down to see 2 options
      • BBCode of the Thumbnail : use this if you want to post a small thumbnail of the image, users can click on this to get the full size picture
      • BBCode of the Picture : use this if you want to post the full size picture
    • Press the 'Copy' button to copy the code of one of the options
    • In the thread you want to post the image use the 'Image' Intro to BB code, images on this forum and other useful stuff :) Imagebuttoncs6 button and paste (Ctrl and V) the copied code into the field that appears and click 'OK'


Other Options
There is a drop down menu that appears above your full size image, you can use this to view all your images as a slideshow, delete an image, resize your image or add special effects.

FAQ
  • Maximum file size of any image is 2mb
  • Your gallery can hold up to 10mb
  • Maximum dimensions of an image is 1280 x 1024 px
  • Moderators can access and delete your images - no porn! Twisted Evil


Have fun
Nahkti
Nahkti

Number of posts : 74
Location : London
Class : Tempest of Set
Registration date : 2009-01-10

Back to top Go down

Intro to BB code, images on this forum and other useful stuff :) Empty Re: Intro to BB code, images on this forum and other useful stuff :)

Post  Nether Sat Jan 31, 2009 7:36 am

Nahkti wrote:
  • Moderators can access and delete your images - no porn! Twisted Evil


Ehm, given the 'adult' qualities of the game, could you define porn a bit clearer? :-D
Nether
Nether

Number of posts : 7
Age : 48
Location : Eindhoven
Class : Dark Templar
Registration date : 2009-01-29

http://www.google.com/reader/shared/01879109667171755668?hl=en

Back to top Go down

Intro to BB code, images on this forum and other useful stuff :) Empty Re: Intro to BB code, images on this forum and other useful stuff :)

Post  Nahkti Sat Jan 31, 2009 8:18 am

Nether wrote:

Ehm, given the 'adult' qualities of the game, could you define porn a bit clearer? :-D

Lol that did cross my mind after I posted, how about No porn from outside the game ?
Nahkti
Nahkti

Number of posts : 74
Location : London
Class : Tempest of Set
Registration date : 2009-01-10

Back to top Go down

Intro to BB code, images on this forum and other useful stuff :) Empty Re: Intro to BB code, images on this forum and other useful stuff :)

Post  Nether Sat Jan 31, 2009 8:48 am

Nahkti wrote:
Nether wrote:

Ehm, given the 'adult' qualities of the game, could you define porn a bit clearer? :-D

Lol that did cross my mind after I posted, how about No porn from outside the game ?

So no Elder Scrolls 3: Oblivion or Fallout 3 porn then. Okies, I can live with that :-)
Nether
Nether

Number of posts : 7
Age : 48
Location : Eindhoven
Class : Dark Templar
Registration date : 2009-01-29

http://www.google.com/reader/shared/01879109667171755668?hl=en

Back to top Go down

Intro to BB code, images on this forum and other useful stuff :) Empty Re: Intro to BB code, images on this forum and other useful stuff :)

Post  Sponsored content


Sponsored content


Back to top Go down

Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum