• June 26, 2017, 03:33 AM
• Welcome, Guest. Please login or register.
Did you miss your activation email?
Perusing The Shelves

Author Topic: BBC Tutorial  (Read 3496 times)

Offline jessadia

  • Alumni Moderator
  • PTS Expert
  • *
  • Thank You
  • -Given: 54
  • -Receive: 1549
  • Posts: 5249
  • Thanked: 1 times
  • Rating : 6175
BBC Tutorial
« on: March 12, 2012, 03:22 PM »



This guide will teach you all about several of the different BBC options and how/when to use them. You'll notice that when you hit the "Reply" button on a thread you'll be rewarded with a new reply screen which features different sections like Subject, Tags, Message icon, Message Body, as well as several weird looking buttons and bars. These are BBC buttons. If you play around with these you'll discover you can do lots of neat things like center, shadow and bolden text. You can insert codes, tables, rules, videos and emoticons (which most of you are probably already familiar with). The Font face, font size and font color are actually really limited- there's so many more that you could use then what's in the drop down lists.



Font Family:

B- Bolden text
I- Italicize text
U- Underline text
S Strikeout text

Font Face:
This is used to change the font style of text. The drop down menu gives you 10 different options but you can use pretty much any font style. For example: Bradley Hand ITC is one of my favorites and is not listed. To insert your own font style you can either select one from the drop down list and simply remove the selected and enter your own or to do it yourself enter "font=bradleyhanditc" in brackets (without the paranthesis) before the preferred text and enter "/font"  in brackets (again, w/o the paranthesis) after the text. (see the coded entry below for a more detailed example)

Code: You are not allowed to view links. Register or Login
[font=bradleyhanditc]enter preferred text here[/font]
Font size:

This changes the size (height/width) of your text. The dropdown box gives you 7 different selections but again, you can use any size.

Change color:

