 |
|
|
Mod Options |
[CM] Floating Sidebar (Custom + Shine Effect) Details »
|
|||||||||||||||||||||||||||||||
|
[CM] Floating Sidebar (Custom + Shine Effect)
Developer Last Online: Jul 2019 
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! ::::::::::::::::::::::::::::::::::::::::::::: NEW UPDATE: 11 August 2012 Get this mod for vBulletin 3.x. CLICK HERE! Hey everyone, This is a great SideBar that I have used while I as using MYBB Board, I have used lots of time to turn this to a vBulletin mod A great mod for you to decide where you want your users to visit, and can be fully customized by yourself! ------------------------------------------ Credits: Yaldaram.com as Support & Co-Author ------------------------------------------ ------------------------------------------ Transparent background added! (Black)Shine Effect by Hovering (With Drop Shadow / Gradient Shine) 7 new Codes added in the Background.txt (With and Without Gradient Effect with 7 Different Colors, All codes are ready to COPY & PAST! There are 2 Different Tutorials and 2 differen styles A good advice will be "not to just JUMP in it", but look at both of the Tutorials, and If were YOU, I would def go for Tutorial 2 because it has the Shine and Gradient effect. Tutorial 1: Image "Drop Shadow & Gradient effect! Example Image (Shines when hover)  Tutorial 2 NO "Drop Shadow & NO Gradient effect! Example Image  Also Other Colors Available: (Purple)   (Red)  Tutorial 1 (With Shadow & Shine Effect) Step 1: Go to your AdminCP, Click on Styles and Templates, then Style Manager, and on your right side in the dropdown sidebar, you choose Edit Templates! Now you are in the Templates area! You can either add the following code in your "footer" or your "header" template! But start with your header. Click and open your header template, and add the following code below everything else! Code to add in "header" template:
Click SAVE! Dont forget to download the SideBar.zip from the attachments. And upload the images folder to your root! The path should be --> YOURFORUM/images/sidebar We are now done, with Tutorial 1: ====================================== Notice, the next tutorial has NO shine and NO gradient effect: Lets Start with Tutorial 2: (Without Shadow & Shining Effect) Step 1: Go to your AdminCP, Click on Styles and Templates, then Style Manager, and on your right side in the dropdown sidebar, you choose Edit Templates! Now you are in the Templates area! You can either add the following code in your "footer" or your "header" template! But start with your header. Click and open your header template, and add the following code below everything else! Code to Add in "header" Template:
Click save, and lets go to the last step. Step 2: Unzip the SideBar.zip file which is below in the Attachments with the Icons inside! And simply upload the "image" folder to your root! The path should be --> YOURFORUM/images/sidebar We are DONE, And your SideBar should be ready! I prefer you use Tutorial 1! Plz. Click Installed, if you use like or use this mod! Its for later support! Extra Notice: There are 14 icons inside the file! We only use 7 for the sidebar, The others are Extra! Make sure to Download the new ones! These fits perfectly for the Gradient & Drop Shadow! :::::::::::: DONE ::::::::::::: Extra Optional Options If you wanna change the "Shine Effect Color", Change the line I have marked in red, like the one below, and only change the blue diggit numbers. Go to this site to choose your rgb color: http://www.tayloredmktg.com/rgb/ Code to Change:
Change only the numbers in "BLUE COLOR". Which is in RGB COLOR CODE!! For more, Check the Tutorial below for the RGB colors! :::::::::::::::: >>>> Optional Info & Color Options <<<< :::::::::::::::: NEW UPDATE: 09 - 08 - 2012 I have added extra Background codes inside a txt file. Now a new code for TRANSPARENT background added inside the file "Background.txt"! And there are codes ready for 7 different Backgrouds, Like the image below! With and Without Shining effect! All in the Background.txt. Download the file and open it with a NOTEPAD or TEXT EDITOR, and get copy the code from there! SideBars from Background.txt Example:  Choice of a Custom URL Path and Image If you decided to change the code and Icons and make your own icons, then let me show you how to change the code! Below you will see what every COLOR stands for! Blue Color = URL to the Exact Page Red Color = Icon Path and Name Green = Title when you HOVER over the icon Short Code Example: <a href="FULL URL" title="GIVE A TITILE"><img src="ICON PATH"></a></li> Full code:
Custom Choice of Color (4 LINES with the word Background)
Only change the RED code at the end --> (0,0,0) These 3 --> (0,0,0) stands for BLACK (The RGB NR and COLORCODE!) You can use this color Generator: http://www.colorschemer.com/online.html Here are some Extra RGB Colors Ready: Black (0,0,0) White (255,255,255) Dark Blue (255,25,255) Orange (255,102,51) Dark Green (26,51,0) Green (0,204,0) Red (255,0,0) Aqua (0.255.255) Light Blue (51,153,255) Purple (153,0,153) Download Now Only licensed members can download files, Click Here for more information. Show Your Support
No members have liked this post.
|
|||||||||||||||||||||||||||||||
About Developer
Not Supported 
Template Edits| Comments |
|
#2
07 Aug 2012, 07:28
|
||||
|
||||
|
Nice one mate May be just what we wanted for our members
No members have liked this post.
|
|
#3
07 Aug 2012, 13:07
|
|||
|
|||
|
Very nice.
Method 1 worked like a charm for me. Only thing you need to pay attention to: When following the standard instructions and uploading the "menu" folder to your image folder the path to the images in your installation instructions doesn't match up. You are linking to "images/test/". You need to remove "/test" No members have liked this post.
|
|
#4
07 Aug 2012, 14:35
|
|||
|
|||
|
Demo, please?
No members have liked this post.
|
|
#5
07 Aug 2012, 16:26
|
|||
|
|||
|
Thank you so much guys, I am very happy for you guys made it work!
Qpurser: Thank you for noticing, I have now changed it to "images/sidebar"! I was using the test folder in my forum! Thank u sir! Doraj: Demo HERE
__________________
I am having a little break from vB Developing. I am trying to finish my PHP and MYSQL courses for now. I will answer all my PM's if anyone needed help for my products, but only when I can be online on vB.org. Its great to see new and old developers keeping vB.org alive! Thank you all for your support!CM
No members have liked this post.
Last edited by ChiNa; 07 Aug 2012 at 17:04.
|
|
#6
07 Aug 2012, 16:34
|
|||
|
|||
|
working great!! thank you!!
there is a small error in the "header" code teh name of the image foldor that you bring in menu in your code you neme it test.. No members have liked this post.
|
|
#7
07 Aug 2012, 16:39
|
|||
|
|||
|
Yoda, I have fixed it now! Thank you for noticing !
__________________
I am having a little break from vB Developing. I am trying to finish my PHP and MYSQL courses for now. I will answer all my PM's if anyone needed help for my products, but only when I can be online on vB.org. Its great to see new and old developers keeping vB.org alive! Thank you all for your support!CM
No members have liked this post.
|
|
#8
07 Aug 2012, 16:57
|
||||
|
||||
|
haha thats crazy ive been looking for one of these for months, then i finally made my own and you come out with one 2 days later lol
nice work 
No members have liked this post.
|
|
#9
07 Aug 2012, 17:01
|
||||
|
||||
|
Originally Posted by ChiNa-Man
Your demo link will not open
__________________
No members have liked this post.
|
|
#10
07 Aug 2012, 17:05
|
|||
|
|||
|
__________________
I am having a little break from vB Developing. I am trying to finish my PHP and MYSQL courses for now. I will answer all my PM's if anyone needed help for my products, but only when I can be online on vB.org. Its great to see new and old developers keeping vB.org alive! Thank you all for your support!CM
No members have liked this post.
|
|
#11
09 Aug 2012, 19:45
|
||||
|
||||
|
Like the mod but decided the images were a little too small so I went with some different ones with less background but the same overall size (28x28). To me it looks a little better this way.
 If anyone wants the alternative images you can download them from here: Sidebar Alternative Images The following members like this post: ChiNa
|
|
#12
09 Aug 2012, 23:05
|
|||
|
|||
|
Nice Job, Thanks for the comment, and for your to contribution!
__________________
I am having a little break from vB Developing. I am trying to finish my PHP and MYSQL courses for now. I will answer all my PM's if anyone needed help for my products, but only when I can be online on vB.org. Its great to see new and old developers keeping vB.org alive! Thank you all for your support!CM
No members have liked this post.
|
|
#13
10 Aug 2012, 11:39
|
|||
|
|||
|
Amazing. Thanks a lot for this! Is there a way to add a hover to the buttons?
No members have liked this post.
|
|
#14
10 Aug 2012, 17:36
|
|||
|
|||
|
Ti6, can you please make it clear what you mean with "a hover to the button"?
Bcoz right now there is a hover added already..
__________________
I am having a little break from vB Developing. I am trying to finish my PHP and MYSQL courses for now. I will answer all my PM's if anyone needed help for my products, but only when I can be online on vB.org. Its great to see new and old developers keeping vB.org alive! Thank you all for your support!CM
No members have liked this post.
|
|
#15
10 Aug 2012, 23:52
|
||||
|
||||
|
Ups
Excuse my short answer.
 Hover effect: Social media icons getting highlighted on mouseover.Ill tryed something like
but it didnt work out. Can you help me? No members have liked this post.
|
||||
|
«
Previous Mod
|
Next Mod
»
| Currently Active Users Viewing This Thread: 1 (0 members and 1 guests) | |
| Mod Options | |
|
|
| New To Site? | Need Help? |
All times are GMT. The time now is 09:35.