Interesting coding and how it works

Subject: Re: Interesting coding and how it works Thu Jan 28, 2016 1:54 am

Code for entire post note I enter a few times between the second to last and last

to add distance between the box and the bottom of the back ground.

Code:: <div style="width: 610px; background-image: url(http://i68.servimg.com/u/f68/17/30/22/56/abstra10.jpg); width: 800px; font-family: goat; font-size: 12px; text-align: left; opacity: 1.0; line-height: 12px; color: white; border-style: solid; border-color: blue; box-shadow: #ffffff 0px 0px 10px; border-width: 3px;">

[center][flash(480,25)]http://www.youtube.com/v/2G7pNAeC_Fc?version=2&loop=1&color2=0x0099jj2&color2=0x363636[/flash][/center]

<Center><div style="box-shadow: blue 0px 0px 10px; background-color: black; opacity: 0.8; text-align: justify; padding: 5px; color: white; border-style: solid; border-color: #d1d1d1; border-width: 3px; width: 538px; line-height: 54px; font-size: 14px; "> </div></div>

Subject: Re: Interesting coding and how it works Thu Jan 28, 2016 2:39 am

Code:: <div style="width: 610px; background-image: url(http://i68.servimg.com/u/f68/17/30/22/56/abstra10.jpg); width: 800px; font-family: goat; font-size: 12px; text-align: left; opacity: 1.0; line-height: 12px; color: white; border-style: solid; border-color: blue; box-shadow: #ffffff 0px 0px 10px; border-width: 3px;"></div>

This code is for the base background not the music player nor inner box.

