Free overrides

How to add a header image.

Thu, 08 Jul 2004 02:10:09 GMT

This one is fairly simple. After I give you this override, all you really need is an image and a host for the image ;D

Put this in your override box (sans *s)

GLOBAL_HEAD<=
<style type="text/css">
body {
background-color: white;
background-image: url(YOUR URL HERE.);
background-position: center 10px;
margin-top: the height of your picture + 5-10 px;
}
</style>
<=GLOBAL_HEAD
Now some of you may be wondering how to get an image you find into a url form.

Well you upload it to your own host. What's a host, you ask? A place that *hosts* images for you. ^_^ I personally use Photobucket. It's free!

Wed, 07 Jul 2004 23:25:53 GMT

This layout is...you guessed it XD the communities current layout ;D

I haven't updated this in awhile and felt the need to offer something so this is it. ^_^

Of course the nav. links are changed and the comment links are

# did || Comment

Enjoy ;D

-meg

Wed, 23 Jun 2004 08:01:31 GMT

OH yeah. And also.

We're validated too. =D

Wed, 23 Jun 2004 07:34:46 GMT

An announcement sort of thing I suppose. =]

All the layouts here are officially CSS Validated. Every damn one. (Okay, there are only three and one of them was a reject on my part. So fucking sue me?)

I had to alter some, and it also meant taking out the scrollbar coloring.

But that's okay. Because now your layouts have perfect CSS according to w3.org. ^^;

So enjoy.

♠
Meghan

Sat, 19 Jun 2004 05:12:12 GMT

This was a layout that I had intended to use myself but...eh, just fell out of love with it. I dunno. Might be a mood thing.

But maybe it's your style! Just PM me with Layout 3 as the subject and...

a.] Tell me the name you want where it says YOUR NAME HERE.
b.] What you want the comment links to say. The ones right now are

