Abeer Multi Advanced Style

Demo:
For a vBulletin 3.7 demo please click here.

Description:
I have already released a vBulletin style on our old website that had the name of Abeer Style and here the skin comes back again with a different layout and different look and more advanced features. These features includes all the navigation system is included in the very top of the header with drop down menus. Also I have used a lot of CSS to customize the backgrounds, gradients and font styles.

Also we called this skin "Multi Advanced" because this skin can be used with any forum subject as the computer image at the top of the header can be changed to any other image that suits your forums.

Skin Information:
Skin Name: Abeer Multi Advanced Style ( vBulletin Abeer Multi Advanced Skin )
Skin Width: 940 px (Fixed Width)
Skin Compatibility: vBulletin 3.7.0 (or what is called vBulletin 3.7 Gold Release )
Templates Change level: Maximum (Lot of templates and objects classes changed)
Design Source File: Photoshop (PSD)

Skin Log:
- July 06 2008: Skin updated to vBulletin 3.7.2 and security token issue fixed.

PSD Files:
The header and the buttons PSD files are included.

Downloading PSD Files, Empty Logo Image:
To download the empty logo image and the PSD files and the empty header image (to replace the computer image), please download them here or at:
Source Files

Changing Logo & Computer Image:
1- To change the logo:
- Download the Source Files and extract them
- Open the folder named "empty-logo" and edit the gif file using any photo editor or graphics program.
- Save the file with the same name (don't change the file name or it will not work).
- Upload the file to YourForumRoot/images/VA_Abeer and over write the existing file.

2- To change the computer image:
- Download the Source Files and extract them
- Open the folder named "empty-header-image" and edit the gif file using any photo editor or graphics program.
- Save the file with the same name (don't change the file name or it will not work).
- Upload the file to YourForumRoot/images/VA_Abeer and over write the existing file.

3- To remove the computer image and leave the area empty:
- Download the Source Files and extract them
- Open the folder named "empty-header-image".
- Upload the file to YourForumRoot/images/VA_Abeer and over write the existing file.

Adding link to the "quick links" drop down menu in the top navigation bar:
1- Open your navbar template (Navigation / Breadcrumb Templates --> Navbar)
2- Find:

<if condition="$vboptions['enablesearches']"><tr><td class="vbmenu_option"><a href="search.php?$session[sessionurl]do=getdaily">$vbphrase[todays_posts]</a></td></tr>

3- Above the code place your link using the following format:

<tr><td class="vbmenu_option"><a href="Your Desired Link URL">Your Desired Link Text</a></td></tr>

4- Save and that's it.

Using the skin with vbAdvanced or blogs systems:
If you are using vbAdvanced or other major addons under the same folder of your forum, then the skin will work just fine but if you are having your vbadvanced index page outside your forum root then you will have to copy the folder name VA_Abeer under your website root images folder so it will look like that:

www.YourWebsite.com/images/VA_Abeer

If your blogs have a separate folder, then you should copy the folder named VA_Abeer under the images folder inside your blogs folder so it will look like that:

www.YourWebsite.com/YourBlogsFolder/images/VA_Abeer

[egtrix]

Originally Posted by macc

Thanks for reply!

can you help me - show one exempel to add link in quick links in navybar and please for shoutbox!

regards

macc

macc I've added the code for adding new links to the main post, please have a look at it

Originally Posted by nene94

nice look, thanks

Thank you nene94 glad that you like it

Originally Posted by Vtec44

Nice work! I changed it a bit and installed in here.

Good work Vtec44, nice to see it in action

Originally Posted by simonhind

its a good template, but it wont work with highend mods

Thank you simonhind but can you please let me know which mods that won't work with or which highend mods do you mean?

[Newfarm]

Awesome style you've made here.

Haven't really decided if it's something that'll fit my forum or not yet and it'll require a certain bit of customization and that brings me to my question.

I would need to change some of the button names (and functions for that matter) which is no real problem. However, there's the fancy looking "reflection" layer (button copy 5). Is there any way you could share some photoshop secrets in how to reproduce that one as it looks to be made either outside this psd or "simply" transformed to get it's look..

Either way, a very, very nice skin you've made .

[michaelcrook]

This is an awesome theme. I just have one small issue. I can't find where the navbar stuff usually is; the links to "calendar" and such..I like to remove those. I looked in "navbar", but can't seem to find them?

[slmoney]

they are in the HEADER template

[michaelcrook]

slmoney: Yes, I found it a little bit ago, thanks

I also spotted a spelling error in one of the buttons: "Invisable" is misspelled.

[egtrix]

Originally Posted by Newfarm

Awesome style you've made here.

Haven't really decided if it's something that'll fit my forum or not yet and it'll require a certain bit of customization and that brings me to my question.

I would need to change some of the button names (and functions for that matter) which is no real problem. However, there's the fancy looking "reflection" layer (button copy 5). Is there any way you could share some photoshop secrets in how to reproduce that one as it looks to be made either outside this psd or "simply" transformed to get it's look..

Either way, a very, very nice skin you've made .

Thank you Newfarm for your reply and really glad that you like Abeer Style
As for the buttons bar reflection, it's not a big secret and it's very easy to do, here is how you do it:
1- After changing the buttons text in the PSD file, copy the buttons bar with the buttons and the text layers and paste them under the original buttons bar.
2- Flatten all the pasted layers together so they will be one layer.
3- Then skew that layer so that the bottom part of the flattened button bar looks a bit larger than it's top line.
4- Then lower the opacity of this layer to 14%
and that's it

Originally Posted by slmoney

they are in the HEADER template

Thanks for helping while I wasn't here slmoney

[buguoeryi]

Good

[egtrix]

Thank you

[Newfarm]

Thank you so much egtrix .

[steve1966]

Very nice thank you