MSN Home  |  My MSN  |  Hotmail
Sign in to Windows Live ID Web Search:   
go to MSNGroups 
Free Forum Hosting
 

Important Announcement Important Announcement
The MSN Groups service will close in February 2009. You can move your group to Multiply, MSN’s partner for online groups. Learn More
Moonlight Serenades[email protected] 
  
What's New
  
  welcome page  
    
  Messages  
  Pictures  
    
    
  Links  
  Shaz's house  
  snaggables  
  computer help  
  jokes and things  
  psp lessons  
  
  
  Tools  
 
Shaz's house : Test
Choose another message board
View All Messages
Prev Discussion  Prev Message  Next Message       
Reply
 Message 6 of 6 in Discussion 
From: MSN NicknameFairygem1  in response to Message 5Sent: 11/2/2008 2:12 AM

Skin Basics……….

Now there is I imagine lots of ways to do this. This is the way I learned and learned by trial and error. I still don't know it all on there but I am trying……

First you need to make your tiles you plan on using. Make them in psp just like you did when you made them on msn. I use about 250 by 250 but use what you are comfortable with. Seamless tile them as well.

Make your banner you wish to use. 550 by 418 is the one I used mainly but you can adjust the size and stuff to your liking once you get used to it.

Also you should make your buttons you plan on using. For like the unread and new topic and etc. I suggest making these in psp and than moving them to animation and saving them that way and than they will be transparent. I made that error and need to fix it lol.

Load the images you are using either to Photobucket or Images in the yuku forum.

Now first thing save these files here Custom Header Notepad here
Advanced CSS Notepad here. Each file is labeled accordingly. Make sure to put them in the correct boxes.

Now on to the fun stuff lol……

First go to Admin>design> Customized Community Skins

Click on Add a Blank Skin

Now look for an untitled skin with today's date and time you made.

Click on the edit HTML

Where it says untitled skin change that to something else I call mine chars blank Template.

In the Custom Header box copy and paste the information from the Custom header notepad

In the Advanced CSS box copy and paste the information from the Advanced CSS notepad

Once you have done that Click Save and there you have your basic format. Save this one as a template that way when you want to make a new one all you have to do is change the colors, backgrounds and etc.

Once you have done this one time you can edit your fonts and etc to your liking on the template and than you won't have to do that anymore unless you want.

Now on to tweaking our settings……

On the bottom of the page when you are in the wysiwyg editor you will notice that there is a preview button. If you click that you can preview any changes you have made before saving it.

That Template we just made Click on the box Copy next to it. Now another template will be made and it will be like mine is Chars template 2.

Click on wysiwyg editor in that row of your 2nd template. Where it says template up top change it to whatever you will be working on. IF it is going to be a Halloween one than title it Halloween template. Nice thing about this is if you want to change the background and banner but the color scheme is correct than you don't have to tweak everything. NOW SAVE.

I say this because I recommend you save a lot. I make one or two changes than I save. This way if I make an error I do not have to go all the back to scratch. So if you get used to it now than you are ahead of yourself.

Now I will go thru each section briefly. If you need more help please get a hold of me. I am everywhere lol.

First area: General

This is the area for your background. I have made an example see below to show you what I am talking about. This is the only example as I believe it's pretty clear.

If you want a color on your very back layer than you would choose Background color. If you want an image than you will choose Background image. Just click on the little image icon at the end of it as in example above, and this will bring up images on site or you can use a URL. I personally prefer onsite because they are right there lol. That is just me though.

Background attachment (Fixed stays still or Scrolled will scroll with you.)

Default font this is the font that will be used on the page there are different areas to edit this as we go along. I use 15px for size you can of course adjust accordingly.

IF YOU EDIT SAVE

Second area: Links

This area sets up the color and style for your links inside the forum. Adjust according to your liking.

IF YOU EDIT SAVE

Third area: Boxes

This area controls all the boxes for the categories, forums, topics, stats, and etc.

You have different options for lines and color and even the text. I edit box headings and box body. There again I am still learning and feeling my way thru it lol. You adjust according to what you like.

IF YOU EDIT SAVE

Fourth area: Category

This controls the category tables on the main page.

IF YOU EDIT SAVE

Fifth area: Forum

This controls the topic listing table inside the forum.

IF YOU EDIT SAVE

Sixth area: Topic

This section controls post tables

IMPORTANT INFO: Table cells-background color changes the color of your post background.

IF YOU EDIT SAVE

Seventh area: Buttons and dropdowns

This controls all the button style and lines on the buttons for new topic and etc.

IF YOU EDIT SAVE

Eighth area: Pager

Controls pager found inside forum. I personally have not played a lot with this one.

IF YOU EDIT SAVE

Ninth area: Features

This controls certain features on the forum adjust to your liking.

IF YOU EDIT SAVE

Tenth area: CSS

This is where you will add extra custom CSS info. Some scripts you decide to use will go in this area.

IF YOU EDIT SAVE

Eleventh area: HTML area

This is where you will adjust custom headers and footers. This is also where some of the scripts you may decide to use will go.

Your banner you want to use goes here. Banners have to go in photobucket to my knowledge at this point. You copy the direct link http addy from photobucket. In the html area you will see I have put a spot that says Put HTTP link here. Just put your link in between "".

IF YOU EDIT SAVE

In order to add your icons that you have made after saving click on images in that same row of the one you been working on. Inside there you use the little image insert link to put your icons in the ones you want.

I hope this was understandable and if you need any help please ask.


Ok i am totally lost i am trying to make up a general page with a tag that was made for my group have it centered and make it look nice but alas it wasnt working
so i am wondering which part we put our tag in?
 
HTML area

This is where you will adjust custom headers and footers. This is also where some of the scripts you may decide to use will go.

Your banner you want to use goes here. Banners have to go in photobucket to my knowledge at this point. You copy the direct link http addy from photobucket. In the html area you will see I have put a spot that says Put HTTP link here. Just put your link in between "".