|[CM] PopUp LoginBox (LightBox Effect + Shadow) Details »»|
[CM] PopUp LoginBox (LightBox Effect + Shadow)
Developer Last Online: May 2013
This was brought to you by ChiNa-Man
First of all I am a free soul, So if one of you guys decided to post this on another forum or a website, I would be appreciated if you give some CREDITs to the Developer simply typing his name: Credits to: ChiNa-Man, and do not CHANGE or DELETE the ORIGINAL CONTENT! Thank you!
Updated to Version 1.01(13 August 2012)
Believe it or not, Only 1 Template Edit! (Only Copy and Past) DONE!
Now only visible for Guests, Non Logged in & Non Registered Users
From Normal Fonts
To Bold Fonts
A simple changes means a lot for someone who cares about the look!
ABOUT THE PRODUCT
This is maybe one of the best mods I ever made so far in my opinion, and the hardest to be honest! I think is one of a kind to Install! You can get this mod with 2 different Looks! 1 With normal Buttons like the ones provided by the browser! Every browser have their own kind of Buttons and models. -----------------------------------------
The First Tutorial will be the a normal browser button style!
The other look is Custom, we choose what color we want for out buttons,WITH HOVER EFFECT & GRADIENT! If you want to make your own buttons, then simply go to this page: http://www.cssbuttongenerator.com and generate your own style! You will see the full tutorial at the end of this post!
Example: Of normal Text & Normal Browser Buttons
Example: Of Custom Buttons
First Up Images with Different Top
Sorry, about the text on the Buttons are in danish Language, for SUBMIT But I have changed it to "Login"! So you will see "Login" instead of "Submit"
Good thing about using this on vBulletin 3.8 is that it chooses the default THEAD images for the LOGINBOX TOP!
Custom Black / Dark Default LoginBox (Custom Box)
LoginBox like vB 4.x Look (Custom Box)
Custom Pink / Red Top (Custom Box)
Custom Orange Top (Custom Box)
Custom Light Blue Top (Custom Box)
Example of the Buttons:
Normal Browser Button
Orange Buttons (Custom)
Black Buttons (Custom)
Light Blue Buttons (Custom)
Red Button (Custom)
We start with the (Normal Buttons) for our LOGINBOX
With normal buttons (Browser Buttons)
Step 1: First got to your ADMINCP, and then Styles & Templates! Now you should see your template name, on right side of the name of your template there is a dropdown menu! In the dropdown menu choose Edit Templates!
And now look for the header template or where you want the Login & Register button to appear!
Use either Header or Navbar template. But in this case open your Header template, and scroll all the way down, and add the following code at the bottom of the header:
Add the Code Below In Your Header:
Click Save and we are Done, vBulletin is using your own "Thead" Image for the LoginBox TOP. But if you wanted to change to top, then go to the attachments below, and download the Extras.zip file, And inside it there is folder named "images"! Find the "top.gif" and upload it to your "images folder" ! Done!
Now Tutorial 1 with normal Buttons Finished!Remember that the buttons are normal, and depends on which browser you use!
Follow up the Custom Button Tutorial 2 Below
With Custom Buttons
In tutorial 2 you do all same steps over again, and again back in your header template, add the code below! After the code is added, please read my instructions below the code, which is very important if you want to change the color and etc...
Now add the code below in the header: (Below everything else)
Code To Add In header:
Click Save, and your done !!!!Dont forget to upload the background image for the TOP, called "top.gif" to your images folder! All the extra images are in the Extras.zip file, Download it from the Attachments! Inside the file there is a folder called "images", simply upload the "top.gif" to your "images" folder!
Your Top Image is set to "top.gif" as default!
If you wanted to change your TOP, then replace the "top.gif" with one of the images in the "Extras.zip" images folder! top1.gif, top2.gif, top3.gif, top4.gif and many others!
Default LoginBox with "top.gif"
Simply decide which image (top1.gif, top2.gif, top3.gif, top4.gif) that you wanna use for the top of your loginbox. Lets say you wanna use a RED colored top, and the images is called "top8.gif"! Then Make sure to rename it to "top.gif", And then upload it!
How to change the Button Color & Gradient?
I have generated the buttons from --> http://www.cssbuttongenerator.com/
Short Video Tutorial --> http://www.youtube.com/watch?v=_YxjCsZV_w0
You will find a txt file inside the Extras.zip, called "Extra CSS Colors.txt" with 10 Different CSS colors for your Buttons! All what you have to do is to COPY the CODES from the Extra CSS Colors.txt and ONLY replace the codes THAT I HAVE MARKED WITH "RED COLOR"!
WE ARE OFFICIALY DONE, Please click INSTALLED if you like this, and if you later eeded support, I will for sure be there!
Only licensed members can download files, Click Here for more information.
The following members like this post: Scanu
|[CM] PopUp LoginBox (LightBox Effect + Shadow)||ChiNa-Man||vBulletin 4.x Template Modifications||10||19 Apr 2013 12:01|
NEW UPDATE to version 1.01
If anyone got the old code, please change codes and replace it with the new!
I had forgot to put the "ONLY GUEST ALLOW" option! So its only visible for guests!
And if you have problems not finding the buttons, then it might be because you are logged in as a member!
You need to be logged off and as a guest to see the LOGINBOX Login and Register Buttons!
Demo HERE << This demo will be shut down soon, because its a TEST vBulletin Site
Happy New Year (Notice): My school just started and I will find it hard to be online for the next 2 seasons in 2013 and to give support for my products. But meanwhile I will answer all PM's if anything. This could be the best & last option for me! Thank you all for your support! Regards CM
No members have liked this post.
Last edited by ChiNa-Man : 12 Aug 2012 at 18:51.
|Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)|
|New To Site?||Need Help?|
All times are GMT. The time now is 11:20.