Fire Studios

Dear Readers,

This week has been quite strange and, actually, enjoyable even with all of the odd happenings and events. Which is a nice change of pace because since school started back it's been nothing but one set-back after another, but things are starting to fall into a routine so I can start getting more work done each day. This week had a lot of updates and things that had me checking stuff off my "to-do" list.

This is part 2 of the video series on how to code a website (taking a template from image form to it's XHTML/CSS version).

Go back and Watch part 1 if you haven't!

Dear Readers,

This is the fist in a series of weekly posts where I will keep you all up to date on my personal workings and matters, along with some upcoming's for FS.

So this week has had its highs and it's extreme lows. Some couldn't be avoided, others because other people were having bad days.

This tutorial will teach you an awesome glow effect using some layer styles, the pen tool, and few blending options that most people overlook.

This tutorial will you how to create a nice glow effect as well make it appear as if the glow is wrapping around an object.

Step 1

To begin this effect we'll need an object to wrap around, start by opening some image. I'll be using a picture of "The Cult" off of Deviant Art. Select your pen tool and have it set to "paths" (press "p" on the keyboard).

This video shows the basics of the pen tool and how it can be used. Warning: This is only the basics and does not touch on the more complex functions.

Well through some CSS endeavors to find the golden stylesheet (personal goal of the ultimate design), I have created a CSS only DOM tab system. Meaning when you click on a tab the content changes. Usually this is done with Javascript/jQuery, but since I don't know how to code in either one of those, I created a CSS method.

View the working Example

To center a line a line of text can be very troublesome and drawn out affairs. But you can simple use the "line-height" element of CSS to set the text's height without distorting the font. To apply the rule use the format of "line-height: *height of container*;". Change *height of container* to the height of the div or whatever that is holding your text that you're centering the text in.

#example {height: 100px;}
#example p {line-height: 100px;}

To have a random site title for you site you would place the following code between your HEAD tags.

<script type="text/javascript" language="javascript">
	
</script>

This is the first video tutorial here at Fire Studios! This video will show you how I go through and do the skeletal coding for my website templates. This is part 1 in a 3 part series, so make sure you go to the CSS category to see part 2.

Watch the Video!