SMF For Free Support Forum
Signup For Free Forum
March 21, 2010, 10:27:48 pm
Welcome,
Guest
. Please
login
or
register
.
Did you miss your
activation email?
1 Hour
1 Day
1 Week
1 Month
Forever
Login with username, password and session length
News
: Welcome to SMF For Free. The best free SMF Host
Home
Help
Search
Arcade
Gallery
Login
Register
SMF For Free Support Forum
>
SMF For Free Support
>
SMF For Free Codes and Support
(Moderator:
Agent Moose
) >
[Code] Sidebar!
Pages: [
1
]
2
3
4
...
8
« previous
next »
Print
Author
Topic: [Code] Sidebar! (Read 25121 times)
0 Members and 1 Guest are viewing this topic.
Roswenth
SMF For Free Newbie
Offline
Posts: 16
[Code] Sidebar!
«
on:
April 10, 2007, 09:46:11 am »
In my failed efforts to make an announcement box, I finally tried one of my sidebars that I made for InvisionFree boards. It worked almost perfectly. I did some tweaking, and it works great. I totally didn't expect the sidebar to work better than the announcement box, but it does. You are free to change all the information in the boxes, I just made some common to many sites. Please keep the copyright intact.
Preview:
http://i127.photobucket.com/albums/p133/lts19/smfsidebar.jpg
Warning:
There is some coding knowledge required with this, and I don't have the time to support it fully, so use at your own risk.
Where to put it:
Just drop it into the headers. The width is static, because it's hard to work with fluid widths on a sidebar. The first width is set to 150 and the second where the forum sits should be fluid (I hope). You can play with that if you would like, but do know people start complaining if it gets any wider.
How to fix it for your site:
I've tried to make the sidebar as self-explanatory as possible. Replace all of the links with the address of your own site. The post numbers will not be the same, so you will have to go look up each post and each staff members' unique address. You can change any section into something else if you have the creativity and some coding know-how.
This goes at the bottom of your CSS. It will not work on a default skin (you can't edit the CSS). You can change the colors to match your skin.
Code:
.tablepad { background-color:#FFFFFF; padding:6px; border:1px solid #000000; }
This drops into your header (Admin CP->Manage Styles->Edit Headers and Footers):
Code:
<table align=center valign=top>
<tr> <td width=150 valign=top>
<div class='maintitle'>Welcome!</div><div class="tablepad" border='1'><span class='desc'><center>
<br>
<center><b><font size="2" color=#B22222>Information about the Site</font></b><br>
Just put some information about your site and current events here.
<center> <font size="2"><b><BR><BR><a href="http://z8.invisionfree.com/YourSite/index.php?showtopic=8&view=getnewpost">We are looking for staff!</a></font></b><br><br></center>
</span></div></div>
<center><div class='maintitle'>Mandatory Reads</div>
<div class="tablepad"><span class='desc' ><font size="2">
<a href="http://z8.invisionfree.com/YourSite/index.php?showtopic=3&st=0">Rules and Guidelines</a><br>
<a href="http://z8.invisionfree.com/YourSite/index.php?showtopic=4&view=getnewpost">Plot Information</a></font><br><br>
</span></div></div>
<center>
<div class="maintitle">C-Box </div>
<div class="tablepad"><span class='desc' >
<!-- BEGIN CBOX - http://www.cbox.ws -->
<!-- END CBOX -->
<br><br>
</span></div></div>
<center>
<div class="maintitle">Staff </div>
<div class="tablepad"><span class='desc' ></b>
You may contact the staff through the private message link in their profiles.<br><br>
<b><u>Admins</b> </u><br>
<a href="http://z8.invisionfree.com/YourSite/index.php?showuser=1"><b>Admin 1</b></a><br>
<a href="http://z8.invisionfree.com/YourSite/index.php?showuser=2"><b>Admin 2 </b></a><br>
</b>
<br><br><u><b>Moderators</u><br>
<a href="http://z8.invisionfree.com/YourSite/index.php?showuser=5"><b>Mod 1</b></a> <br>
<a href="http://z8.invisionfree.com/YourSite/index.php?showuser=9"><b>Mod 2</b></a> <br>
</span></div></div>
</center>
<div class='maintitle'>Advertise Us! </div>
<div class="tablepad"><span class='desc'>
<img src="88x31banner.jpg">
<br>
<br><b><u>Listed At</b></u></b>
<marquee scrolldelay="151"><BR>
<a href="http://www.technochicks.org/forum" target="_blank"><img src="http://i113.photobucket.com/albums/n212/technochicks/technochicks_88px-33px_117.jpg" alt="TechnoChicks"></a>
</marquee><br>
<div class='maintitle'>Credits </div>
<div class="tablepad"><span class='desc'>
Skin ©
<br><br>
Side-bar © <a href="http://iql.ancientmagicrpg.com/">Roswenth</a>
</span></div></div>
<br /></center>
</td>
<td height="100%" valign=top>
«
Last Edit: August 27, 2007, 09:07:55 pm by simply sibyl
»
Logged
Roswenth
SMF For Free Newbie
Offline
Posts: 16
Re: Sidebar!
«
Reply #1 on:
April 10, 2007, 11:27:02 am »
And here's a teeny version. Still just goes straight into the header. Adjust the colors to suit your skin.
Preview:
http://i127.photobucket.com/albums/p133/lts19/smfsb2.jpg
Code:
<table align=center valign=top>
<tr> <td width="150" valign=top><small>
<center><div class='titlebg2'>Welcome!</div>
<div class="tablepad" border='1'><span class='desc'><center>
<br>
<center>
Put a welcome note here.
<center> <font size="1"><b><BR><BR><br><br></center>
</span></div></div>
<center><div class='titlebg2'>Mandatory Reads</div>
<div class="tablepad"><span class='desc' ><font size="1">
<a href="http://z8.invisionfree.com/YourSite/index.php?showtopic=3&st=0">Rules and Guidelines</a><br>
</font><br><br>
</span></div></div>
<center>
<div class="titlebg2">C-Box </div>
<div class="tablepad"><span class='desc' >
<!-- BEGIN CBOX - http://www.cbox.ws -->
<!-- END CBOX -->
<br><br>
</span></div></div>
</center>
<div class='titlebg2'>Advertise Us! </div></b>
<div class="tablepad"><span class='desc'>
<img src="88x31banner.jpg">
<br>
<br><b><u>Listed At</b></u></b>
<marquee scrolldelay="151"><BR>
<a href="http://www.technochicks.org/forum" target="_blank"><img src="http://i113.photobucket.com/albums/n212/technochicks/technochicks_88px-33px_117.jpg" alt="TechnoChicks"></a>
</marquee><br>
</span></div></div>
<div class='titlebg2'>Credits </div>
<div class="tablepad"><span class='desc'>
Skin ©
<br>
Side-bar © <a href="http://iql.ancientmagicrpg.com/">Roswenth</a>
</span></div></div></small>
<br /></center>
</td>
<td height="100%" valign=top>
«
Last Edit: April 10, 2007, 11:32:03 am by Roswenth
»
Logged
Crystalman
SMF For Free Full Member
Offline
Posts: 152
Crystalman.EXE
Re: Sidebar!
«
Reply #2 on:
April 10, 2007, 11:40:11 pm »
Does it work on Server 1?
If not... is there a way it CAN work on Server 1?
I'd upgrade, but Server 1 has more options and customization as far as I see. I'm waiting until Server 2 forums have as much image/style/layout customizations.
I spent hours customizing the layout on my forum perfectly. Click the banner-thingy in my signature to see it.
«
Last Edit: April 10, 2007, 11:42:22 pm by Crystalman
»
Logged
Buster Cannon Forums, and BCF-Comics.
Crasy
Global Moderator
Offline
Posts: 3931
Semi-Retired ;)
Re: Sidebar!
«
Reply #3 on:
April 11, 2007, 02:14:33 pm »
Quote from: Crystalman on April 10, 2007, 11:40:11 pm
Does it work on Server 1?
If not... is there a way it CAN work on Server 1?
I'd upgrade, but Server 1 has more options and customization as far as I see. I'm waiting until Server 2 forums have as much image/style/layout customizations.
I spent hours customizing the layout on my forum perfectly. Click the banner-thingy in my signature to see it.
I do think it works on Server 1
http://testcrasyandconfused.smfforfree.com/index.php
(Phew, it's been a while since I used my server 1 forum)
It just needs some tweaking.
Logged
Did my answer help you? Want to help out hosting costs?
Every donation counts.
Kimmie
SMF For Free Master
Offline
Posts: 2010
Re: Sidebar!
«
Reply #4 on:
April 11, 2007, 03:06:27 pm »
Quote from: crasyandconfused on April 11, 2007, 02:14:33 pm
Quote from: Crystalman on April 10, 2007, 11:40:11 pm
Does it work on Server 1?
If not... is there a way it CAN work on Server 1?
I'd upgrade, but Server 1 has more options and customization as far as I see. I'm waiting until Server 2 forums have as much image/style/layout customizations.
I spent hours customizing the layout on my forum perfectly. Click the banner-thingy in my signature to see it.
I do think it works on Server 1
http://testcrasyandconfused.smfforfree.com/index.php
(Phew, it's been a while since I used my server 1 forum)
It just needs some tweaking.
I have played around with it a little The cbox area needs some tweaking - it doesnt work right for some reason. When I installed my cbox, you couldnt post in it
. The only other downfall I see to the sidebar is that it moves your forum over to the right too far so you have to scroll to see some stuff. I tried dropping the width all the way down to 50 but then the sidebar doesnt look very good
Logged
Need help with something?
Check Here First
l
Kimmie's Caverns
l
SMF TOS
l
SMF Codes
Crystalman
SMF For Free Full Member
Offline
Posts: 152
Crystalman.EXE
Re: Sidebar!
«
Reply #5 on:
April 11, 2007, 08:30:07 pm »
What if you put it on the right side, instead of left? Then you can veiw the forum normally, but scroll over to veiw the bar.
Logged
Buster Cannon Forums, and BCF-Comics.
Kimmie
SMF For Free Master
Offline
Posts: 2010
Re: Sidebar!
«
Reply #6 on:
April 11, 2007, 10:16:06 pm »
Quote from: Crystalman on April 11, 2007, 08:30:07 pm
What if you put it on the right side, instead of left? Then you can veiw the forum normally, but scroll over to veiw the bar.
I thought about that but I dont see anywhere in the code to change it. Ive also tried changing the background color and it wont change either. Oh well, it was a good thought anyways..
«
Last Edit: April 11, 2007, 10:24:59 pm by Kimmieb
»
Logged
Need help with something?
Check Here First
l
Kimmie's Caverns
l
SMF TOS
l
SMF Codes
simply sibyl
Global Moderator
Offline
Posts: 13309
Re: Sidebar!
«
Reply #7 on:
April 12, 2007, 10:42:53 am »
Kimmie... Im going to play around with this in a little bit here (about an hour or so) at my test site.
Will need to edit the css and that will solve the problem you mentioned with the forum not fitting in the right side. It is just a padding issue and that is easily fixed. If you look at the space style that I did you can see that the forum is on the right side and it works just fine that way
Logged
Support FAQ
|
Guides & Tutorials
|
Tips for Using Support
simply sibyl
Global Moderator
Offline
Posts: 13309
Re: Sidebar!
«
Reply #8 on:
April 12, 2007, 12:13:07 pm »
Quote from: Kimmieb on April 11, 2007, 10:16:06 pm
Quote from: Crystalman on April 11, 2007, 08:30:07 pm
What if you put it on the right side, instead of left? Then you can veiw the forum normally, but scroll over to veiw the bar.
I thought about that but I dont see anywhere in the code to change it. Ive also tried changing the background color and it wont change either. Oh well, it was a good thought anyways..
Kimster.. I changed the background color with no problem at all. You can also just use your normal background. Takes some code tweaking but it does work.
Also.. the cbox works fine. I put it in the sidebar and am able to use it.. no problemo.
Only problem Im having at the moment is getting the forum situated as I want it on the right side.. will keep at it and let ya know on progress.
fixed
«
Last Edit: April 12, 2007, 12:34:34 pm by simply sibyl
»
Logged
Support FAQ
|
Guides & Tutorials
|
Tips for Using Support
Kimmie
SMF For Free Master
Offline
Posts: 2010
Re: Sidebar!
«
Reply #9 on:
April 12, 2007, 01:48:14 pm »
Quote from: simply sibyl on April 12, 2007, 12:13:07 pm
Quote from: Kimmieb on April 11, 2007, 10:16:06 pm
Quote from: Crystalman on April 11, 2007, 08:30:07 pm
What if you put it on the right side, instead of left? Then you can veiw the forum normally, but scroll over to veiw the bar.
I thought about that but I dont see anywhere in the code to change it. Ive also tried changing the background color and it wont change either. Oh well, it was a good thought anyways..
Kimster.. I changed the background color with no problem at all. You can also just use your normal background. Takes some code tweaking but it does work.
Also.. the cbox works fine. I put it in the sidebar and am able to use it.. no problemo.
Only problem Im having at the moment is getting the forum situated as I want it on the right side.. will keep at it and let ya know on progress.
fixed
Thanks for the info sibyl
. I think, for the time being, I will stick with "not using the sidebar". My res is 800x600 and I dont like to have to scroll. Thats the reason I am mad as HE$% at AT&CRAP for changing the Bellsouth homepage. I had to scroll a mile to the right just to check my email..
. Everything worked fine till those idiots took it over..
Logged
Need help with something?
Check Here First
l
Kimmie's Caverns
l
SMF TOS
l
SMF Codes
GreenCap
SMF For Free Member
Offline
Posts: 65
what are you looking at?
Re: Sidebar!
«
Reply #10 on:
June 05, 2007, 09:29:33 pm »
hmm how do i move it to the right side of my forum, because it being on the left made my forum smaller...
Logged
simply sibyl
Global Moderator
Offline
Posts: 13309
Re: Sidebar!
«
Reply #11 on:
June 06, 2007, 10:04:18 am »
Quote from: GreenCap on June 05, 2007, 09:29:33 pm
hmm how do i move it to the right side of my forum, because it being on the left made my forum smaller...
Ive no time today to play with the code to move it to the right for you... but letting you know that it will still "make your forum smaller" if you move it to the right. It doesnt matter if the sidebar is on the left or the right... your forum HAS to be smaller as it only has the remaining space to fill up..
Logged
Support FAQ
|
Guides & Tutorials
|
Tips for Using Support
GreenCap
SMF For Free Member
Offline
Posts: 65
what are you looking at?
Re: Sidebar!
«
Reply #12 on:
June 06, 2007, 02:16:48 pm »
Quote from: simply sibyl on June 06, 2007, 10:04:18 am
Quote from: GreenCap on June 05, 2007, 09:29:33 pm
hmm how do i move it to the right side of my forum, because it being on the left made my forum smaller...
Ive no time today to play with the code to move it to the right for you... but letting you know that it will still "make your forum smaller" if you move it to the right. It doesnt matter if the sidebar is on the left or the right... your forum HAS to be smaller as it only has the remaining space to fill up..
oh ok...
Logged
Enigma
SMF For Free Member
Offline
Posts: 78
Hello!
Re: Sidebar!
«
Reply #13 on:
June 19, 2007, 07:38:53 pm »
Forum Url:
http://subspacewallpaper.smfforfree2.com
Sweet code I like it a lot. Thanks
And then the background went white ? very strange after being black.
Problem fixed by changing color in the css code:
.tablepad { background-color:#FFFFFF; padding:6px; border:1px solid #000000; }
To this:
.tablepad { background-color:#000000; padding:6px; border:1px solid #000000; }
«
Last Edit: June 20, 2007, 07:50:08 pm by Enigma
»
Logged
NightEyes_AVR
SMF For Free Newbie
Offline
Posts: 2
Re: Sidebar!
«
Reply #14 on:
July 02, 2007, 08:58:49 am »
Forum Url:
http://ericnotallowed.smfforfree2.com
Hey, I figured it out!
Ok, to move the side bar to the right hand side is easy.
Put this one in your header'
Code:
<table align=center valign=top>
<tr><td height="100%" valign=top>
and the rest of your side bar gets put in the footer.....
Code:
</td><td height="10%" valign=top> </td><td width=150 valign=top>
<div class='titlebg2'><b><CENTER>Welcome!</CENTER></b></div><div class="tablepad" border='1'><span class='desc'><center>
<center><br><b></b><br>
<center> <font size="2"><br></center>
</span></div></div>
<div class='titlebg2'><b><CENTER>Weekly Awards</CENTER></b></div>
<div class="tablepad"><span class='desc'>
<img src="88x31banner.jpg">
<br></div></div>
<center>
<div class='titlebg2'><b>Chat Box</b></div>
<div class="tablepad"><span class='desc' >
<!-- BEGIN CBOX - http://www.cbox.ws -->
<!-- END CBOX -->
</span></div></div>
<center>
<div class='titlebg2'><b>Staff</b></div>
<div class="tablepad"><span class='desc' ></b>
You may contact the staff through the private message link in their profiles.<br><br>
<b><u>Admins</b> </u><br>
<br><u><b>Moderators</u><br>
</span></div></div>
</center>
<div class='titlebg2'>Affiliates & Links </div>
<div class="tablepad"><span class='desc'>
<img src="88x31banner.jpg">
<b><u>Affiliates</b></u></b><BR>
<br></div></div>
<div class='titlebg2'><b>Credits</b></div>
<div class="tablepad"><span class='desc'>
Side-bar © <a href="http://iql.ancientmagicrpg.com/">Roswenth</a>
</span></div></div>
</br></center>
</td></tr></table>
Yeah, I edited it a little, mostly just customised the boxes to what I wanted them to say (I removed most of the site specific stuff from the example) The only other change I made was on the " tops" of each box, just to fit in with the forum a little better, I made them use tittlebg2
If you want an example you can look at my forum.
I'm pretty proud of this, mostly because I'm not a programmer
Logged
Pages: [
1
]
2
3
4
...
8
Print
« previous
next »
Jump to:
Please select a destination:
-----------------------------
SMF For Free Site
-----------------------------
=> Announcements
=> General Discussion
=> Suggestions
-----------------------------
SMF For Free Support
-----------------------------
=> General Support
=> Guides and Tutorials
=> Stylesheet Codes
=> Stylesheet Requests and Support
=> SMF For Free Codes and Support
===> Code Requests
=> Bugs
=> Report Terms of Service Violations
-----------------------------
General Stuff
-----------------------------
=> General Chat
=> Advertise Your Board/Blog
=> Programming
===> HTML
===> JavaScript
===> C,C++
===> Java
===> .Net
===> PHP
===> Visual Basic
=> Gaming
===> PC Games
===> Nintendo
===> Playstation
===> Xbox / Xbox 360
=> Graphics
===> Living Avatars
Loading...