Go Back   vb.org Archive > vBulletin Article Depository > Read An Article > vBulletin 4 Articles
FAQ Community Calendar Today's Posts Search

Reply
 
Thread Tools
[HOW TO - vB4] Create your own vBulletin page
Lynne's Avatar
Lynne
Join Date: Sep 2004
Posts: 41,180

 

California/Idaho
Show Printable Version Email this Page Subscription
Lynne Lynne is offline 11-15-2009, 10:00 PM

This is an updated article on how to create your own vbulletin powered page. It's only for use with vB4.

This is NOT my work. I'm posting this from another thread where vB Style took the time to write this out. And his work is based on the article by Gary King here - How to create your own vBulletin-powered page! (uses vB templates)

Instructions to Create your Own Page:


1. Create the php page:
- Create a new file, whatever you want to call it (let's say test.php).
- Open up test.php and add the following (replace TEST with whatever template you want to show - WARNING: the template name is CASE SENSITIVE!!!):
Code:
<?php

// ####################### SET PHP ENVIRONMENT ###########################
error_reporting(E_ALL & ~E_NOTICE);

// #################### DEFINE IMPORTANT CONSTANTS #######################

define('THIS_SCRIPT', 'test');
define('CSRF_PROTECTION', true);  
// change this depending on your filename

// ################### PRE-CACHE TEMPLATES AND DATA ######################
// get special phrase groups
$phrasegroups = array();

// get special data templates from the datastore
$specialtemplates = array();

// pre-cache templates used by all actions
$globaltemplates = array('TEST',
);

// pre-cache templates used by specific actions
$actiontemplates = array();

// ######################### REQUIRE BACK-END ############################
// if your page is outside of your normal vb forums directory, you should change directories by uncommenting the next line
// chdir ('/path/to/your/forums');
require_once('./global.php');

// #######################################################################
// ######################## START MAIN SCRIPT ############################
// #######################################################################

$navbits = construct_navbits(array('' => 'Test Page'));
$navbar = render_navbar_template($navbits);

// ###### YOUR CUSTOM CODE GOES HERE #####
$pagetitle = 'My Page Title';

// ###### NOW YOUR TEMPLATE IS BEING RENDERED ######

$templater = vB_Template::create('TEST');
$templater->register_page_templates();
$templater->register('navbar', $navbar);
$templater->register('pagetitle', $pagetitle);
print_output($templater->render());

?>
- Be sure to change 'TEST' to the actual template name (WARNING: the template name is CASE SENSITIVE!!!), and change 'test' to the filename or a unique name for the page. Also, change 'Test Page' and 'My Page Title' to whatever you want to show in the navbits, such as 'Viewing Member Profile' (just an example).

2. Create the Template:
- If you are in debug mode, create the template in your MASTER STYLE so it shows up in all your styles, otherwise make sure you create the template in the style you are using. If following the page above, call the template TEST (WARNING: the template name is CASE SENSITIVE!!!) with the following content:
HTML Code:
{vb:stylevar htmldoctype}
<html xmlns="http://www.w3.org/1999/xhtml" dir="{vb:stylevar textdirection}" lang="{vb:stylevar languagecode}" id="vbulletin_html">
  <head>
    <title>{vb:raw vboptions.bbtitle} - {vb:raw pagetitle}</title>
    {vb:raw headinclude}
    {vb:raw headinclude_bottom}
  </head>
  <body>
    
    {vb:raw header}
    
    {vb:raw navbar}
    
    <div id="pagetitle">
      <h1>{vb:raw pagetitle}</h1>
    </div>
    
    <h2 class="blockhead">Title</h2>
    <div class="blockbody">
      <div class="blockrow">
        Text
      </div>
    </div>
    
    {vb:raw footer}
  </body>
</html>
.
Instructions to Add your Page to the Who's Online List (WOL):
Create two plugins using the following hooks. Replace mypage and similar with your information.

1. hook location - online_location_process:
Code:
switch ($filename)
{
    case 'test.php':
        $userinfo['activity'] = 'mypage';
        break;
// add more cases here if you have more than one custom page. no need for multiple plugins. one plugin can handle all.
}
.
2. hook location online_location_unknown:
Code:
switch ($userinfo['activity'])
{
    case 'mypage':
        $userinfo['where'] = '<a href="test.php?'.$vbulletin->session->vars[sessionurl].'">My Page</a>';
        $userinfo['action'] = "Viewing My Page";
        $handled = true;
        break;
// add more cases here if you have more than one custom page. no need for multiple plugins. one plugin can handle all.
}
.
The colored part in the code above shows what you need to change in the plugins (both reds should be the same and both blues should be the same, whereas green can be whatever you want).


Please see this article for help with rendering templates - [vB4] Rendering templates and registering variables - a short guide
Reply With Quote
  #512  
Old 03-29-2011, 10:14 AM
Mark4865's Avatar
Mark4865 Mark4865 is offline
 
Join Date: Sep 2010
Location: South-Africa
Posts: 289
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Hello Lynne,

we have changed the names to match but still just a blank white page, any chance you would consider having a look??

regards

Mark

Update: Okay we seem to have something working here but just the header and footer but not the HTML we inserted, will fool around and see what we have done wrong here.

--------------- Added [DATE]1301403637[/DATE] at [TIME]1301403637[/TIME] ---------------

Have managed to get it sort of working, there is a problem with our background not showing through as it hides behind the standard white page.

I want to instert my custom HTML page between the header and the footer, I dont want the title or standard background to show, just the header and footer with all standard functions, but my own images and text in between the header and footer.

Can anyone help me here??

Another Update:

Okay we seem to have resolved most issues and this is a great mod Lynne thanks for all the hard work.

One issue, on this page I need a different background that my standard VB background that is preset for all the other pages. We tried to somehow have an image coded into the background via HTML but it then hides behind the standard VB page and does not cover it, still trying to work it out, any ideas anyone??
Reply With Quote
  #513  
Old 03-29-2011, 04:28 PM
Lynne's Avatar
Lynne Lynne is offline
 
Join Date: Sep 2004
Location: California/Idaho
Posts: 41,180
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Quote:
Originally Posted by Mark4865 View Post
One issue, on this page I need a different background that my standard VB background that is preset for all the other pages. We tried to somehow have an image coded into the background via HTML but it then hides behind the standard VB page and does not cover it, still trying to work it out, any ideas anyone??
Post a link to the page so we can see it and post an image of what you want it to look like, that way we can make a CSS recommendation.

Quote:
Originally Posted by SuperTaz View Post
Where did I go wrong?
I would guess it is a template issue. Can you post what your template looks like?
Reply With Quote
  #514  
Old 03-29-2011, 04:44 PM
BF777 BF777 is offline
 
Join Date: Jan 2007
Posts: 95
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Where does one create the template suggested in step #2?
Reply With Quote
  #515  
Old 03-29-2011, 05:14 PM
Mark4865's Avatar
Mark4865 Mark4865 is offline
 
Join Date: Sep 2010
Location: South-Africa
Posts: 289
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

[QUOTE=Lynne;2178776]Post a link to the page so we can see it and post an image of what you want it to look like, that way we can make a CSS recommendation.

Hello Lynne,

site is not currently active I can pm you a test log in if you be prepared to check it for me

regards

Mark
Reply With Quote
  #516  
Old 03-29-2011, 08:51 PM
SuperTaz's Avatar
SuperTaz SuperTaz is offline
 
Join Date: Apr 2007
Location: Pennsylvania
Posts: 744
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Quote:
Originally Posted by Lynne View Post
Post a link to the page so we can see it and post an image of what you want it to look like, that way we can make a CSS recommendation.


I would guess it is a template issue. Can you post what your template looks like?
Sure can. Here you go:

Code:
{vb:stylevar htmldoctype}
<html xmlns="http://www.w3.org/1999/xhtml" dir="{vb:stylevar textdirection}" lang="{vb:stylevar languagecode}" id="vbulletin_html">
  <head>
    <title>{vb:raw vboptions.bbtitle} - {vb:raw pbss_viewer}</title>
    {vb:raw headinclude}
    {vb:raw headinclude_bottom}
    <link rel="stylesheet" type="text/css" href="pbss.css" />
  </head>
  <body>
    
    {vb:raw header}
    
    {vb:raw navbar}
    
    <div id="pbss_viewer">
      <h1>{vb:raw pbss_viewer}</h1>
    </div>
    
    <h2 class="blockhead">Punkbuster Screenshot Viewer</h2>
    <div class="blockbody">
      <div class="blockrow">
<div align="center"><form name=ipz><table style="font-size:11pt"
width=100% border=0><tr align=center><td colspan=2 bgcolor=#DBDBDB></div>
        <table width="100%" border="3">
          <tr>
            <td height="83"><div align="center"><span class="stijl5"><a href="http://www.gameservers.com/?ref=1624059">
<img src="http://images.gameservers.com/image_3.gif?ref=1624059" width="120" height="60" border="0"></a></span><br><br><a href="http://www.punkbuster.com/"><img src="http://www.global-gamers.net/images/pb.png" width="120" height="60" border="0"></a><br><br><a href="http://www.pbbans.com"><img src="http://www.pbbans.com/images/banners/pbb_120x50.gif" alt="PBBans.com" title="Join the live banning revolution today!" width="120" height="60" border="0"></a></div></td>

            <td><div align="center"><img src="http://www.global-gamers.net/images/global.png" alt="Global Gamers"><br>
<a href="http://www.punkbuster.com/"><b>Punkbuster</b></a>&trade Screen Shot 
              Viewer<br><a href="http://www.global-gamers.net/"><b>Global Gamers</b></a> Copyright&copy 2011<br><span style="color: #000000"><b>Disclaimer: All titles, names, images and logos are trademarks of their respective owners!</b></span><br>
<!-- Counter ----->
<table width="133" border="0" cellspacing="0" cellpadding="3"><tr><td align="center"><a href="http://www.website-hit-counters.com" target="_blank"><img src="http://www.website-hit-counters.com/cgi-bin/image.pl?URL=286611-1114" alt="hit counter" border="0" ></a></td></tr><tr><td align="center"><font style="font-family: Geneva, Arial, Helvetica, sans-serif; font-size: 9px; color: #330006; text-decoration: none;"> <a href="http://www.website-hit-counters.com" target="_blank" style="font-family: Geneva, Arial, Helvetica, sans-serif; font-size: 9px; color: #555556; text-decoration: none;" title="hit counter">hit counter</a></font></td></tr></table>
<!-- End Counter ---->
<hr align="center"></hr>
</div>
            </div></td>
            <td><div align="center"><span class="stijl5"><a href="http://www.gameservers.com/?ref=1624059">
<img src="http://images.gameservers.com/image_3.gif?ref=1624059" width="120" height="60" border="0"></a></span><br><br><a href="http://www.punkbuster.com/"><img src="http://www.global-gamers.net/images/pb.png" width="120" height="60" border="0"></a><br><br><a href="http://www.pbbans.com"><img src="http://www.pbbans.com/images/banners/pbb_120x50.gif" alt="PBBans.com" title="Join the live banning revolution today!" width="120" height="60" border="0"></a></div></td>
          </tr>
        </table>
<br>
    Enter the IP of another server (without the port):
    <input type="text" name="ipq" size="15" style="font-family:Courier New;font-size:11pt"
value="Game Server IP">
&nbsp; 
  <br>
  <br>
     Start Number:
  <input type=text value=1 name=ips size=2 style="text-align:right">
  &nbsp; End Number:
  <input
size=3 type=text value=100 name=ipe style="text-align:right"> 
  &nbsp; 
  <input type=button value="VIEW" onClick="show()"><br><br>
    </span></div>
<hr align="center"></hr>
<br>
</div>
<tr align=center><td width=58% valign=top class="stijl1" ID=T2><div align="center"><br>
</div></td><td width=42% valign=top bgcolor="DBDBDB" class="stijl1">
<div ID=T4 style="background-color="DBDBDB"><br>
  <div align="center"><span class="stijl6">pbsvss.htm file from the selected server:</span></div><br>
</div><iframe
height=10000 name=T3 width=100% scrolling=auto border=0></iframe></td></tr>
<div align="center">
  <script type="text/javascript">
function show(){if(!ipz.ipq.value){return}aa=ipz.ipq.value;bb=eval(ipz.ips.value);bbx=eval(ipz.ipe.value)+1;z="http://"+aa
+"/"+aa+"/pbsvss.htm";T4.innerHTML="<a href='"+z+"' style='color:000000' target=index><b>"+z+"</b></a>";T3.location.href=z;
x="<b style='color:000000'>PBSS from Server with IP = "+aa+"<hr>";for(cc=bb;cc<bbx;cc++){n=cc.toString();if
(n.length==1){n="0"+n}if(n.length==2){n="0"+n}if(n.length==3){n="0"+n}if(n.length==4){n="0"+n}if(n.length==5){n="0"+n}
nz="http://"+aa+"/"+aa+"/pb"+n;x+="<a style='cursor:hand;color:000000' href='"+nz+".htm' target="+n+">"+nz+".htm</a><br>"
+"<img src='"+nz+".png'><hr>"}T2.innerHTML=x+"</b><br>"}</script>
</div></div>
      </div>
    </div>
    
    {vb:raw footer}
  </body>
</html>
Reply With Quote
  #517  
Old 03-30-2011, 01:50 AM
Lynne's Avatar
Lynne Lynne is offline
 
Join Date: Sep 2004
Location: California/Idaho
Posts: 41,180
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Quote:
Originally Posted by BF777 View Post
Where does one create the template suggested in step #2?
admin cp > style manager > find your style > add template in dropdown
Quote:
Originally Posted by Mark4865 View Post
Hello Lynne,

site is not currently active I can pm you a test log in if you be prepared to check it for me

regards

Mark
Sure. Please also email me a link to this thread/post so I know what you are PMing me about.

Quote:
Originally Posted by SuperTaz View Post
Sure can. Here you go:
I didn't check all of your html cuz I can tell you have problems right off the bat with a line like this:
HTML Code:
<div align="center"><form name=ipz><table style="font-size:11pt"
width=100% border=0><tr align=center><td colspan=2 bgcolor=#DBDBDB></div>
You cannot have a div wrapped around just part of a form/table/row/column tag. All tags must be closed via last opened/first closed. You need to make sure you use valid html of your will have issues like what you are seeing.
Reply With Quote
  #518  
Old 03-30-2011, 06:12 PM
BF777 BF777 is offline
 
Join Date: Jan 2007
Posts: 95
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Can these pages be modified in a program like Dream Weaver and then saved in the template? Would that create any issues?
Reply With Quote
  #519  
Old 03-30-2011, 07:18 PM
Lynne's Avatar
Lynne Lynne is offline
 
Join Date: Sep 2004
Location: California/Idaho
Posts: 41,180
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Quote:
Originally Posted by BF777 View Post
Can these pages be modified in a program like Dream Weaver and then saved in the template? Would that create any issues?
I have no idea since I don't use Dreamweaver. Try it and see.
Reply With Quote
  #520  
Old 03-30-2011, 09:05 PM
BF777 BF777 is offline
 
Join Date: Jan 2007
Posts: 95
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

What have you used Lynne?

I was just hoping there's an easier way to add the break, bold, etc. tags to the page.
Reply With Quote
  #521  
Old 03-30-2011, 09:43 PM
Lynne's Avatar
Lynne Lynne is offline
 
Join Date: Sep 2004
Location: California/Idaho
Posts: 41,180
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Quote:
Originally Posted by BF777 View Post
What have you used Lynne?

I was just hoping there's an easier way to add the break, bold, etc. tags to the page.
I do it by hand. I use a plain text editor (BBEdit) to write my php code and template code.
Reply With Quote
Reply


Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 10:38 AM.


Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2024, vBulletin Solutions Inc.
X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.05419 seconds
  • Memory Usage 2,393KB
  • Queries Executed 26 (?)
More Information
Template Usage:
  • (1)SHOWTHREAD
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (1)ad_showthread_beforeqr
  • (5)bbcode_code
  • (2)bbcode_html
  • (8)bbcode_quote
  • (1)footer
  • (1)forumjump
  • (1)forumrules
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (1)modsystem_article
  • (1)navbar
  • (4)navbar_link
  • (120)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (4)pagenav_pagelink
  • (4)pagenav_pagelinkrel
  • (11)post_thanks_box
  • (58)post_thanks_box_bit
  • (11)post_thanks_button
  • (1)post_thanks_javascript
  • (1)post_thanks_navbar_search
  • (1)post_thanks_postbit
  • (11)post_thanks_postbit_info
  • (10)postbit
  • (11)postbit_onlinestatus
  • (11)postbit_wrapper
  • (1)spacer_close
  • (1)spacer_open
  • (1)tagbit_wrapper 

Phrase Groups Available:
  • global
  • inlinemod
  • postbit
  • posting
  • reputationlevel
  • showthread
Included Files:
  • ./showthread.php
  • ./global.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/class_hook.php
  • ./includes/modsystem_functions.php
  • ./includes/functions_bigthree.php
  • ./includes/class_postbit.php
  • ./includes/class_bbcode.php
  • ./includes/functions_reputation.php
  • ./includes/functions_post_thanks.php 

Hooks Called:
  • init_startup
  • init_startup_session_setup_start
  • init_startup_session_setup_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • style_fetch
  • cache_templates
  • global_start
  • parse_templates
  • global_setup_complete
  • showthread_start
  • showthread_getinfo
  • forumjump
  • showthread_post_start
  • showthread_query_postids
  • showthread_query
  • bbcode_fetch_tags
  • bbcode_create
  • showthread_postbit_create
  • postbit_factory
  • postbit_display_start
  • post_thanks_function_post_thanks_off_start
  • post_thanks_function_post_thanks_off_end
  • post_thanks_function_fetch_thanks_start
  • fetch_musername
  • post_thanks_function_fetch_thanks_end
  • post_thanks_function_thanked_already_start
  • post_thanks_function_thanked_already_end
  • post_thanks_function_fetch_thanks_bit_start
  • post_thanks_function_show_thanks_date_start
  • post_thanks_function_show_thanks_date_end
  • post_thanks_function_fetch_thanks_bit_end
  • post_thanks_function_fetch_post_thanks_template_start
  • post_thanks_function_fetch_post_thanks_template_end
  • postbit_imicons
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • postbit_display_complete
  • post_thanks_function_can_thank_this_post_start
  • pagenav_page
  • pagenav_complete
  • tag_fetchbit_complete
  • forumrules
  • navbits
  • navbits_complete
  • showthread_complete