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
  #372  
Old 09-05-2010, 08:50 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 Guitar Guy View Post
Hello,

First off, I just want to say that this is a top-notch guide, in my opinion.

I just have a quick question:
How do I add dividers to sections? Is it in the template? Or the PHP page? What's the code?
Also, How do I add the shadow effect behind the whole box?
What your output looks like is in the html, so it is in the template. Usually users use CSS to put a border around a div. The shadow is also just CSS that you would apply to the div:

HTML Code:
div.yourclass {
border:5px solid red;
-moz-box-shadow:-2px 2px 2px #C8C8C8;
-webkit-box-shadow:-2px 2px 2px #C8C8C8;
}
Reply With Quote
  #373  
Old 09-06-2010, 03:01 AM
Guitar Guy Guitar Guy is offline
 
Join Date: Feb 2010
Posts: 7
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Thank you for the response, but it's not entirely what I'm asking.

What I'm trying to do is basically divide this page:




into sections that look like pieces from the "What's Going On" box:




Here is the code that I currently have for the page:

PHP 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}


    <
STYLE TYPE="text/css">
    <!--
    
{text-indent30pt;}
    -->
    </
STYLE>

  </
head>
  <
body>

    {
vb:raw header}
    
    {
vb:raw navbar}
    
    <
div id="pagetitle">
    <
h1>{vb:raw pagetitle}</h1>
    </
div>
    
    <
br />
    <
div class="block">
        <
center><h2 class="blockhead">What information do we collect?</h2></center>
        <
div class="blockbody">
            <
div class="blockrow restore"><br />
            <
p>We collect information from you when you register on our siteWhen ordering or registering on our site, as appropriateyou may be asked to enter youre-mail addressYou mayhowevervisit our site anonymously.</p>
            </
div>
        </
div>
    </
div>

    <
br />

    <
div class="block">
        <
center><h2 class="blockhead">Why do we collect this information?</h2></center>
        <
div class="blockbody">
            <
div class="blockrow restore"><br />
            <
ul>
                <
li>To personalize your experience (your information helps us to better respond to your individual needs);</li><br />

                <
li>To improve our website (we continually strive to improve our website offerings based on the information and feedback we receive from you);</li><br />

                <
li>To improve customer service (your information helps us to more effectively respond to your customer service requests and support needs);</li><br />

                <
li>To process transactionsyour informationwhether public or private, <em>will not be soldexchangedtransferred, or given to any other company for any reason whatsoeverwithout your consentother than for the express purpose of delivering the purchased product or service requested.</em></li><br />

                <
li>To send periodic emailsthe email address you provide for order processingwill <em>only</embe used to send you information and updates pertaining to your order.</li>
            </
ul>
            </
div>
        </
div>
    </
div>

    <
br />

    <
div class="block">
        <
center><h2 class="blockhead">How do we protect your information?</h2></center>
        <
div class="blockbody">
            <
div class="blockrow restore"><br />
            <
