SpinnyBoi guide to coding

Welcome To SpinnyBoiz 
Guide To Coding!
Note: If you would like to experiment with anything in here, don't do it in the comments. Experiment with coding here instead.
Audio 
**
SoundCloud Players
<soundcloud url="https://soundcloud.com/old-hermit/love-like-you" height="100"></soundcloud>
To create a SoundCloud player, copy and paste:
 <soundcloud url="https://soundcloud.com/old-hermit/love-like-you" height="100"></soundcloud> 
You can replace my URL with any URL from SoundCloud.
Adding Images/Gifs 
Adding YouTube Players 
thumb|center|234 px
Very simple to add a video, just go into editing the page and on the right side there should be a tab that says add features and media, and then a little thing that says video. all you have to do is click that and add the link.
"How do I make it so your username is displayed?" 
Well, , it's not coding at all!
It's a "magic word" called USERNAME.
To do this, copy and paste:
 {{USERNAME}} 
Tables And colored tables
this 	is
a 	normal 
table	woo
to add this table just go into editing the page and click the little tab on the right side that says table
Look 	At
This 	Table
That 	Is
Colored! 	Isn't
It 	Amazing?
Here's the	Code!
colored table
|
\/
 Tabbers
 {| class="article-table" border="2" style="margin: 0px auto; width: 200px; height: 200px;border:4px inset white;"
 ! scope="row" style="text-align:center;background-color:#000080;" |Text
 | style="text-align:center;" |More Text
 |-
 ! scope="row" style="text-align:center;background-color:#00008B;" |Some more text
 | style="text-align:center;" |lots of text
 |-
 ! scope="row" style="text-align:center;background-color:#000080;" |So much text
 | style="text-align:center;"|Little Bit more 
 |-
 ! scope="row" style="text-align:center;background-color:#00008B;" |S'more
 | style="text-align:center;" |Text
 |-
 ! scope="row" style="text-align:center;background-color:#000080;" |Lots of text
 | style="text-align:center;" |Text
 |-
 ! scope="row" style="text-align:center;background-color:#00008B;" |Text!
 | style="text-align:center;" |Last text!
 |} 
Tabbers are extremely simple to code.
<tabber> 
|-| Hey look =
This is a tabber.
|-| It's used to =
Organize information. 
</tabber>
To create a tabber, copy and paste:
 
 <tabber>
 |-| First heading here =
 Content
 |-| Second heading here =
 Content
 |-| Third heading here =
 Content
 </tabber> 
 
You can add as many headings as you want.
Collapsibles 
This is a collapsible.
this probably wont work, since they are complicated and dont like working
To create this, copy and paste:
{| class="mw-collapsible mw-collapsed" style="border: 3px solid lavenderblush; -moz-border-radius: 6px; -webkit-border-radius: 10px; border-radius: 5px; padding: 4px; margin: 2px; width:85%; align:center;"
|Your Text Here
|-
|Your Text Here
|}
 More will be added later - expect rewriting and new entries soon!
Borders 
This is a standard border.
To create this, copy and paste:
 Insert Your Text Here 
This is a standard rounded border.To create this, copy and paste:
 Your Text Here 
This is a double border.
To create this, copy & paste:
 Your Text Here
This is an outset border.To create this, copy and paste:
Your Text Here
This is an inset border.To create this, copy and paste:
Your Text Here
This is an ultra thick border.To create this, copy & paste:
 Your Text Here
This is a groove border.To create this, copy & paste:
 Your Text Here 
his is a ridge border.To create this, copy and paste: Your Text Here 
This is a dotted border.To create this, copy & paste: Your Text Here
This is a box shadow border.To create this, copy & paste:
 Your Text Here 
This is a rounded box shadow.To create this, copy and paste:
 Your Text Here 
This is dashed border.To create this, copy & paste:
Your Text Here
This is a shadow border.To create this, copy & paste:
 Your Text Here
This is a nice, non-excessive combination of solid, dashed and dotted.
Just in case, here's the coding for that:
 
 
 Your text here!
 
Fonts & Colors 
To change a font, simply use:
 your text here 
List Of Fonts 
Note: Some fonts are only visible from certain computers, any font that appears as Times New Roman, that isn't it of course, is not compatible with your computer. Not all fonts may be listed here as well.
 		
Georgia 		Comic Sans MS
Arial 		Impact
Palatino 		Times New Roman
Arial Black 		Lucida Grande
Courier New 		Gill Sans MT
American Typewriter		Brush Script MT
Verdana 		Webdings (Webdings)
Trebuchet MS 		Wingdings (Wingdings)
Arial Narrow 		Arial Rounded MT Bold
Andale Mono 		Papyrus
Herculanum 		Marker Felt
Osaka 		Tahoma
Copperplate 		Futura
Skia 		Zapfino
Times 		
Apple Chancery 		Optima
Big Caslon 		Hoefler Text
Credit to Fubsy for font list 
Changing Color 
This text is red.
To create red text, copy & paste:
 Insert Text Here