This bar gives you the option to change the color of your text. The dropdown menu gives you a basic overview of colors you can use but again, any color can be used here. In HTML you would use color codes, such as:
Code: You are not allowed to view links. Register or Login
[fontcolor=#669900]colored text here[/font]
**The selected color (#669900) is a dark greenish

In CSS things are made much easier because you can simply use color tags.
Example:
Code: You are not allowed to view links. Register or Login
[color=olivedrab]colored text here[/color]
Here's a link to a CSS Font Colour Code Chart that I use:
You are not allowed to view links. Register or Login
*Scroll down to the Not necessarily web safe section- you'll need to use the actual color names, not the numbers, but it gives you a colored preview of what each one looks like.



Other Options:

You'll notice 4 little boxes located on the top with the Font Family. These are used to align text. The 4 options are:
Preformatted text ("pre")
Left Align ("left")
Center Align ("center")
Right Aligh ("right")

There are also 3 boxes grouped together under the alignment options:
G: add glow to text - you can change the color and luminosity of the text by replacing the "red" with the color of your choice and the same for the "2,300" (increase the number for a brighter glow or decrease for a duller effect)
D: add shadow to text - you can change the color and shading effect by replacing the "red" with the color of your choice or the "left" with options like "right", "above" or "below"
M: make your text scroll right to left across the screen by using the Marquee effect

sup: inserts superscript into text
sub: inserts subscript into text
Tt: inserts Teletype




Advanced Options:

Next I'll go over how to embed things in your posts. You'll notice on the 2nd row there's a group of 6 boxes.
f: used to insert youtube and other flash videos

</>: used to insert youtube and other embedded videos and text


*You can change the size of the videos by simply changing the numbers. I like to use 400,250 for videos. Likewise you can simply use the "embed" button to embed various text, etc (size won't matter here)

Sp: Spoiler button. This button can be used to "hide" the contents of a message like so:
Sorry but you are not allowed to view spoiler contents.



The next 3 boxes are:

Insert Hyperlink
You are not allowed to view links. Register or Login
 
Code: You are not allowed to view links. Register or Login
[url]www.perusingtheshelves.com[/url]
I like to use a manual hyperlink code:
Code: You are not allowed to view links. Register or Login
<a href="insert url here"> enter text [/url]

Example:

You are not allowed to view links. Register or Login
Sorry but you are not allowed to view spoiler contents.

Insert email
Code: You are not allowed to view links. Register or Login
[email][email protected][/email]
Insert FTP link
ftp://www.perusingtheshelves.com (ftp://www.perusingtheshelves.com)
Code: You are not allowed to view links. Register or Login
[ftp]www.perusingtheshelves.com[/ftp]
Sorry but you are not allowed to view spoiler contents.




Advanced Formatting Options:

Under the "font size" bar are 3 boxes:

Insert table: this is used to format your text. A complete walkthrough can be found here: You are not allowed to view links. Register or Login

Insert code: used to code text (see the above coded examples)




Insert quote: used to insert quotes



The next 3 boxes are for lists and rules:

Insert Unordered List:
Code: You are not allowed to view links. Register or Login
[list]
[li]text here[/li]
[li]text here[/li]
[/list]

example:

  • enter text
  • enter text
Insert Ordered list:

Code: You are not allowed to view links. Register or Login
[list type=decimal]
[li][/li]
[li][/li]
[/list]

  • enter text
  • enter text


Horizontal Rule: Used to insert a horizontal line to separate text
Code: You are not allowed to view links. Register or Login
[hr]


The last 2 boxes are:

Remove formatting: does exactly as it says
Toggle View: clicking this button will allow you to automatically preview your post in the message window instead of having to scroll down/up and hit the "preview" button



The last of the buttons are the emoticons which are pretty self-explanatory. However, there are a few that you can use that aren't listed such as an angel and devil:

0:)

Code: You are not allowed to view links. Register or Login
0:)

Use the zero key then a regular smiley


>:D

Code: You are not allowed to view links. Register or Login

>:D

Use the > key then a open mouthed smiley



I hope this "guide" was helpful. If you have any questions or anything to add, leave a post!!
« Last Edit: April 26, 2012, 10:38 AM by jessadia »
 

Offline jessadia

  • Alumni Moderator
  • PTS Expert
  • *
  • Thank You
  • -Given: 54
  • -Receive: 1549
  • Posts: 5249
  • Rating : 6175

Offline teaspa05

  • PTS Expert
  • *
  • Thank You
  • -Given: 1631
  • -Receive: 825
  • Posts: 301
  • Rating : 1302
Re: Html Tutorial
« Reply #1 on: March 22, 2012, 07:23 AM »
thanks jess that helped alot.   ;D

did have a question about the html for making a phase into a link.  example - Make "A List" be the link instead of showing the actual link .

any help would be great thanks!
You are not allowed to view links. Register or Login  You are not allowed to view links. Register or Login
 

Offline jessadia

  • Alumni Moderator
  • PTS Expert
  • *
  • Thank You
  • -Given: 54
  • -Receive: 1549
  • Posts: 5249
  • Thanked: 1 times
  • Rating : 6175
Re: Re: Html Tutorial
« Reply #2 on: March 22, 2012, 07:29 AM »
You are not allowed to view links. Register or Login
thanks jess that helped alot.   ;D

did have a question about the html for making a phase into a link.  example - Make "A List" be the link instead of showing the actual link .

any help would be great thanks!

You have to use the "a href", like this:

Code: You are not allowed to view links. Register or Login

<a href="enter URL here"> enter text here</a>


Just copy and paste my coded example, replacing the enter URL and text fields with the correct info....
 

Offline teaspa05

  • PTS Expert
  • *
  • Thank You
  • -Given: 1631
  • -Receive: 825
  • Posts: 301
  • Rating : 1302
Re: Re: Html Tutorial
« Reply #3 on: March 22, 2012, 07:46 AM »
i used the  [  not the < ..... I was wondering why it didn't work... :o  thanks sooo much
You are not allowed to view links. Register or Login  You are not allowed to view links. Register or Login
 

Offline Tart

  • The Pervy Librarian
  • PTS Expert
  • *
  • Thank You
  • -Given: 1362
  • -Receive: 6601
  • Posts: 731
  • Rating : 7658
Re: Re: Html Tutorial
« Reply #4 on: March 22, 2012, 04:56 PM »
This is sort of a split html/css question but how do you get your links to be a certain color if you're using the "#" color code? I know I should know this being a website designer/coder but something's just wonky, any help would be appreciated because I'm starting to feel a bit embarrassed considering my job...
 

Offline jessadia

  • Alumni Moderator
  • PTS Expert
  • *
  • Thank You
  • -Given: 54
  • -Receive: 1549
  • Posts: 5249
  • Thanked: 1 times
  • Rating : 6175
Re: Re: Html Tutorial
« Reply #5 on: March 22, 2012, 07:35 PM »
You are not allowed to view links. Register or Login
This is sort of a split html/css question but how do you get your links to be a certain color if you're using the "#" color code? I know I should know this being a website designer/coder but something's just wonky, any help would be appreciated because I'm starting to feel a bit embarrassed considering my job...

Like this:

Code: You are not allowed to view links. Register or Login

<a href="enter URL here"> [fontcolor=#669900]colored text/repeat url here[/font]</a>

 

Offline blumouse13

  • SMUT Queen
  • PTS Expert
  • *
  • Thank You
  • -Given: 12864
  • -Receive: 132332
  • Posts: 4753
  • Rating : 65526
  • I'm choosy whom i share my booty with >.<
Re: Re: Html Tutorial
« Reply #6 on: March 22, 2012, 09:31 PM »
You are not allowed to view links. Register or Login
You have to use the "a href", like this:

Code: You are not allowed to view links. Register or Login

<a href="enter URL here"> enter text here</a>


Just copy and paste my coded example, replacing the enter URL and text fields with the correct info....

Thank jess, ive been wanting to do this for ages.... as you can see i tried it out on my signature :)
 

Offline Tart

  • The Pervy Librarian
  • PTS Expert
  • *
  • Thank You
  • -Given: 1362
  • -Receive: 6601
  • Posts: 731
  • Rating : 7658
Re: Re: Html Tutorial
« Reply #7 on: March 23, 2012, 08:43 AM »
You are not allowed to view links. Register or Login
Like this:

Code: You are not allowed to view links. Register or Login

<a href="enter URL here"> [fontcolor=#669900]colored text/repeat url here[/font]</a>


So that was the problem, didn't know I had to mix <> and [], thanks  :)
 

Offline Primrose‚Ě£

  • PTS Contributor
  • *
  • Thank You
  • -Given: 1740
  • -Receive: 1506
  • Posts: 158
  • Rating : 2180
Re: BBC Tutorial
« Reply #8 on: November 11, 2014, 11:52 AM »
Hey guys! ;D Can you please tell me how I can insert or embed a youtube video bc the embed function alone isn't workin' for me.
 

Tags:
 

Related Topics

  Subject / Started by Replies Last post
1 Replies
4427 Views
Last post August 21, 2009, 08:34 AM
by sumit_rock
0 Replies
3259 Views
Last post December 28, 2007, 12:41 PM
by sunny
0 Replies
3262 Views
Last post April 20, 2008, 06:35 AM
by divya07
0 Replies
2985 Views
Last post October 28, 2009, 04:15 AM
by tsikot
54 Replies
50794 Views
Last post September 01, 2015, 07:22 PM
by Matron
0 Replies
2499 Views
Last post April 26, 2012, 10:28 AM
by Infinitely Bookish
18 Replies
11072 Views
Last post May 19, 2013, 03:10 PM
by GG drypen!