How to customize (Disclaimer I learned these methods by fiddling around with things so this is just what all I have figured out on how you can alter the coding so there may be a few other ways that I don't know about yet.):

After "Background-image:" there is "url(https://i.servimg.com/u/f68/17/30/22/56/abstra10.jpg);" you can change the url in here to change the main back ground picture.
at "width: 800px;" you can change the number of 900 to alter the over all width of the backgrounds coverage but 900 note seems to cover the usual standard post width.
"font-family: goat;" you can change goat to another font name to change what type of font the text in the main back ground area will be. I believe the normal font name for normal posts are "Arial"
"font-size: 12px;" this here is the same thing as the font but the basic text's size note i belive you can still so the standard code altering still works in this but this is the non altered texts font and such will be. I think 12 or 14 is the normal font size for text in posts but you change the 12 in this part of the coding to change the main text size.
"text-align: left;" Gain same concept here just change the word left to what kind of centering you want.
"line-height: 12px;" this is the amount of space given between the top and where you start typing and where you stop typing and the bottom of the back ground. I relive if I remember right the lower down the number attached to the px is the more the top and bottom of the back ground hugs your text and the higher the more space. Basically this says how much space there is between your actual post and the actual back grounds top and bottom.
"border-style: solid;" You can change the word solid to faded to make the code i believe break and remove the boarder from your back ground picture so if you don't want any boarder changet the word solid to faded. I'm not sure what else you can do here but i wanted this to be an option to remove the border for those who don't want one.
"border-color: blue;" this one is a given just change the word blue to another color word or code. To my understanding words have appeared to work better for me but i think coding still works for the colors here.
"box-shadow: #ffffff" by changing the color code #ffffff here you can change the glow around the main border/background to what ever color you want to change it to here.
"0px 0px 10px" Leave the two 0pxs alone if you alter these you will just mess up the glow bordering and how they are placed from what i can tell. Though if you alter the 10 number attached to the last px you can increase or decrease the size of how far out the glow goes.
"border-with: 3px;" you can alter the 3 to change how thing the border around the back ground is.
In between the ending > and the last < is where all your fun shit goes so it is going over the back ground.

Subject: Re: Interesting coding and how it works Thu Jan 28, 2016 2:55 am

Code:: [center][flash(480,25)]http://www.youtube.com/v/2G7pNAeC_Fc?version=2&loop=1&color2=0x0099jj2&color2=0x363636[/flash][/center]

"(480,25)" This alters the size of the player. leave the 25 be or else it will mess up the player but you can alter the 480 to change the width of the player, but note stay within 425 - 480.
"2G7pNAeC_Fc" this is the part you must change to later the sound that comes from the player. To change this you take the main url of any video aka if you are on a playlist the main url would be everything BEFORE the & because after the and is the url for the play list that is added on so that the play list works and goes to the next video and functions and what not. Now from this url You want to take the following that is not crossed out. ~~https://www.youtube.com/watch?v=~~Ej1sk9mQ3Sg (note not the url to the player i used above it is just a random amv i have up at the moment that came up in a play list.) now this url doesnt have anything that needs to be altered but if the part Ej1sk9mQ3Sg here has any suffixes like ? or other such things take them out UNLESS they are _ or - then you leave them in. Just take what you then have and replace the code at the beginning of this bullet with it and you will replace that audio with the audio from the video you took the code from.
"loop=1&color2=" You can change the 2 to either 1 or 3 to get a diffrent color lay our scheme/its design set up.
"0x0099jj2" Here you can change the 0099jj part for the main color of the player. You change it by replacing the 0099jj part with another color code but note leave the ending 2 after the js or else you will break the coding for the player.

Subject: Re: Interesting coding and how it works Thu Jan 28, 2016 3:10 am

Code:: <Center><div style="box-shadow: blue 0px 0px 10px; background-color: black; opacity: 0.8; text-align: justify; padding: 5px; color: white; border-style: solid; border-color: #d1d1d1; border-width: 3px; width: 538px; line-height: 54px; font-size: 14px; "> </div></div>

"center" This part centers the inner box remove it or later it if you want it will not break the coding.
"box-shadow: blue" This changes the glow color of the border for the box.
"0px 0px 10px" Leave the two 0pxs alone if you alter these you will just mess up the glow bordering and how they are placed from what i can tell. Though if you alter the 10 number attached to the last px you can increase or decrease the size of how far out the glow goes.
"background-color: black; opacity: 0.8;" black will change the background coloring for the inner box. To my understanding the 0.8 part will change how see though the color of the back ground is so you just change that part to alter how see through/ solid it is.
"text-align: left;" This just changes how the unaltered by additional coding text will be aligned change the word left to how ever you want the text to be aligned.
"border-style: solid;" You can change the word solid to faded to make the code i believe break and remove the boarder from your back ground picture so if you don't want any boarder change the word solid to faded. I'm not sure what else you can do here but i wanted this to be an option to remove the border for those who don't want one.
"border-color: white;" this one is a given just change the word blue to another color word or code. To my understanding words have appeared to work better for me but i think coding still works for the colors here.
"border-with: 3px;" you can alter the 3 to change how thing the border around the back ground is.
"width: 538px;" How wide the inner box is.
"line-height: 54px;" how far the borders are from your text height wise.
"font-size: 14px;" this here is the same thing as the font but the basic text's size note i believe you can still so the standard code altering still works in this but this is the non altered texts font and such will be. I think 12 or 14 is the normal font size for text in posts but you change the 14 in this part of the coding to change the main text size.
In between the ending > and the last < is where all your main text goes and where you must put it in order for it to appear inside the box..

Subject: Re: Interesting coding and how it works Thu Jan 28, 2016 3:36 am

This is what I like to call the "GOTCHA!" by typing this code in anywhere in posts it will display the username of who ever is looking at it. Ergo I would see Energy aka my current username but you would see your current username instead. you can add size changes and color changes to this as well by encasing the code in another code.

Example: Guest

Code:: {USERNAME}

Subject: Re: Interesting coding and how it works Thu Jan 28, 2016 3:44 am

How to make your text scroll: This one is rather simple you encase what you want to scroll in the following codes to get them to scroll.

Code:: [scroll][/scroll]

Horizontal scroll

Code:: [updown][/updown]

Vertical scroll

Subject: Re: Interesting coding and how it works Thu Jan 28, 2016 3:49 am

To do this cool glowing effect over your text just encase your text in the following code.

Code:: [blur][/blur]

Subject: Re: Interesting coding and how it works Thu Jan 28, 2016 3:51 am

Mirror/flipping your text letters

Code:: [fliph][/fliph]

Horizontal mirror effect

Code:: [flipv][/flipv]

Vertical mirror effect

Subject: Re: Interesting coding and how it works Thu Jan 28, 2016 6:20 pm

Code:: <Center><div style="box-shadow: blue 0px 0px 10px; background-color: black; opacity: 0.8; text-align: justify; padding: 5px; color: white; border-style: solid; border-color: #d1d1d1; border-width: 3px; width: 538px; line-height: 54px; font-size: 14px; "> </div></div>

UPDATE! IMPORTANT! the "line-height: 54px;" is actually the spacing between lines aka there will be a large gap in your lines of text if you leave it at 54, i changed it to 20px and it seemed to fix the line spacing.

» Updates to the site and Coding How to thread
» How This Works
» How This Works
» How court works
» New Banner Rules/Archive/How It Works