[#] Enter at your own risk.

But those are what the comment links on my PERSONAL journal say. So I'm making you get in touch with that shred of creativity in you and deciding what you want the comment links to say. XD

Have fun with it <3 <3

Meghan

Wed, 16 Jun 2004 00:44:48 GMT

So, you want to know how to get a scrollbox?

First you probably want the override for it. I'll just copy and paste it straight over here then "break it down." I may have to come back later and edit this entry to do that seeing as how I am pressed for time. >.>

You end up having to insert a divlayer basically.

GLOBAL_HEAD<=
<style type="text/css">

div {
position:absolute;
left:18%;
right:0%;
top:12%;
bottom:0%;
width:60%;
height:450px;
overflow:auto;
border:0;
scrollbar-base-color: white;
scrollbar-track-color: white;
scrollbar-face-color: white;
scrollbar-highlight-color: black;
scrollbar-3dlight-color: white;
scrollbar-darkshadow-color: white;
scrollbar-shadow-color: black;
scrollbar-arrow-color: black;
}
.entrybox {
border: 1px solid #ffffff;
width: 60%;
}
</style>

<=GLOBAL_HEAD

LASTN_WEBSITE<=
<style type="text/css">

/*Because putting in the div override screws up your name, you need to hide it then replace it with these codes*/


</style>

<!--This is the code where you put your new name--!>
<caption><font size=1>YOUR NEW NAME HERE</font><br></caption>
<=LASTN_WEBSITE

left:18%;
right:0%;
top:12%;
bottom:0%;

These are all the posistioning of your scrollbox on the page. Do you want it left, right, high, low. Pretty straight forward.

width:60%;
height:450px;

These define the dimenions of your box.

scrollbar-base-color: white;
scrollbar-track-color: white;
scrollbar-face-color: white;
scrollbar-highlight-color: black;
scrollbar-3dlight-color: white;
scrollbar-darkshadow-color: white;
scrollbar-shadow-color: black;
scrollbar-arrow-color: black;

The scrollbar colors. This is an IE-ism, so it won't show up in other Browsers such as Netscape and Mozilla. ;x

.entrybox {
border: 1px solid #000000;
width: 60%;
}

This is all about your entries. The border you want on them and how wide you want them.

FAQs

I have sidescrollage. WHY?!

Could be many different reasons. Are your entries bigger than your box? Have you pushed it too over too far? Sometimes the world just hates you and you can't do zilch about that. =/

Why is my name so screwy?

Because you haven't been patient enough to just let me explain the rest of this.

This override screws with the name a bit. Put this override in, NOT IN YOUR GLOBAL HEAD but after.

Never mind...I'm putting it in a comment. whew, is it screwing with something here. O_O XD

So there you have it! YOUR VERY OWN SCROLLBOX! YIPEE!

XD Have fun with it.

Tutorials?!

Mon, 14 Jun 2004 04:02:35 GMT

YES! I decided in effort to help New Caleida-ians everywhere, I'm going to do a tutorial every once in a while. And as miyavi so powerfully chanted, lets give power back to the people! WOO!
XD

Okay. Here we go.

NOTE: All my effects/overrides are tested in generator and generator ONLY. Okay? NOT just these, BUT ALL OVERRIDES USED FROM NOW AND INTO THE FUTURE ARE USED IN GENERATOR. WHY? BECAUSE GENERATOR CAN DO THE MOST STUFF. ^_^

Okay. Again. Here we go.

So ya wanna know how to make your links fancy?

GLOBAL_HEAD<*=*
<*style type="text/css">
<*!*--
A:link { color: #0000FF;
text-decoration: underline 1px #0000FF;
}
A:visited { color: #CC66CC;
text-decoration: underline 1px #0000FF;
}
A:active { color: #0000FF;
}
A:hover { color: #0000FF;
cursor: auto;
text-decoration: underline 1px #0000FF;
}
<*/*style>
<*=*GLOBAL_HEAD

that's what your links automatically look like.

here is actually a pretty cool chart of some a:hover properities, which is what you all think of as link effects. Thank you slack, you're a goddess. <3 <3

WAIT THOUGH WAIT OMG I WANT DAT NIFTY BLURRY/WAVEY/SHASDOWDY EFFECT! GIMMIE GIMMIE GIMMIE!

Hold your damn horses.

Okay. A little pre-lesson first. Some of these properties use directions, which have you decide what direction something blurs/shadows/dropshadows.

The numbers stand for the following:

0 (top)
45 (top right)
90 (right)
135 (bottom right)
180 (bottom)
225 (bottom left)
270 (left)
315 (top left)

I kind of think of it as degrees. Eh? Okay, that's sort of stupid. Oh well.

Glow
filter:glow(Color=#003399,Strength=2);

Color is, obviously, the color of the glow and strength is how glowey.

Blur
filter:blur(Add=1,Strength=4,Direction=45);

I guess add is how much you add to it pixels wise and strength how blurry. I don't know, I haven't ever used this filter before.

Wave
filter:wave(Add=1,Freq=2,LightStrength=20,Phase=45,Strength=3);

Frequency is how many waves and light strength is how strong the light is.

You would add all these to your A: Hover section. So lets make ourselves some pretty damned fancy links, ok?

GLOBAL_HEAD<*=*
<*style type="text/css">
<*!*--
A:link { color: #FF6600;
text-decoration: underline 1px solid #0000FF;
}
A:visited { color: #CCCCFF ;
}
A:active { color: #FF6600;
}
A:hover { color: #0000FF;
cursor: auto;
text-decoration: underline 1px dashed #FF99FF ;
overline 1px dashed #CC9900;
line-through dashed #006666;
font-weight: bold;
background-color: #FFFFCC;
font-style: italic;
line-height: 2px;
text-transform: uppercase;
letter-spacing: 5 px;
filter:
wave(Add=1,Freq=2,LightStrength=20,Phase=45,Strength=3);
blur(Add=1,Strength=4,Direction=45);
filter:glow(Color=#003399,Strength=2);
}
<*/*style>
<*=*GLOBAL_HEAD

So there you have it folks. The most seizure-inducing links your eyes will ever see. O________O

NOTE: THIS A: HOVER AND ENTIRE OVERRIDE PROBABLY LOOKS AWFUL. NOT ONLY WILL HAVING SO MANY EFFECTS HURT YOUR EYES, I ALSO JUST RANDOMLY SELECTED COLOR CODES OFF A CHART WITHOUT ANY SCHEME IN MIND. I DO NOT RECCOMEND USING THIS AS AN OVERRIDE THIS IS JUST ME SHOWING YOU HOW IT ALL LOOKS TOGETHER. REMEMBER TO TAKE OUT THE *'S

Woo. Have fun folks.

WARNING: ALL CSS FILTERS WILL ONLY WORK IN INTERNET EXPLORER. IN INTERNET EXPLORER ON MACS, THE LINKS CAN'T EVEN BE CLICKED. I DO NOT RECCOMMEND USING THEM AND SWEAR SOLEMNLY NOT TO USE THEM MYSELF.

-deep even breaths-

damn migraine. -hits head-

Sat, 12 Jun 2004 07:06:33 GMT

This layout if once again fairly simple.

Please PM me with Layout 2 in the subject line if you want the overrides to this layout.

The comment links are

"[1] Blue skies may change a man."

The a: hover effect has an overline and an underline.

The normal cursor is crosshair and the hover cursor is sw-resize, I believe.

Layout 1

Sat, 12 Jun 2004 06:40:59 GMT

It's a fairly simple layout, took maybe ten minutes to make. You may tweak it as you like.

The comment links are:

$1.00 ♠ How much will you pay?

PM me with the subject being Layout 1 if you want the overrides to this.