[list]i This is an unfinished guide, that will be constantly adding content[/i]
Table of Contents
[list]
- Guide Goal
- BBCode/HTML[list]
[li]General - Deprecated Coding
[/li]
- Images
[li]Uploading
- Editing
- Placing on Site (BBCode Part)
- Resizing
[/li]
- Site Specific
[li]Polls
[/li]
[/list]
1. Guide Goal
The goal of this guide is to create a way for new computer users to be able to operate and understand the site. I’m aware a number of people have already done stuff similar to this, but my goal is to provide understanding of BBCode, Image Editing/Posting, and provide links to other stuff.
2. BBCode/HTML
BBCode/HTML - General
BBCode is a coding system used for internet messaging boards. It’s derived from HTML and meant to be a slimmer, shorter version of it. The goal of it is to provide a way of limiting posts and to simplify communication on the web.
HTML, is the global markup language to create web sites. BBCode is entered by the user and the server converts it to HTML for the web browser to read. Unlike HTML however, BBCode uses array brackets instead of greater/lesser than signs.
[ and ] = BBCode, Array Brackets
< and > = HTML, Greater/Lesser Than Signs/Brackets
To end a command started with BBCode/HTML, you take the beginning of the original code, and just add a backslash to it. Behold, the backslash → /
By taking the beginning of the original code, I mean something like this.
[/list][/list]
[url=http://www.yoyoexpert.com/]I lead to YoYoExpert.com![/url]
the command is url=blah, but the end command only involves the url part and the backslash. Not what it equals.
You can’t perform as many actions as you can with HTML, but you can still do a lot with it, such as creating hyperlinks, showing images, etc.
BBCode is used on YoYoExpert and a large sum of other sites. Most commands are already there for you above each post, like bold, italic, underline, etc. Just highlight over what you can and click the button. Chances are, you won’t have to learn the custom commands for BBCode, since they’re right there. If you know HTML, you already know BBCode.
YoYoExpert gives us a lot of freedom as to using BBCode. As I’ve said before, the purpose is to simplify and prevent hacking. The site even allows us to do stuff that shouldn’t be done, like marquee’s.
BBCode/HTML - Deprecated Coding
As the world wide web develops and advances, tags and commands are removed from the standards, rules are modified, new tags and attributes are added, etc.
This site, hasn’t moved on to those standards very much. For one, the BBCode tag you all know and love as [ move ] is no longer accepted in HTML coding.
The marquee tag is a non-standard HTML element which causes text to scroll up, down, left or right automatically. The tag was first introduced in early versions of Microsoft’s Internet Explorer, and was compared to Netscape’s blink element, as a proprietary non-standard extension to the HTML standard with usability problems. It is deprecated by the W3C and not advised by them for use in any HTML documents. - Marquee element - Wikipedia
It also makes it hard to print a website. Think, where would the picture go if it’s constantly moving? How do we decide where to put it when it’s on paper? We aren’t at the point of technology where we have moving pictures on paper yet, so that’s no an option either
In short, please stop using deprecated tags. They’re not helping the evolution of the web. Or keeping this site up to date
Watch what bad code does to penguins.
http://img192.imageshack.us/img192/5297/grinu.gif
into… (I recommend you look away)
http://img192.imageshack.us/img192/2425/sm43gif.gif
They also make the geeks among us twitch. Marquess and other outdated or badly written code can also cause us geeky people to have seizures in rare cases. Please, help us put an end to seizures among geeks. - mrcnja
3. Images
Images - Uploading
To use images on YoYoExpert, your picture has to be taken with a camera, uploaded on to a site, then loaded onto the site. YoYoExpert doesn’t provide an uploading service, it’ll just cause too much unneeded server stress.
Loading from cameras are pretty self explainable. If the is the step you’re having trouble one, refer to the camera’s manual. Once the picture is on your Hard Drive, the next step is to get it on the Web.
You can use the following sites to upload images.
Do not use Facebook and MySpace, although it sort of works, it won’t viewable to everyone. I recommend TinyPic or ImageShack, since it doesn’t require registration. PhotoBucket however, forces you to register and be over 14.
Images - Editing
Before uploading, you can edit your image to look more appealing. Tools like the following can be used.
These are free image editors available for download.
These are online image editors that can be used independently in your web browser
Out of all of the above, I recommend GIMP the most. It is available on on all platforms (Windows, Mac, Linux) and is comparable to Adobe PhotoShop.
9/10 times a day, I’m bored outside of school. Drop me a pm if you want help with image editing, uploading, or various stuff like that, feel free to. I can even make a siggie for you if you wish.
Images - Placing on Site (BBCode Part)
The final step of getting the picture on the site involves some simple BBCode knowledge. You must know the location on the web the image is located. I’ll use the YoYoExpert Logo as an example
The image is located at the following URL.
This is about the standard method of getting the url of any image found on the web. On almost any browser has this built in. Just in different ways.
In Mozilla Firefox, right click, “Copy Image Location”
- In Internet Explorer, right-click on the image, select “Properties”, and copy the url.
- In Safari, right click, “Copy Image Address”
Thought it’s not the only method of getting an image’s url in a web browser, it’s probably the easiest way. Most websites image hosting services will already have the url provided in a box, ready for you to copy. You just have to look for it.
Now once you have the url, you just have to insert it between the img command. The syntax as follows.
![](upload://sOM0HqBv0B2itl20SpnAgyWnks8.jpg)
All you have to do is paste in, and you get the following from the code above. Well, with a center tag in it too
4. Images - Resizing
On this site, it is important to resize your images. Do not post pictures above 800 by 800 pixels. Pictures above this dimension will probably cause overflow and layout problems. If it’s meant to be big, like a wallpaper, post a link, or link the smaller picture to a bigger one.
Luckily for us, the forums have a built in resize function (actually, it’s an HTML attribute, translated in BBCode).
Here’s how to use it, add width=??? and height=??? to the img tag, like shown below. Notice how it’s smaller than the pic above.
![](upload://sOM0HqBv0B2itl20SpnAgyWnks8.jpg)
Now, put your knowledge to the test. Think, how would you make an image into a link? Put the image in the link tag of course!
[url=http://yoyoexpert.com/images/expert_logo.jpg]
![](upload://sOM0HqBv0B2itl20SpnAgyWnks8.jpg)
[/url]
Site Specific
Site Specific - Polls
To add a poll, on this site, you must click on the “Add New Poll” button on the right of the forums lists, as shown below. It is currently not possible to add a poll to an existing topic at the time. (There’s no point in that actually)
http://img249.imageshack.us/img249/1360/screenshot11o.png
i This is an unfinished guide, that will be constantly adding content[/i]