Shades 	Yellows 	Reds/Pinks 	Oranges 	Greens 	Blues
Black 	FloralWhite 	LavenderBlush 	Linen 	Ivory 	MintCream
DarkSlateGray 	Beige 	MistyRose 	OldLace 	Honeydew 	Azure
DimGray 	Cornsilk 	Pink 	AntiqueWhite	PaleGreen 	LightCyan
Gray 	LightYellow 	LightPink 	PeachPuff 	LightGreen 	AliceBlue
SlateGrey 	LightGoldenRodYellow	LightSalmon 	SandyBrown 	GreenYellow 	LightBlue
LightSlateGray 	LemonChiffon 	Salmon 	Coral 	MediumSpringGreen	PowderBlue
DarkGrey 	Yellow 	DarkSalmon 	Orange 	SpringGreen 	PaleTurquoise
Silver 	Khaki 	LightCoral 	DarkOrange 	Chartreuse 	SkyBlue
LightGray 	DarkKhaki 	PaleVioletRed 	Chocolate 	LawnGreen 	LightSkyBlue
Gainsboro 	Gold 	HotPink 	 	Lime 	DeepSkyBlue
WhiteSmoke 	Goldenrod 	DeepPink 	 	DarkSeaGreen 	Cyan
Snow 	DarkGoldenrod 	MediumVioletRed	 	YellowGreen 	Turquoise
White 	 	IndianRed 	 	MediumAquamarine 	MediumTurquoise
 	 	Tomato 	 	MediumSeaGreen 	DarkTurquoise
Violets/Magentas	Browns 	OrangeRed 	 	Olive 	LightSeaGreen
GhostWhite 	Seashell 	Red 	 	SeaGreen 	CadetBlue
Lavender 	Linen 	Crimson 	 	ForestGreen 	DarkCyan
Thistle 	BlanchedAlmond 	FireBrick 	 	Green 	Teal
RosyBrown 	Bisque 	Brown 	 	DarkOliveGreen 	SteelBlue
Plum 	Wheat 	DarkRed 	 	DarkGreen 	CornflowerBlue
Violet 	NavajoWhite 	Maroon 	 	 	DodgerBlue
Orchid 	BurlyWood 	 	 	 	RoyalBlue
Fuchsia 	Tan 	 	 	 	Blue
Magenta 	Peru 	 	 	 	MediumBlue
MediumOrchid 	Sienna 	 	 	 	DarkSlateBlue
MediumPurple 	SaddleBrown 	 	 	 	DarkBlue
MediumSlateBlue 	 	 	 	 	Navy
SlateBlue 	 	 	 	 	MidnightBlue
BlueViolet 	 	 	 	 	
DarkViolet 	 	 	 	 	
DarkOrchid 	 	 	 	 	
DarkMagenta 	 	 	 	 	
Purple 	 	 	 	 	
RebeccaPurple 	 	 	 	 	
Indigo 	 	 	 	 	
Credit to Fubsy for font list,  original here .
Floating Images
Fixed to Bottom Right
Copy & Paste:
 Insert Text or Image Here 
Fixed to Top Right
 Insert Text Or Image Here
Fixed to Bottom Left
 Insert Text Or Image Here 
Fixed to Top Left
 Insert Text Or Image Here
Headings
This text has a blue text shadow.
To create this, copy & paste:
 Your Text Here 
You can also make text risen and dropped.
This text is risen.
To create this, copy & paste:
 Your text here
This text is dropped.
To create this, copy & paste:
 Your text here 
So what about sizing text?
This text is in size 1.
This text is in size 5.
To create this, copy & paste:
 Your Text Here
You can alter the size by replacing the "3" with your number, sizes 1-5.
So now that we know about text coding, how do we make headings?
Simple, combine them.
💫Welcome to Space!💫
See how nice that is?
In case you're wondering, copy & paste:
 💫Welcome to ImaginaryClan!💫 
Backgrounds
This is a gradient black and white background.To create this, copy & paste: Your text here
This is a rounded gradient background.To create this, copy and paste:
 Your Text Here 
Polls (broken as of 1/30/23)
Polls are one of the easiest things to code.
<poll>
Is this guide helpful?
Yes
A little bit
No
</poll>
To create a poll, copy & paste:
 < poll>
 Your Question Here
 Answer
 Answer
 Answer
 </poll>
Delete the space in < poll> to create <poll>.
This guide was/is created by TheDarkestSpirit but is maintaned by flowf
</center>
Category:Guides
Category:Helpful