Test-css Wiki

Welcome to Test-css Wiki
Important Pages:
Wiki RulesStaffTesting RulesFree DesignsDisscusions
Staff: Kaii (Lead Admin/Bureaucrat), Lara (Admin), Esortsyt (Rollback), Peter (Apprentice)
Bots: BotKitty

READ MORE

Test-css Wiki
Advertisement

Alrighty, last week's mentoring from Regina was a big success! So next up is mentoring from ReadingUnderTheStars!

The Mentoring[]

Okk! Today, I am going to be teaching you how to make a Profile Door.

A profile door is words (usually associated with a picture or GIF) that is kind of an introduction into your profile.

They usually say things like “welcome to my profile” or something like that.

I am stalling this and I don’t know why.

If you don’t know what it looks like, and want to see a preview, click here.

Note: This code may look really complicated and long, but it isn’t :)

<div class="mw-collapsible" id="mw-customcollapsible-MW-Entrance" style="position:fixed; left:0; top:0; width:100%; height:100%;opacity:100%; z-index:1;">[[File:INSERT PICTURE OR GIF HERE.gif|1400px|link=]]<div class="mw-customtoggle-MW-Entrance" style="position:fixed; top:40%; left:33%; width:33%; max-height:40%; border:20px BORDER AND BORDER COLOR;padding:1%;-moz-box-shadow: 0 0 5px 3px SHADOW COLOR; -webkit-box-shadow: 0 0 5px 3px OTHER SHADOW COLOR;padding:20px; padding-bottom:1.5px; font-family: INSERT FONT HERE; font-color:FONT COLOR;text-shadow: 2px 2px 2.5px TEXT SHADOW; font-size:150%; line-height:97%; font-weight:bold; text-align:center;">TEXT HERE</div></div>

So, once you have the code, you can customize it as you like. There are different attributes that make it a profile door. Some things you can customize:

Border

Font

Font color

Background

I’m going to show you first the text attributes.

In the code, you can see where you add the font, font color, and font shadow.

If you don’t know which fonts to add into the door, click here for a list.

Once you have the font, next is the other attributes.

For a border, you type in the certain type of border (ex: dotted). The different types of borders are:

Dotted

Solid

Dashed

Double

Ridge

Groove

Inset

Further information:

Then, next to the type of border, you add the color.

For example, if I wanted to do a dotted blue border, I would type in, dotted blue.

Next is the font color. You can use either a name or a hex color code.

If I wanted to have green text, I would type in the color. If I wanted a hex color code for my color, I would copy the color into the space where you provide the color. (Don’t forget the # before the color code!)

Now for the background.

For a background, you can do a GIF or a picture. On the KotLC wiki, I used a GIF, see the example here.

For a GIF or a picture, make sure the thumb isn’t there. Instead, just insert the name into the space provided and make sure the center and link is still where it should be.

For the shadow color, it is the same for the colors. You can either type in the name of the color or the hex color code.

Have Fun!

~Star

Amazing job, Star![]

We hope you enjoyed this mentoring! Stay tuned for next week!

Advertisement