10:49pm Mar 17 2010 (last edited on 11:03pm Mar 17 2010)
|
Normal User
Posts: 8
|
First Steps<All tutorial is (c) Allegra. Anyone can refer to this tutorial, however you may not repost this outside of Rescreatu or for your own guide without my permission. You do not have to credit me on your profile (: However I would love to see what you came up with!>
â—‹ If you use Firefox, the Firebug is a great add-on to show you which parts of the CSS is which on Rescreatu.
â—‹ You wouldn't need to use trial-and-error to find out which is which.
â—‹ List of profile modules and more you could alter.
These are grouped by div IDs and div Cla.sses. More on this later.
#header includes the top banner "rescreatu" and the empty space below, down to the top of the Icons
.head the icons and the grey "Rescreatu" tab, also the top black border
#sidebar1 the navigation on the left. Includes "navigation" and "today"
#navigation the nagivation, ONLY the NAVIGATION. Does not include "today".
#today the today, ONLY the TODAY. Does not include "navigation".
#sidebar2 the shoutbox.
#content the center of the webpage. I don't advise you to change this, this may alter your whole profile content page.
.body the inside content, extending to the left & right border
.inner the complete unside text, only including the right border
#footer the very bottom of the page- doesn't include the two blanked out adboxes.
.foot the bottom border
.ad-bottom the bottom ads
#block1, #block2, #block3, #block4, #block5, #block6, #block7 your profile modules, includes your user information and profile pets.
If I do make a mistake, please rmail me and correct. Please do not post here, as I am not finished with the guide yet! I'll edit the guide with your name for credits. Thank you.
Socks are lucky, who says they aren't?
|
10:53pm Mar 17 2010 (last edited on 11:15pm Mar 17 2010)
|
Normal User
Posts: 8
|
Types of Divs
You can find a whole lesson on this via Google, however this is just basically what you have to know for profiles in Rescreatu.
Div IDs
Div IDs are div layers with # in front of them- like #header, #footer, etc. To use these with your coding, in the text area, you have to insert div id=YOURIDHERE followed by your text and an ending /div. Make note that ids have no quotation marks before and after its name.
To create a div ID, you must, in your coding style area, use a # to tell that it's an ID. Then, you can follow up with a word; you can use numbers, letters, and underscores but no spaces and symbols, to lessen the confusion.
Div Cla.sses
Div Cla.ss are div layers with . in front of them- like .foot, .head, etc. To use these with your coding, you have to insert div cla.ss="YOURCLA.SSHERE" followed by your text and an ending /div. Note that cl*censored*es have quotation marks before and after its name.
To create a div cla.ss, you must use a period (.) to tell that it's a cla.ss. Then, you can follow up with a word; you can use numbers, letters, and underscores but no spaces and symbols, to lessen the confusion.
Div Align
You can substitute your html codes for center, right, left- you can use divs to do the exact same thing. Just always remember to close of your divs.
align right: div align="right"
align left: div align="left"
align center: div align="center"
Socks are lucky, who says they aren't?
|
10:53pm Mar 17 2010 (last edited on 11:36pm Mar 17 2010)
|
Normal User
Posts: 8
|
A general Rescreatu profile guide
Checklist:
- hide the sidebar, headers, chat, ads, icons.
- add a background color and image to your profile
- adjust fonts
- adjust links
- hyperlink with your own text
Part One: hiding things
1. Create a new .txt file on your computer, using Notepad.
2. Type in: <*style type=text/css> (from now on, delete the * in our coding). You are now starting your code area.
So, you hate the current layout- blue and orange, and the regular Rescreatu layout. You want to hide those bits and create your own.
Right below what you have typed, enter the following:
#sidebar1, #sidebar2, #header, #footer, .head,.adbottom {display:none;}
What does this mean? This line of code makes Rescreatu hide, or not display, your navigation, shoutbox, header, footer, icons, and bottom ads. All CSS coding has to be in curly brackets, { and }, to make it work- also before the last bracket, you have to use a semi-colon. Before the first curly bracket will be the sections of what you're going to alter. That's the basic syntax for CSS.
Copy and paste the code into your account profile box, while adding a <*/style> to end the coding. If you do it right, you should see the navigation, header, icons, shoutbox, and ads vanish.
Part Two: Backgrounds
The design looks plain right then and there- why not try adding a background to spice things up just a bit?
Here's how you add a background.
1. Below your first line of coding, add body {position: absolute; background-image: (YOURURLHERE); repeat: repeat-x;} if you want to add an image from a picture uploader, or body{background: #xxxxxx;} to use a hex color.
What does the coding mean?
For an image background, you have to state your background position. There are a few to choose from: absolute, relative, static. This time we'll go with absolute. Background-image speaks for itself; it's where you put in your image code- just plain http:// ones would work. Repeat-x repeats the image horizontally, while Repeat-y repeats your image vertically.
A color background is easy- you enter the six, or three (#fff for white, #000 for black, or any repeated hex colors) and your wanted color appears as your background. If you do want two or three colors, you have to use an image.
Socks are lucky, who says they aren't?
|
10:53pm Mar 17 2010
|
Normal User
Posts: 8
|
taken.
Socks are lucky, who says they aren't?
|
10:53pm Mar 17 2010
|
Normal User
Posts: 8
|
taken.
Socks are lucky, who says they aren't?
|
10:53pm Mar 17 2010
|
Normal User
Posts: 8
|
taken.
Socks are lucky, who says they aren't?
|
10:53pm Mar 17 2010
|
Normal User
Posts: 8
|
taken.
Socks are lucky, who says they aren't?
|
10:53pm Mar 17 2010
|
Normal User
Posts: 8
|
taken.
Socks are lucky, who says they aren't?
|
6:34am Oct 5 2010
|
Normal User
Posts: 829
|
Bumps, this would be good for starters.
ãƒã‚¯ã‚µã‚¹Rokusasu. #13, The Key of Destiny Event Horizon & Magic Hour
|
8:14pm Oct 16 2010
|
Normal User
Posts: 10
|
Allegra, when I tried pasting it onto my profile, it didn't work. Why and what do I do to make it work? HELP!
|
8:33pm Oct 16 2010
|
Normal User
Posts: 1,731
|
They're banned. :c
|
11:16pm Oct 16 2010 (last edited on 11:17pm Oct 16 2010)
|
Normal User
Posts: 853
|
Huh. Necro'd. Well, I can just as well help. What are you copying and pasting, Lazer? This isn't exactly a copy and paste tutorial... well, I guess it could be, but to me it seems like a "show you how to do certain things on Res" tutorial. And though it has some info on how to actually set stuff up... to use this information well it's a good idea to have a bit of knowledge on CSS and HTML first. http://www.w3schools.com/html/ w3schools has some nice tutorials on this.
|
10:10pm Jul 21 2011
|
Normal User
Posts: 1
|
im LOST. i do not know what this tut means at ALL!!!!!!!!! tle="Frown" />
wish
|
11:22am Aug 18 2011
|
Normal User
Posts: 140
|
what does this all mean
DANCE
|
1:31am Nov 6 2011
|
Normal User
Posts: 1,477
|
I don't get it!!!! ="(
|
12:46am Nov 11 2011
|
Normal User
Posts: 1,477
|
Bumpies
|
11:29am Jul 1 2012
|
Normal User
Posts: 2
|
I want to puot HTML codes but i don't know how. I also want to know how to create side bars and backgrounds. Can anyone help me?
|
6:11am Jul 9 2012
|
Normal User
Posts: 1,956
|
Necroposting is against the rules, please don't do it ;c
|
|