How to Add a Sidebar in prosilver Tutorial

[Soliloquy]

Thanks mej284, I got it working. Do you know where to read more about phpBB3 template conditionals and control structures?

[mej284]

Thanks mej284, I got it working. Do you know where to read more about phpBB3 template conditionals and control structures?

All I can suggest is read here and ask questions. I am somewhat of a newbie with all this as well. I am learning through hands on playing as my kids call it. There is a lot of good information here and a lot of great people willing to help.

I have also got some information here http://www.w3schools.com/default.asp. I am sure there are more site, I have another good friend that helps out, called google. But http://www.phpbb.com is your best source.

[kipin]

rspowers,

Awesome code, thanks a ton!

[ameisez]

Hello,

I have the same question! After reading the whole discussion, I got confused.
I tried with the code given in the first message but it didn't work.

Could anyone summarize with the right code? I just need a left (or right) sidebar.

I agree.

Anyone who knows which code is really working please summarize.

Thanks

[indepndent]

I have a better tute.
No Tables Nothing. Just DIV DIV And Pure DIVS. God I hate Tables.

Code: Select all

First Create a sidebar.html file in the template directory and add whatever you want.

Open template\overall_footer.html
NOTE: The reason I am putting the code in overall_footer is that I wanted to load the sidebar after my forum is rendered. As I will be displaying advertisements on the sidebar, It only makes sense to load them after the forum gets loaded so that Adsense bot can understand better as to what it needs to display.

Find

Code: Select all

<div id="page-footer">
	<div class="navbar">

Add Before

Code: Select all

<div class="page-sidebar">
<!-- INCLUDE sidebar.html -->
</div>

Save the file.

Go to Administration Panel -> Styles -> Theme and click on Edit
Find

Code: Select all

#page-body {

For Displaying Sidebar on Left Add after

Code: Select all

width:85%;
float:left

Also Remove the Following line bellow #page-body

Code: Select all

float:auto

NOTE #page-body should look like this

Code: Select all

#page-body {
float:left;
margin:4px 0pt;
width:81%;
}

Go To The Last line and add After

Code: Select all

.page-sidebar {
float:right;
margin-top:4px;
width:14%;
}

For Displaying Sidebar on Right Add after

Code: Select all

width:85%;
float:Right

Go To The Last line and add After

Code: Select all

.page-sidebar {
float:left;
margin-top:4px;
width:14%;
}

U can Play With the width to adjust the size and all. Just change the percentage.
I mean instead of 85% you can make it 80% or something.



DEMO
http://iluvdesi.com

Let me know my mistakes and any help u want.




Edit I made some typos. Corrected it. it Should Work now

Hi I have subsilve2r based styles can you please tell me how to do this with subsilver2 as well? What is the file that is edited through the ACP==> themes? Is tha something I can edit in notepad and save instead of editing it right through ACP?

Thanks

[ghosh845]

guys i want to put 3-4 small small adds in that side bar ....how is that plossible ...i want to put flash adds as well as banner adds (these are not from google ...these are my own adds) ...please help me in detail how to put them in the sidebar.html file(what ever it is)
thnx

[Andy76]

ADDS A SIDEBAR TO THE RIGHT ONLY

I think you would add this code to the overall_header.html instead of the other code...

Code: Select all

<table width="100%" border="0" cellspacing="10" cellpadding="0">
       <tr>
                  <td align="left">

and in the overall_footer.html you would put this

Code: Select all

</td>
       <td width="200" align="right" valign="top" class="bodyline">
          <table width="200" border="0" cellpadding="10" cellspacing="0" bgcolor="#CC0099">
                   <tr>
                     <td><font color="#FFFFFF" size="1" face="Arial, Helvetica, sans-serif">Right column in here..</font></td>
                   </tr>
                 </table>
       </td>
       </tr>
    </table>

ADDS A SIDEBAR TO BOTH SIDES
it you wanted one one each side you would
use this code in the overall_header.html

Code: Select all

[size=85]<table width="100%" border="0" cellspacing="10" cellpadding="0">
       <tr>
       <td width="200" align="left" valign="top" class="bodyline">
          <table width="200" border="0" cellpadding="10" cellspacing="0" bgcolor="#0000CC">
                   <tr>
                   <td><font color="#FFFFFF" size="1" face="Arial, Helvetica, sans-serif">Left column in here..</font></td>
                    </tr>
                  </table>
       </td>
            <td align="left">[/size]

and this code in the footer

Code: Select all

</td>
       <td width="200" align="right" valign="top" class="bodyline">
          <table width="200" border="0" cellpadding="10" cellspacing="0" bgcolor="#CC0099">
                   <tr>
                     <td><font color="#FFFFFF" size="1" face="Arial, Helvetica, sans-serif">Right column in here..</font></td>
                   </tr>
                 </table>
       </td>
       </tr>
    </table>

I have only tested the right and left separately not together. they work separately so they should together.

Where would you put the code in overall_headder and overall_footer? Do you have to replace lines of code, or just add it somewhere?
Thanks in advance

[Andy76]

Is there a way to insert the side bar by editing forumlist_body.html, and viewforum_body.html?
Where abouts would I insert the line of code?
I am using the subsilver2 template, and it doesn't look quite right when done in the tutorial.

[sca2face]

I have followed the instructions but the ad i am trying to display isn't working, I removed the ad code and typed "this is a test" and saved the file, nothing displayed. It appears that the code is working as far as making room for the add but it is not reading from the ad html file in this instance overall_sidebar.html. any idea what is causing this and how i could get my add to work?

[Raimon]

Did you after you edit the file and upload it , prune the cache into your acp ?

[sca2face]

Did you after you edit the file and upload it , prune the cache into your acp ?

Prune my cache? I'm sorry i don't follow.

[Raimon]

After every edit you must prune the cache , you can do that with the next steps , go to your acp -> click under stats on the Purge the cache "run now" button.

[sca2face]

I finally got the add to display but now it's below the forum body, what did i do wrong? Ref http://www.sourcetotal.com

[rhythm1]

You did not add the CSS, or after adding it, you didnt refresh the style
ACP >> styles >> theme >> prosilver >> refresh

[sca2face]

Did i miss the CSS section? I don't recall anything about CSS editing.