[Updated] Profile Designing Guide

[Drizzy]

Quick Links: Profile of The Month • Profile of the Month Rules • NB's F.A.Q • NB's Global Rules

---

INTRODUCTION
This tutorial is an attempt to guide members on how to successfully customize their profile. This tutorial is placed in "step format", progressing step-by-step. Included are pictures/screenshots, notes, and a few tips you might need. Each picture will be in a spoiler/link to prevent the thread from "stretching". This thread is an updated and improved version of the previous tutorial, this applies to vbulletin 4.x.x.


VB.4.2 PROFILE SET UP
Vbulletin 4 has a completely different set up and appearance than the one on vbulletin 3. Messages are displayed to the left, while information on the member, groups [Image], recent visitors [Image], friends [image] etc. are displayed to the left. The Profile has six main sections, General, Modules, Inactive Modules, Buttons, Content and Headers. The Profile Message can also be considered a section, but customization for that area is done in the UserCP. At the moment, NB profiles do not support Mixpod playlists, for Youtube videos to be included, it has to be done in the Profile Message Area.

General: This is where you choose the main background, you can also choose the page link colour and title text colour here (The thing that says how much visitor messages you have)

Modules: These are the small boxes showing the visitor message pages.

Inactive Modules: It's majority of the area to the left of the profile, it also borders the message box. It's also the fill for visitor message pages.

Buttons: The boxes/buttons for "Post" and "Go Advanced" as well as "Customize Profile". All located to the right-most side of the message box.

Content: As the name suggests, this is where the main content is kept. The actual message in a vm is part of the content, as well as a few areas over the inactive module.

Headers: The area which displays the name of the member, date of his/her message as well as the "View Conversation" and "Report" links.



UPLOADING PICTURES
Before actually customizing your Profile, the first thing to do is to source and upload the images. Be sure that the images are of good quality. Such images can be found on deviantART or some other websites with HQ pictures (google them). When you have located your images and downloaded them, visit your profile and look to the left, scroll downwards until you see "Albums" [Image]. If you already know how to upload images to an album, skip this area. In that same area, beside the word album, is a link that says "More", by clicking that, you'll be taken to your album management page. By clicking the button located at the top right, youyou're taken to a page where you fill out a few areas, be sure to set the album type to profile then select "Save Changes". By selecting the profile album type, you can customize your profile, but that album isn't shown to anyone else, protecting your pictures from theft. Once the album is created, a page should appear, click the "Upload Pictures" link to the top right [Image]. A new window will open, select "Add Files" which will open another window from which you will click "Select Files.

From there, select the files located on your PC, click "Upload Files" [Image]. The last thing to do, is to edit the name of the image (if you want), if not, click "Save Changes". There, you now have your album and pictures! Do you need to make any other edits, delete or move pictures, it can all be done right there by selecting "Edit Album" located at the top right. Moving on to the actual customizing now.


CUSTOMIZATION
♜ Click the Customize button located on your profile, right above your insert message box. [Image]
♜ The customization area will come up, the six profile sections mentioned earlier will be shown (General, Modules, Inactive Modules, Buttons, Content and Headers). [Image]
♜ There are several boxes, most with colours in them. By clicking a box, you can make a selection. Some sections allow you to choose either a colour, gradient, or image from your album. [Image]
♜ If the image is too small, feel free to use the repeat option. It multiples the image so it spreads over the area.
♜ For each change you make, a preview will be automatically displayed, use this to make any adjustments necessary.
♜ Save changes when done, be sure to ask around to see what others think. Experiment around until you arrive at a final result you're satisfied with.

CUSTOMIZING TIPS

♜ Use only high quality images.
♜ Be sure that all text is visible.
♜ Do not make the profile too flashy, this isn't very pleasing to the eye.
♜ If you've added a Youtube Video, do not set it to autoplay.
♜ Choose a colour scheme before you start customizing. There are colours that go very well with each other, eg. Red, black, white.
♜ Use textures in some areas, such as the content area (so that text is visible) and module area(s).
♜ Use colors that compliment each other.
♜ Don't use small pictures in large background areas, unless it looks normal if repeated.
♜ Try to work around a specific theme.
♜ Do not use distracting animated images.
♜ Fill all areas for the Profile Sections.
♜ Use smooth textures or abstracts for the Main Background.


PROFILE MESSAGE AREA/INTRO
This is the part of your profile where you can be extremely creative with BBcode markup. To edit the Profile message, you must go to your UserCP then Edit Profile section. Scroll to the bottom where it says "Profile Intro Text", insert whatever you wish there to add the final touch to your profile. You can add images by using the [IMGPROF]Image link here[/IMGPROF] tags. For BBcode to successfully work here, you must remove all quotation marks in the tags, eg. in [Size="5"] [/Size], for that to actually work, the quotation marks around 5 must be deleted. Youtube videos can also be added here, just let your creativity flow. Good Luck!

---

Banner and Tutorial by Drizzeh
Cheers Rei, you did an awesome job with the previous tutorial.

[Délta]

Epic a guide I'm posting so I can find it easily later on

[★Nathan.]

Thanks, Drey.

[King Of Sharingan]

Thanx

[‡Mudo‡]

Awesome guide, many thanks!

[SoulKiller]

Cool guide

[Nocturne]

Good Job, Drizzeh!

One qs. Drizzeh!
Is it a dis-advantage to have some areas into transparent?. According to the contest.

[Ezio..]

Cheers Drizzeh :D

[yahiko24]

thank you

[Sanzen]

I see mine wasn't good enough.
I sent my guide into the staff awhile back. Some time in 2012.
I spent a lot of time on mine and they couldn't even send me vm notifying me that mine wasn't going to be used.
Link to mine here, http://www.narutobase.net/forums/sho...d.php?t=243217
Although it isn't the prettiest thing, it gets the point across and I spent a lot of time on it.

Mine was quite a bit easier to understand and a lot less to read.

[anbu junior]

finally found it

[CrimsonFire]

Thank You! Excellent guide

[Nocturne]

Is it possible for you guys to tell the size of all the areas?

[Skorm]

Is it possible for you guys to tell the size of all the areas?

Sure.

Main Bg; 1003*2000(+). Kinda depends how long your profile is vertically, but 2000 should be enough..
Headers; 625*28(It is wider only on the "about me" & "Awards" section(s).) So then it should be something like 660 instead.
Content; 703*481
Inactive Modules; 800*2000(Could be smaller vertically, don't know. Didn't want to chance and find out it was to small..)

Buttons and Content are unknown to me, but i say they don't need customization and leave them as they are.

[Nocturne]

Sure.

Main Bg; 1003*2000(+). Kinda depends how long your profile is vertically, but 2000 should be enough..
Headers; 625*28(It is wider only on the "about me" section".) So then it should be something like 660 instead.
Content; 703*481
Inactive Modules; 800*2000(Could be smaller vertically, don't know. Didn't want to chance and find out it was to small..)

Buttons and Content are unknown to me, but i say they don't need customization and leave them as they are.

Thanks Alot mate...^^

[Kages]

Mmmkay thanks

[Aki Kimura99]

Epic! Thanks for the guide :D

[★Voltron]

Very nice Drizzy^^ Thanks

[Sasuke56]

Thanks Drizzy