In: Categories » Internet and online » Forums » vBulletin templates
This now displays some of the templates used by vBulletin, some of which are shown below. Most of the pages that you see when using a vBulletin board are made up of one or more of these templates. (Generally, a page is made of three: a header, a footer, and the main body.)
Here, templates are grouped. Headings are in blue, and template names are in white. As you will see later, edited templates appear in red text to make finding them easier.
To display all the templates, you have to click on another button, again marked << >>, to expand all the template groups.
You will now see a full listing of the vBulletin templates available. There are a significant number, and they are grouped into 34 categories:
• BB Code Layout Templates
• Buddy List Templates
• Calendar Templates
• Editor Templates
• FAQ Templates
• Forum Display Templates
• Forum Home Templates
• Help Templates
• Instant Messaging Templates
• Member Info Templates
• Modify User Option Templates
• Navigation / Breadcrumb Templates
• New Posting Templates
• Page Navigation Templates
• PHP Include Code Templates
• Private Message Templates
• Poll Templates
• Postbit Templates
• Post Icon Templates
• Printable Thread Templates
• Registration Templates
• User Reputation Templates
• Search Templates
• Show Groups Templates
• Show Thread Templates
• Smilie Popup Templates
• Subscribed Thread Templates
• Paid Subscriptions Templates
• Thread Administration Templates
• User Control Panel Templates
• User Profile Field Templates
• User Note Templates
• Who Posted? Templates
• Who's Online Templates
Template Structure
Let's take a quick look at the structure of the FORUMHOME template before we go on to make some changes to it.
Right at the top of the template is the beginning of the HTML code for the actual page displayed in the browser.
$stylevar[htmldoctype]
<html dir="$stylevar[textdirection]" lang="$stylevar[languagecode]">
<head>
<!-- no cache headers -->
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="-1" />
<meta http-equiv="Cache-Control" content="no-cache" />
<!-- end no cache headers -->
<title><phrase 1="$vboptions[bbtitle]">$vbphrase [x_powered_by_vbulletin]</phrase></title>
$headinclude
</head>
There are a number of vBulletin variables in this small section of code. Variables can be easily spotted because they are all prefixed with the $ character. Some of these variables refer to phrases that we looked at earlier while others control the running for the forum. For example, $vbphrase[x_powered_by_vbulletin] refers to a phrase in vBulletin this is the phrase that adds the powered by vBulletin to the menu bar of the browser, while the $vboptions[bbtitle] variable extracts the forum title from the vBulletin options settings and displays it. Both of these are shown below. All the templates follow this format HTML combined with vBulletin-specific variables.
The other variables, such as $stylevar[htmldoctype] and $stylevar[languagecode], control settings outputted to the HTML header, shown below:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html dir="ltr" lang="en">
<head>
<!-- no cache headers -->
<meta http-equiv="Pragma" content="no-cache" />
..<meta http-equiv="Expires" content="-1" />
..<meta http-equiv="Cache-Control" content="no-cache" />
..<!-- end no cache headers -->
..<title>The Example Forums Forum - powered by vBulletin</title>
..<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<meta name="generator" content="vBulletin 3.5.2" />
<meta name="keywords"
content="vbulletin,forum,bbs,discussion,jelsoft,bulletinboard" />
<meta name="description" content="This is a discussion forum powered by
vBulletin. To find out about vBulletin, go to http://www.vbulletin.com/ ." />
These settings are stored and edited through the vBulletin Style Manager.
Further along in the code, you will find other variables, and you might be able to guess at what some of them do for example, $navbar. The code that controls the display of the navbar is stored in a separate template, which is inserted into the main page. This allows different parts of the forum to be stored (and edited) separately. Because the navbar is used extensively in vBulletin discussion boards, it makes sense to store that code in one place this results in less code overall
and also means that, if you want to make a change to the navbar, you need do so only once. So, when the FORUMHOME template is used to display the front page of the forum, all the variables are processed at the server, and the final page outputted to the browser for display.
Similarities to PHP and ASP includes
If you are used to using PHP or ASP, you will more than likely be familiar with the concept of includes this is where one section of code is inserted into another so that they are combined server-side before being displayed. This is exactly what is happening here.
If you carry on looking at this template (or any other template), you will see a combination of HTML and variables coming together to create a forum page. Sometimes the relationship between the two is clear, other times it's not so clear, and you might need to experiment with the code before figuring it out. (We will get a clearer understanding of working with templates in Article 8.)
Adding a FORUMHOME Sidebar
Now you've had a chance to get acquainted with the FORUMHOME template, let's look at how we can make changes to it, by adding a sidebar to the forum. A sidebar is a place where you can add your own content to be displayed on the front page of your forum. This is a change that vBulletin administrators often want to make because it gives them a place to make specific additions to the forum, such as important announcements, links, or advertisements.
Making changes to templates generally requires you to have at least a basic understanding of HTML. The more HTML you know, the more easily you will be able to make changes and customizations to your forum.
All the changes here are going to be to the FORUMHOME template, but don't worry about damaging your forum if things go wrong, you can always undo the changes later. However, if you follow these instructions, then things will be fine.
Two Changes
You only need to make two changes to the FORUMHOME template. These two changes involve the addition to two sections of HTML code.
Firstly, scroll down the FORUMHOME template to the section of code shown below:
<body>
$header
$navbar
<!-- main -->
Between the $navbar variable and the <!-- main --> comment tag, add a couple of hard returns to make space for the code you want to add.
<body>
$header
$navbar
<!-- main -->
Now, when you make modifications to a template, you might need to find these changers later in order to edit or delete them. If you just add modifications directly to the code, then it's easy for them to get lost. We suggest that you add some comment tags and place your changes within these. To the comment tags, we usually add a description of the change we're making and the date. Also, if we know how many changes we are going to make, we add that information too. These comments will also be very useful to you later on when upgrading to a new version of vBulletin because it makes your modifications easy to spot.
<body>
$header
$navbar
<!-- Start sidebar code / Jan 06 / change 1 of 2 -->
<!-- End sidebar code / Jan 06 / change 1 of 2 -->
<!-- main -->
Now we can add the code. Here this is the beginning of an HTML table. The table will be 150 pixels wide.
<body>
$header
$navbar
<!-- Start sidebar code / Apr 05 / change 1 of 2 -->
<table width="$stylevar[outertablewidth]" border="0" cellpadding="$stylevar[cellpadding]" cellspacing="0" align="center">
<tr>
<td width="150" valign="top">
ADD CONTENT HERE
</td>
<td valign="top">
<!-- End sidebar code / Apr 05 / change 1 of 2 -->
<!-- main -->
These are all the changes we need to make at the top for now. Now scroll to near the bottom of the FORUMHOME template to the point shown below:
</table>
<!-- / icons and login code -->
$footer
</body>
Now again add a few returns between the <!-- / icons and login code --> comment tag and the $footer variable.
</table>
<!-- / icons and login code -->
$footer
</body>
Next, add the comment tags that will later allow you to find the change you made.
</table>
<!-- / icons and login code -->
<!-- Start sidebar code / Jan 06 / change 2 of 2 -->
<!-- End sidebar code / Jan 06 / change 2 of 2 -->
$footer
</body>
Now it's time to add the code. This is simply the HTML code that closes the table we opened above.
</table>
<!-- / icons and login code -->
<!-- Start sidebar code / Jan 06 / change 2 of 2 -->
</td>
</tr>
</table>
<!-- End sidebar code / Jan 06 / change 2 of 2 -->
$footer
</body>
With the final change made, all that is left to do is to save the template by clicking on the Save button at the bottom (or Save & Reload, which combines saving the template with reloading it into the editor).
If you were doing this for real, you could now go back to the FORUMHOME template and add the content you want to appear in the sidebar. If you return to the Style Manager, you will notice that the entry for FORUMHOME is highlighted in red and that beside it appear the details of when the change was made and who made it. We've shown this below for the FORUMHOME template that we have just modified.
In the image above, you will see two buttons that are very useful once you have templates that have been modified. These are the View Original button and the Revert button. Clicking on the View Original button allows you to view the original template without any of the modifications added. Viewing the original template does not alter the content of the altered template both are stored separately.
The Revert button does exactly what you'd expect. It reverts the template back to original and eliminates any changes made. Use this with care, as there is no undo feature and your changes will be lost!
PHP Code Modifications
The final kind of modification that can be made to a vBulletin installation is direct modification to the underlying PHP code of the forum. There is no direct access to the PHP code from within the vBulletin, so all of this has to be done using a text editor and an FTP program to upload the file.
Words of caution
Be careful when making changes to the PHP code that lies behind your vBulletin forum it is very easy to damage or destroy your forum if you make incorrect changes. Also, if you do have problems, don't expect to receive support, as this is not covered. (You will be advised to reload the forum software or fall back to a backup to solve the problem.) So take care!
Be careful when making changes always make a note of the changes you make and keep backups of any files that you alter.
PayPal Modification
Let's look at making a very simple PHP modification to a vBulletin forum.
This modification revolves around the PayPal subscription system that allows paid subscriptions to a vBulletin forum. Generally, the PayPal subscription is treated as a non-shipping transaction (services only), and the address of the person subscribing isn't transmitted to the administrator when a subscription is made. Usually this is fine, but there are times when a forum subscription might include a gift or a hard copy magazine or newsletter. A simple modification to the PHP code allows PayPal to treat a subscription as a goods transaction and provides the subscriber's address to the administrator of the forum. (The subscriber can change this if they want.)
File Modification
This modification only involves one file. This is includes\functions_subscriptions.php. To begin this modification process, either download a copy of this file from the server using FTP, or go to your original installation files and retrieve a copy of it. (Remember to keep an unaltered original just in case you want to revert the changes.)
Open the file in a text editor. (Do not use Notepad, as this can have problems instead use WordPad or another editor such as UltraEdit.) Now, in this file we scroll down to line 381. This is the line that we need to change for the modification to work. The change is simple, but effective.
Change this:
<input type=\"hidden\" name=\"no_shipping\" value=\"1\" />
to this:
<input type=\"hidden\" name=\"no_shipping\" value=\"0\" />
All that needs to be done is to change value=\"1\" to value=\"0\".
Once this is done, save the file. In particular, take care not to add any spaces or carriage returns at the end of the file, as these can cause problems. Now upload it into the appropriate folder back on the server.
That's it! Job done!
legal notice
Our website is not responsible for the information contained by this article. Web-articles is a free articles resource.
Suggestion: If you need fresh, daily updated content for your website, feel free to use our service. Click here for more information.
Useful tools and features
If you like this article (tutorial), please link to it from your web page using the information above.
related articles
Before we see how to install vBulletin, and how to customize and hack the board, let's take a little time to look at the board, the company behind it, and a little of its history. We will also show you what other people have accomplished with this most versatile and powerful board. What is vBulletin? This is a good place to start! vBulletin is software that is loaded onto a web server to allow you to create and manage online forums or discussion boards. It is des...
2. The vBulletin Advantage
The vBulletin Advantage What are the key benefits from choosing and running vBulletin? Here are the top reasons to base your community on vBulletin. Versatile vBulletin is designed to be versatile and can be run on a variety of platforms. • vBulletin is written in PHP, making it fast, efficient, and capable of running on a broad range of hosting platforms. Shared hosting provides the cheapest option, while semi-dedicated hosting solutions offer more power...
3. vBulletin Licensing Options
vBulletin Licensing Options vBulletin is a commercial product, and you must therefore buy a license before you can use it. To offer site owners the greatest possible flexibility there are two licensing options to choose from: • Leased license • Owned license Leased License Purchasing a leased license will allow you to run vBulletin on your server for one year. During this period you will be entitled to technical support and softwa...
4. The requirements of vBulletin
In the next article we're going to be shifting our focus to the installation and configuration of vBulletin. In this article we begin at the point where most people begin with vBulletin with a copy of the software and somewhere to upload it to. If you have both of those, then you are probably eager to get going with the installation! We will look at: • The requirements of vBulletin • How to install the files • How to create the database • How ...
The vBulletin Control Panel Now that you have come this far, you are probably eager to access the Control Panel and get started. Click on the link on the Step 13 page to access the Control Panel. (You will need to have deleted the install/install.php file before being able to continue.) After clicking on the link you will then need to enter the username and password you assigned to the administrator during the installation of vBulletin. Once you log into the Control P...
6. Importing Data into vBulletin
If you are moving to vBulletin from another type of discussion board, then there is a good chance that you won't want to lose all the posts that you already have and start again with nothing. And it's not just the posts that are important what about all your member information usernames, passwords, profile data? You don't want to lose all that and start with aIn the right-hand pane you get information about the version notice how we are being told that there is a newer version of vBulletin available. That's a really handy feature, and...
7. The vBulletin User Experience
A Tour of vBulletin In the previous article we looked at the vBulletin installation process. This process involved downloading the installation files, making edits to the configuration files, creating or preparing a database for vBulletin, uploading the installation files, and finally going through the vBulletin installation wizard. We also looked at how to import posts and settings from another discussion board into vBulletin. Now that you have a working vBulletin board, the next thing that you need to do is famili...