Fonts

Changing the font of text using html is a tricky thing, because a font text command will only work if the font you’re specifying is already loaded onto the computer you want to display the text on. So you might download some crazy awesome font to your computer and call to it in a command, and it’ll show up just fine for you, but for everyone else…not so much.

One way to get around this problem is to create an image with the text you want to display in it and then place the image wherever you want. 

Speaking of which, the way to insert an image into an updates tab (or anywhere in html, for that matter) is like so:

If you want the image centered, use:

However. The way you do call on a font is like this:

text text text

These are some standard fonts that will show up on almost every computer:

arial font

algerian font

bookman font

braggadocio font

courier font

desdemona font

garamond font

modern font

symbol font(Somewhat conspicuous.)

wingdings font(Even more conspicuous.)

PLACEMENT

Not entirely sure what you mean by “placement,” but I’m going to assume you mean placement of the tab itself.

Somewhere in your html you’ll have some code that looks like this:

#updatestab { //div reference so div can be called on laterfont-family:calibri; //specifies font family. font is defined earlier in code.font-size:10px; //font sizecolor: #000000; //font colorwidth:125px; //text box widthheight:auto; //text box heightpadding-top:3px; //margins inside boxborder:1px solid#b8b8b8; //color and thickness of border margin-left:20px; //positioning of text boxmargin-top:-50px; //positioning of text boxtext-align:center; //text is aligned in the centerposition:fixed; //makes it so the box doesn’t float around on different sized moniters}

To adjust the placement of the tab itself, change the values after margin-left and margin-top to whatever you want. It will probably take some fiddling around to find a position you like - I know that about half the time I spent on my old updates tab was shifting it over one pixel and then back and deciding which was better.

NOTE: If you have a standard updates tab where you hover over an image and a little box with some text in it appears, there should be two div ids - one for the text box and one for the picture. The one for the picture will look very similar, like so:

#updatestab img{width:70px;margin-top: -150px;margin-left: 50px;position:fixed;}

You can alter the position of the image, again, by changing the margin-top and margin-left values.

COLORS

Changing the color of text is, thankfully, really easy. First you need to find the html color code of the color you want. I use this site. Find the color you want and copy the string of numbers and letters in the box at the top. Then use the following code to change the text:

text text text text

For example:

this text should be bluish

Ta-da!

You can also put a little box of color around text (check out my updates tab for examples of this). To do so:

text text text text

The padding is basically how big the box is going to be. The 1px means that the border of the box will be at a 1 pixel distance from every side of the text. (Sorry, I know that was a bad explanation, but it’s difficult to describe…try changing that value to see what happens.)