Announcement

Collapse
No announcement yet.

[HowTo] [3.5.0] Add a Right Column?

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Floris
    started a topic [HowTo] [3.5.0] Add a Right Column?

    [HowTo] [3.5.0] Add a Right Column?

    [HowTo] [3.5.0] Add a Right Column?

    This template modification will guide you through the steps with clear instructions and visual examples on how to add a right column to your vBulletin forum version 3.5.0. Once added, you can fill the right column with your own XHTML code, for custom graphics, advertisements, links, etc.

    Original thread by Jake Bunce for vBulletin forum software version 3.0.x:
    http://www.vbulletin.com/forum/showthread.php?t=101599

    [HowTo] [3.5.0] Add a Left Column? -thread can be found here:
    http://www.vbulletin.com/forum/showthread.php?t=156408


    NOTE: There is a lot of tweaking involved in modifying your layout like this. This code is just an example, minus the tweaking. I recommend you post on http://www.vBulletin.org/ for help with the tweaking aspect of editing your layout.


    Installation Instructions
    (click on the attached images to zoom in)

    # Updating the 'header' template

    Admin Control Panel (login as full admin) > Styles & Templates (section) > Style Manager (link) > Select from the dropdown: Edit templates

    Click image for larger version

Name:	right_column_edit_templates.png
Views:	2
Size:	11.1 KB
ID:	3698766

    Select the 'header' template and click on the [Customize] button.

    Click image for larger version

Name:	right_column_customize_header.png
Views:	2
Size:	7.6 KB
ID:	3698767

    In the template, find this code:
    Code:
    <!-- content table -->
    Above this code, on a new empty line, add these code lines:
    Code:
    <!-- Right Column START -->
    <table width="$stylevar[outertablewidth]" border="0" cellpadding="0" cellspacing="0" align="center">
     <tr>
     <td valign="top">
    <!-- Right Column START -->
    Save Template in History: Yes [x] (Check the checkbox)
    Comment: Added Right Column Code

    Click on the [Save] button to apply the changes.

    Click image for larger version

Name:	right_column_start.png
Views:	1
Size:	18.1 KB
ID:	3698764


    # Updating the 'footer' template

    Admin Control Panel (login as full admin) > Styles & Templates (section) > Style Manager (link) > Select from the dropdown: Edit templates

    Click image for larger version

Name:	right_column_edit_templates.png
Views:	2
Size:	11.1 KB
ID:	3698766

    Select the 'footer' template and click on the [Customize] button.

    Click image for larger version

Name:	right_column_customize_footer.png
Views:	1
Size:	7.5 KB
ID:	3698768

    In the template, find this code:
    Code:
    <!-- /content area table -->
    Above this code, on a new empty line, add these code lines:
    Code:
    <!-- Right Column STOP -->
     <td width="175" valign="top" class="page" style="padding: $stylevar[cellpadding]px;">
      YOUR CONTENT HERE
     </td>
    </td>
     </tr>
    </table>
    <!-- Right Column STOP -->
    Save Template in History: Yes [x] (Check the checkbox)
    Comment: Added Right Column Code

    Click on the [Save] button to apply the changes.

    Click image for larger version

Name:	right_column_stop.png
Views:	1
Size:	18.1 KB
ID:	3698765


    NOTE: The 'header' template now has this text: (load your forums to view it)
    Code:
    YOUR CONTENT HERE
    Edit the 'header' template again and replace that text with your own custom XHTML code, be it a graphic or advertisement or links.

    You are now done.

    Click image for larger version

Name:	right_column_result.png
Views:	1
Size:	30.3 KB
ID:	3698769

Related Topics

Collapse

Working...
X