Ooo

Ok so here we go we will start of pretty simple here just so you can get your bearings wiith the program and the elements involved in making a bebo skin.  Remember now to download your Adobe Photoshop for best results.


1.  Do a google search for something that you want to make a skin of.  For this example I did a search for simpsons and found this picture that I am going to use.





















2. Open up Adobe Photoshop or whatever program you are using and click File: New.



















3. A new box should pop up showing the following you want to change the sizes so that they will fit your bebo profile so set it up exactly as shown and click OK.

















4.  Ok so now a white background will appear.  This is going to be your main part of your bebo skin.

















5.  Now open your downloaded image that you want to appear on your profile (mine was the simpsons picture).  Now as you can see my simpsons picture is in front of the white background.  You now want to click the Move-Tool in your toolbox and click on your picture and drag it onto the white background. 

You can find the move tool by looking at my screen the toolbox is the rectangle in the bottom left hand corner going vertically up the screen.  The Move-Tool icon is the 2nd icon across from the top of the toolbox which looks like a little triangle and a sml star type icon like this
.  Once you move your picture across you will then need to click back onto the Move-Tool to place your image on the page. 

A box will appear saying Apply Transformation click OK.




















6.  Now if you move your picture across to the white background and find that it doesnt fit you just need to click (Ctrl and T) at same time to select your picture then you can resize it how you like.  Postion your picture anywere on the page that you are happy with and you should have something like mine.



















7. Ok I am happy enough with that now I want to add some text.  Click on the text button in your toolbox and just click onto the screen were you want to write your text and type whatever you want.  If you want to change the positioning of where your text is dont worry, when you are done typing just click the Move-Tool and then click and hold on your written text and drag to wherever you want to put your text.

Once you are 100% happy with the positioning of the picture and the text go the the menu at the top of the program you are using and click on Layer then Flatten Image.




































8. Ok we are all done with that now we just need to save it.  To save go to File, Save for Web, this way you can set the size so that Bebo allows it.  Always save your main picture as main_bg and make sure it has a size no more than 40kb otherwise bebo wont allow it.  You can do this by making sure that the drop down menu just below were it says settings says jpeg if its not selected just select then at the right hand side there is a box that says Quality with a small arrow that allows you to drag the quality down, do this bit by bit while looking at the bottom left hand corner were you can see the current size that it is and keep reducing the quality until this size is below 40kb then click Save and remember to save it as main_bg.

















9.  Now do exactly as before but this time go to File, New, and set the sizes to Width 760 x Height 40 and click ok. Now you can put whatever kind of image you want here like before but bare in mind that the writing of bebos links will be running across from the left hand side whenever you upload your final skin to bebo so if you are positioning a picture try and get it over to the right hand side of your bebo profile.  Once you are happy with either positing of text of positioning or your picture do just exactly the same as before when saving it and click onto File, Save for Web but this time make sure the size is less than 20kb and Save this image as nav_bg.  Here is my nav_bg image.






10. Next again go to File, New, and set the sizes to Width 11 x Height 15 and click ok.  This image will be going just below your big main_bg so I usually put either solid colours or just plain lines.  Do exactly the same as before clicking onto File, Save for Web but this time make sure the size is less than 1kb and Save this image as main_footer.  Here is my main_footer image.





11. Next go to File, New, and set the sizes to Width 20 x Height 20 and click ok.  This image will be going at the left hand side of your bebo profile as an icon basically where it says change skins, update profile etc the little picture to the left is what this icon your creating is.  Do exactly the same as before clicking onto File, Save for Web but this time make sure the size is less than 1kb and Save this image as main_icon.  Here is my main_icon image.





12. Next go to File, New, and set the sizes to Width 32 x Height 3 and click ok.  This image will be going at the end of each comment that a person makes kind of like an underline so this can be pretty basic.  Do exactly the same as before clicking onto File, Save for Web but this time make sure the size is less than 1kb and Save this image as module_line.  Here is my module_header image.





13. Next go to File, New, and set the sizes to Width 375 x Height 44 and click ok.  This image will be going at the top of the widget box, comments box, polls box etc.  Do exactly the same as before clicking onto File, Save for Web but this time make sure the size is less than 10kb and Save this image as module_header.  Here is my module_header image.





14. Last of all we just need to create one more part and then are skin is ready for uploading.  Go to File, New, and set the sizes to Width 375 x Height 50 and click ok.  This image will be going at the bottom of the widget box, comments box, polls box etc.  Do exactly the same as before clicking onto File, Save for Web but this time make sure the size is less than 10kb and Save this image as module_bg.  Here is my module_bg image.




Ok now that we have all of our pieces ready we now need to get them uploaded onto bebo to do this follow these steps.

1. Log into bebo and on your profile page you will see just below your profile photo a link that says Change skins, click it.

2. At the top of the next page you will see Search, Recommended or Roll Your Own click onto roll your own.

3. Now you will see a new page click onto Option 3 - Add New Skin

4. Give it any skin name you want mine will just be called The Simpsons, below that it says tags this just means words to describe your skin like for mine I could just put homer, bart, simpsons anything really realating to what your skin is about then click Save.

5. Another new menu will appear you now want to click on Upload Graphics, then click Browse and look for your graphics you will have to upload them in order but dont worry it tells you at the left hand side which to upload and in what order.

6. Once you have them all loaded up click on Upload.

7. Thats that done nearly there just click on back to my skins and you will see a piece of your skin you now need to click on option 3 Edit Stylesheet.
8. Now read through and make any changes you wish for example where it says Pick you can choose different colours for your background that will be below your new profile and colour of comment boxes etc.

9. Change the Main Section, Padding Top to 400 and when you are done click on Save.

10. Now check that you are happy with your skin by clicking now on preview, if theres any mistakes or any colours you want to change just go back to Edit Stylesheet and use the Pick option and change the colours.

11. When you are happy click onto Use this Skin, it will bring you to a new page, you can either choose to only allow yourself to use this skin or let other people use it by clicking either 2 or 3. I would usually click onto 2 because not all skins are accepted with option 3 so best bet is to use option to.



To see the end result of my basic skin Click Here to Try It On