p>We implement a variety of security measures to maintain the safety of your personal information when you place an order or entersubmit, or access your personal informationWe offer the use of a secure serverAll supplied sensitive/credit information is transmitted via Secure Socket Layer (SSLtechnology and then encrypted into our Payment gateway providers database only to be accessible by those authorized with special access rights to such systems, and are required to?keep the information confidentialAfter a transactionyour private information (credit cardssocial security numbersfinancialsetc.) will not be stored on our servers.</p>
            </
div>
        </
div>
    </
div>

    <
br />

    <
div class="block">
        <
center><h2 class="blockhead">Do we use cookies?</h2></center>
        <
div class="blockbody">
            <
div class="blockrow restore"><br />
            <
p>Yes (Cookies are small files that a site or its service provider transfers to your computers hard drive through your Web browser (if you allowthat enables the sites or service providers systems to recognize your browser and capture and remember certain information). We use cookies to understand and save your preferences for future visits and keep track of advertisements.</p>
            </
div>
        </
div>
    </
div>

    <
br />

    <
div class="block">
        <
center><h2 class="blockhead">Do we disclose any information to outside parties?</h2></center>
        <
div class="blockbody">
            <
div class="blockrow restore"><br />
            <
p>We do not selltrade, or otherwise transfer to outside parties your personally identifiable informationThis does not include trusted third parties who assist us in operating our websiteconducting our business, or servicing youso long as those parties agree to keep this information confidentialWe may also release your information when we believe release is appropriate to comply with the lawenforce our site policies, or protect ours or others rightsproperty, or safetyHowevernon-personally identifiable visitor information may be provided to other parties for marketingadvertising, or other uses.</p>
            </
div>
        </
div>
    </
div>

    <
br />

    <
div class="block">
        <
center><h2 class="blockhead">Third party links</h2></center>
        <
div class="blockbody">
            <
div class="blockrow restore"><br />
            <
p>Occasionallyat our discretionwe may include or offer third party products or services on our websiteThese third party sites have separate and independent privacy policiesWe therefore have no responsibility or liability for the content and activities of these linked sitesNonethelesswe seek to protect the integrity of our site and welcome any feedback about these sites.</p>
            </
div>
        </
div>
    </
div>

    <
br />

    <
div class="block">
        <
center><h2 class="blockhead">California Online Privacy Protection Act Compliance</h2></center>
        <
div class="blockbody">
            <
div class="blockrow restore"><br />
            <
p>Because we value your privacy we have taken the necessary precautions to be in compliance with the California Online Privacy Protection ActWe therefore will not distribute your personal information to outside parties without your consent. As part of the California Online Privacy Protection Actall users of our site may make any changes to their information at anytime by logging into their control panel and going to the 'Settings' page.</p>
            </
div>
        </
div>
    </
div>

    <
br />

    <
div class="block">
        <
center><h2 class="blockhead">Childrens Online Privacy Protection Act Compliance</h2></center>
        <
div class="blockbody">
            <
div class="blockrow restore"><br />
            <
p>We are in compliance with the requirements of COPPA (Childrens Online Privacy Protection Act), we do not collect any information from anyone under 13 years of ageOur websiteproducts and services are all directed to people who are at least 13 years old or older.</p>
            </
div>
        </
div>
    </
div>

    <
br />

    <
div class="block">
        <
center><h2 class="blockhead">Your Consent and Policy Changes</h2></center>
        <
div class="blockbody">
            <
div class="blockrow restore"><br />
            <
p>By using our siteyou consent to our web site privacy policy. If we decide to change our privacy policywe will update the Privacy Policy modification date below. If you have any questions regarding this policyplease either ask in the <a href="http://www.defeatthesystem.com/forum.php";>forum</a> or <a href="mailto:support@defeatthesystem.com">Email Support</a>.</p>
            </
div>
        </
div>
    </
div>
<
br /><br /><br /><span></span><span></span><center><div style='font-size:7pt; font-family:Arial; color:gray; text-decoration:none;'>This policy was last modified on August 182010<span></span><span></span><span></span>
<
br /><span></span><span></span><div style='font-size:7pt; font-family:Arial; color:gray; text-decoration:none;'>Please also visit our Terms of Service section establishing the use, disclaimers, and limitations of liability governing the use of our website <a style='color:#3C3C3C; text-decoration:none;' href='http://www.defeatthesystem.com/terms.php'>Here</a></center></div><span></span><span></span><span></span></div><center>

    {
vb:raw footer}
  </
body>
</
html
I basically want to have pieces like the "What information do we collect?" and "Why do we collect this information?" in that box, etc, etc

Thank you in advance for your help.

Regards,
Guitar Guy
Reply With Quote
  #374  
Old 09-06-2010, 03:35 AM
Lynne's Avatar
Lynne Lynne is offline
 
Join Date: Sep 2004
Location: California/Idaho
Posts: 41,180
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

If you want to make your page look more like the other section, then you need to use the same sort of CSS for your page.
Reply With Quote
  #375  
Old 09-06-2010, 10:26 AM
Dusty Miller Dusty Miller is offline
 
Join Date: Jan 2006
Posts: 22
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Is there a way of adding php scripts in a custom page. I am trying to add a form in which people can add search their details and I want to query an external database...

Where should the php code be inserted..

I want to user the vBulletin wrapper to control users, usergroup levels etc.
Reply With Quote
  #376  
Old 09-06-2010, 01:48 PM
Lynne's Avatar
Lynne Lynne is offline
 
Join Date: Sep 2004
Location: California/Idaho
Posts: 41,180
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

You can insert the php code anywhere under where it says Main Script and before your template is being rendered.
Reply With Quote
  #377  
Old 09-07-2010, 11:14 PM
Bill_Reilly Bill_Reilly is offline
 
Join Date: Mar 2010
Posts: 4
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

noob question, sorry... if I want to place a little javascript on my page(basically a calculator) where do I place the code that would normally go within the head tags?
Reply With Quote
  #378  
Old 09-08-2010, 12:38 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 Bill_Reilly View Post
noob question, sorry... if I want to place a little javascript on my page(basically a calculator) where do I place the code that would normally go within the head tags?
Within the head tags of your template.
Reply With Quote
  #379  
Old 09-08-2010, 02:55 AM
Bill_Reilly Bill_Reilly is offline
 
Join Date: Mar 2010
Posts: 4
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

well yea. That gives me errors, which is why I asked. I had it as an shtml page already, so I'm just attempting to copy and paste working code.......

Warning: Invalid argument supplied for foreach() in [path]/includes/functions.php on line 3332

vBulletin Message
The following error occurred when attempting to evaluate this template:
%1$s
This is likely caused by a malformed conditional statement. It is highly recommended that you fix this error before continuing, but you may continue as-is if you wish.
Reply With Quote
  #380  
Old 09-08-2010, 03:17 AM
Lynne's Avatar
Lynne Lynne is offline
 
Join Date: Sep 2004
Location: California/Idaho
Posts: 41,180
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

You may want to try putting <vb:literal> tags around the javascript and see if that works. If it still doesn't, you may want to start a thread in the general discussions area and ask for help with your code.
Reply With Quote
  #381  
Old 09-08-2010, 03:22 AM
Bill_Reilly Bill_Reilly is offline
 
Join Date: Mar 2010
Posts: 4
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Putting those around the header portion of the code worked. Thank you
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 02:30 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.06249 seconds
  • Memory Usage 2,462KB
  • 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
  • (3)bbcode_code
  • (2)bbcode_html
  • (1)bbcode_php
  • (2)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
  • (3)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