Portal Software - WebTemplates 3.7.x: VB Integrated CMS (Content Management System)

(This hack is for vb version 3.7.x & 3.8.x ONLY. For vb 3.6.x, 3.5.x, 3.0.x and 2.x see my profile for relevant threads.)

"WebTemplates" is a vBulletin integrated Content Management System which allows you to create vb integrated "HTML" pages in your vb admin cp very easily. The pages can inherit your vbulletin skin/style, can recognize logged-in user, can be applied permissions per user or usergroup basis, can keep visit logs, hit counts and do many more.

VB4 version Update (9.9.2010): Please find 4.x version of WebTemplates4.x in its own thread.


WEBTEMPLATES 3.7.x BASIC FEATURES:

• Very Easy Installation : Webtemplates can be installed to your board without modifying even a single vbulletin file. It is coded as a vb product and can be imported very easily.
• Apply VB Permissions: You can ban any webtemplate to any user or usergroups easily. So for instance you can design a webtemplate which only members can see while guests can not, or only user A can not see etc.
• Page Counter : Each webtemplate has a built-in counter and you can display page count to your visitors and you can edit it or turn it OFF/ON per webtemplate basis.
• Visitor Logging&Tracking : You can track certain users' (by usergroup or userid) webtemplate visits to see who visited a webtemplate and when. This is configurable per webtemplate basis.
• Site Contributers (Editor) Support : You can grant editing permissions for certain users or usergroups for your webtemplates individually and they will be able to update these webtemplates using their own editor interface. vB's WYSIWYG editor is supported in Editor interface.
• Page Browsers & Who is Online Display: Webtemplates can display who is browsing that webtemplate while visitor is reading them (like default forum browse display of vbulletin). Webtemplate visits can also be monitored in who is online page.
• Header/Footer Inclusion : Webtemplates can automatically use headers/footers (your default vb header/footer or custom ones)
• Help Documents : The script comes with an extensive help document.
• Admin Panel in Webtemplates : Your webtemplates can include an "admin panel" displayed to only admins and by using them you can access many details and stats of your page while you are browsing them.
• SEO friendly URLs: You can make webtemplate URLs seo friendly in vb settings (Requires apache server).
• XML Import/Export : XML Import/Export feature allows you to backup your webtemplates and use other hack users webtemplates in your board.

ADVANCED FEATURES FOR ADVANCED USERS:

• Webquery Feature : With advanced "webquery" feature you can create dynamic webtemplates which include database query results. For instance you can easily add "last 10 threads forum X", "most active users list" etc. to your webtemplates with default webqueries that comes with installation or you can create your custom webqueries with basic SQL knowledge.
• Multi Parsing : Webtemplates can parse PHP or HTML or TEXT (=smilie/img tags/bbcode parsing like vb posts). This means you can design a page just like vb posts (TEXT parsing), standart HTML (HTML parsing) or even in PHP (PHP parsing).
• PHPINCLUDE per webtemplate : Every webtemplate has its own "phpinclude" field which you can run PHP codes before loading the Webtemplate
• Theme Support : Webtemplates support "themes" which are parent webtemplates which include child webtemplates in them. For instance if you have 20 similiar pages which uses the same visual look, you can make a single theme for all of them, then just insert their content into this theme. If you change theme later, all 20 pages' visual will change automatically.
• Conditionals : Webtemplates supports VB3 template conditionals so you can design webtemplates which change their display under different conditions.
• Default variables : You can use/display certain variables in your webtemplates like username of the visitor, visitor email address, last visit time, page creation time, page last edit time, Last visitor name, last visit time etc.

Sample WebTemplates from Sites using this hack:
(Some 3.5 and some are 3.0 versions but WebTemplate look and feel didn't change much so both will give you the idea.)

http://www.worldwideknights.com/view_mission.htm
http://www.theadminzone.com/forums/view.php?pg=aboutus
http://www.hystersisters.com/vb2/view_guidelines.htm
http://www.worldwideknights.com/view_info.htm
http://www.hystersisters.com/vb2/view_books.htm
http://www.worldwideknights.com/view_spread.htm
http://www3.fertilethoughts.com/forums/view.php?pg=acronyms
http://www.makeuptalk.com/forums/view.php?pg=makeuptalk-newsletter
http://www.bklab.com (entire site is designed with Webtemplates only)
(Actually this hack is one of the most popular vb hacks so it is used by hundreds -if not thousands- of vbulletin sites and you can easily find them if you go to google and search "Logician's WebTemplates" WITH quotation marks)

3.5 version Admin CP screenshot attached to this post. 3.0.x screenshots (here and here) also still applies for this version.

If you use the hack, clicking here will make sure you'll know about updates&bug fixes. It will also help me understand how many people is using the hack so please click the install button if you use it. Thank you..

About this 3.7.xx Version: This 3.7.xx version is same as previous 3.6.x version. 3.6.x version was already working in vbulletin 3.7.x except a few minor bugs and these bugs are fixed in this version to make it dedicated solely to vbulletin 3.7.x. Please see "what's new" in the next post for more details.

Version Updates:
29.July.2008 - > Version 3.7.00
* Hack 3.7.00 is released.

[i156]

Originally Posted by Logician

It should work fine inside a html webtemplate.

http://www.usacarry.com/forums/view.php?pg=florida_ccw

I got it working. I didn't have some needed files in the forums root. Thanks! This is a great mod and with this working I'll be off of Joomla by the end of the day!

[siddal]

Firstly,
I?m trying to make a page with the last 30 threads showing forum-thread-user-date and succeeded. Almost.
The problem arises when I click on the forum name rather than the specific thread and I get
directed to the same forum (forum id7) every time. I?ve read through the posts on many versions of the mod and find nothing that resembles this. I should be grateful for any ideas/help.

SELECT thread.threadid AS threadid, thread.title AS title, thread.postusername AS postusername, thread.postuserid AS postuserid, thread.dateline AS dateline, forum.title AS ftitle, thread.forumid
FROM " . TABLE_PREFIX . "thread thread LEFT JOIN " . TABLE_PREFIX . "forum forum ON thread.forumid= forum.forumid 
WHERE thread.sticky=0 AND thread.visible=1
ORDER BY dateline DESC
LIMIT 30

and lastl but not least: thank you Logician for this.
It?s so versatile and such a lot of fun to play around with.

[Logician]

Originally Posted by siddal

Firstly,
I?m trying to make a page with the last 30 threads showing forum-thread-user-date and succeeded. Almost.
The problem arises when I click on the forum name rather than the specific thread and I get
directed to the same forum (forum id7) every time. I?ve read through the posts on many versions of the mod and find nothing that resembles this. I should be grateful for any ideas/help.

SELECT thread.threadid AS threadid, thread.title AS title, thread.postusername AS postusername, thread.postuserid AS postuserid, thread.dateline AS dateline, forum.title AS ftitle, thread.forumid
FROM " . TABLE_PREFIX . "thread thread LEFT JOIN " . TABLE_PREFIX . "forum forum ON thread.forumid= forum.forumid 
WHERE thread.sticky=0 AND thread.visible=1
ORDER BY dateline DESC
LIMIT 30

and lastl but not least: thank you Logician for this.
It?s so versatile and such a lot of fun to play around with.

What's your query result row? If you use $WQfield[forumid] there, it should work fine.

[siddal]

Thank you for your quick reply, Logician.

<tr align="center"> 
 <td class="$alternate" align="left" WIDTH="25%" VALIGN="TOP"><div class="normalfont"><a href='forumdisplay.php?$session[sessionurl]t=$WQfield[forumid]'>$WQfield[ftitle]</a></div></td>
 <td class="$alternate" align="left"  WIDTH="50%" VALIGN="TOP"><div class="normalfont"><a href='showthread.php?$session[sessionurl]t=$WQfield[threadid]'>$WQfield[title]</a></div></td>
 <td class="$alternate" WIDTH="10%" VALIGN="TOP"><div class="normalfont"><a href='member.php?$session[sessionurl]u=$WQfield[postuserid]'>$WQfield[postusername]</a></div></td>
 <td class="$alternate" WIDTH="15%" VALIGN="TOP"><div style="font-size: 8pt; line-height: 10px;">$WQfield[dateline]</div></td>
</tr>

This is my query result row showing the $WQfield[forumid] but still I?m being directed to the same forum whichever forum I click on..

Interestingly, when I click a forum from the forum/index.php page I get this:
http://mysite/forum/forumdisplay.php?f=6

but when I click the same forum from the query page I get this:
http://mysite/forum/forumdisplay.php?t=6

Only the tiniest difference but enough to fool me, I?m afraid.

[Logician]

Originally Posted by siddal

Thank you for your quick reply, Logician.

<tr align="center"> 
 <td class="$alternate" align="left" WIDTH="25%" VALIGN="TOP"><div class="normalfont"><a href='forumdisplay.php?$session[sessionurl]t=$WQfield[forumid]'>$WQfield[ftitle]</a></div></td>
 <td class="$alternate" align="left"  WIDTH="50%" VALIGN="TOP"><div class="normalfont"><a href='showthread.php?$session[sessionurl]t=$WQfield[threadid]'>$WQfield[title]</a></div></td>
 <td class="$alternate" WIDTH="10%" VALIGN="TOP"><div class="normalfont"><a href='member.php?$session[sessionurl]u=$WQfield[postuserid]'>$WQfield[postusername]</a></div></td>
 <td class="$alternate" WIDTH="15%" VALIGN="TOP"><div style="font-size: 8pt; line-height: 10px;">$WQfield[dateline]</div></td>
</tr>

This is my query result row showing the $WQfield[forumid] but still I?m being directed to the same forum whichever forum I click on..

Interestingly, when I click a forum from the forum/index.php page I get this:
http://mysite/forum/forumdisplay.php?f=6

but when I click the same forum from the query page I get this:
http://mysite/forum/forumdisplay.php?t=6

Only the tiniest difference but enough to fool me, I?m afraid.

Actually you already found why: forumdisplay.php should take f parameter, not t parameter, so if you fix this in your query you are good to go:

<a href='forumdisplay.php?$session[sessionurl]f=$WQfield[forumid]'>$WQfield[ftitle]</a>

[siddal]

Fixed!
Thank you Logician for your prompt help and this terrific piece of work.
I?ve sent a small donation via the template in my acp.

[ArnyVee]

Edited: Thanks Logician!

[Logician]

Originally Posted by ArnyVee

Logician (or anyone else that might know),

I just started playing with the web templates and decided to take a free template from the web, get the html and paste it into the admin description field for this mod. It doesn't show up correctly though at this point.

Here's what I entered....

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Site Name: Page Title</title>
<meta http-equiv="content-language" content="en" />
<meta name="Keywords" content="your,keywords,here" />
<meta name="Description" content="Your short description here" />
<meta http-equiv="pragma" content="no-cache" />
<meta name="robots" content="index,follow" />
<meta name="rating" content="general" />
<meta name="author" content="you@you.com" />
<meta name="copyright" content="Copyright ? 2006" />
<link href="images/favicon.gif" rel="SHORTCUT ICON" />
<link rel="alternate" type="application/rss+xml" title="Feed Title" href="rss.xml" />
<style type="text/css">
body {margin:0; padding:0; text-align:left; font-size:12px; font-family:Arial, Helvetica, sans-serif; background:#333; color:#fff;}
table {width:100%; height:100%;}
#lcol img, #ccol img, #rcol img {margin:2px; float:right;}
h1,h2,h3,h4,h5,h6 {padding:0;margin:2px; font-family:Verdana,Arial,Helvetica,sans-serif}
h1 {font-size:1.75em; border-bottom:1px dotted #009900;}
h2 {font-size:1.5em; border-bottom:1px dotted #009900;}
h3 {font-size:1.25em; border-bottom:1px dotted #009900;}
ul {margin:0;padding-left:12px;list-style:square;color:#009900}
li {margin:2px 0 2px 10px}
a {background:inherit; color:#009900; text-decoration:none; font-weight:bold;}
a:hover {background:inherit; color:#00FF00; text-decoration:none; border-bottom:1px solid #00FF00; font-weight:bold;}
#wrapper {border:2px solid #009900;}
#lborder {width:14px; background-image:url(images/lborder.jpg); background-repeat:repeat-y;}
#navbar, #footer {background:inherit; color:#009900; padding:5px; background-image:url(images/hfbak.jpg); background-repeat:repeat-x; background-position:top center;}
#navlinks {text-align:left; float:left; width:75%;}
#search {text-align:right; width:25%; float:right;}
#logo, #hdeco {border-bottom:1px solid #777; border-top:1px solid #999; height:150px; background-image:url(images/headbak.jpg); background-repeat:repeat-x;}
#logo {text-align:left;}
#hdeco {text-align:right;}
#main {border-left:2px solid #009900; border-right:2px solid #009900; background:#000;}
#lcol, #ccol, #rcol {width:33%; background-image:url(images/cback.jpg); background-repeat:no-repeat; background-position:bottom right; padding:5px; background-color:#333;}
/* If you want to add a background hover effect to the left, center and right columns, uncomment the following line */
/* #lcol:hover, #ccol:hover, #rcol:hover {width:33%; background-image:url(images/cbackhover.jpg); background-repeat:no-repeat; background-position:bottom right; padding:5px; background-color:#5C5C5C;}*/
#footer {text-align:center; border-top:1px solid #999; background-color:inherit; color:#999999;}
#rborder {width:14px; background-image:url(images/rborder.jpg); background-repeat:repeat-y;}
</style>
</head>
<body>
<table cellpadding="0" cellspacing="0" id="wrapper" summary="Creates the background effects">
  <tr>
    <td id="lborder"></td>
    <td id="main"><table cellpadding="0" cellspacing="0" summary="Main body effects">
        <tr>
          <td colspan="3" id="navbar"><div id="navlinks"><a href="#">Your Link</a>&nbsp;|&nbsp;<a href="#">Your Link</a>&nbsp;|&nbsp;<a href="#">Your Link</a>&nbsp;|&nbsp;<a href="#">Your Link</a>&nbsp;|&nbsp;<a href="#">Your Link</a>&nbsp;|&nbsp;<a href="#">Your Link</a>&nbsp;|&nbsp;<a href="#">Your Link</a>&nbsp;|&nbsp;<a href="#">Your Link</a>&nbsp;|&nbsp;<a href="#">Your Link</a></div>
            <div id="search">
              <form style="margin: 0px;" action="/search.php" method="get">
                <input type="text" name="query" size="14" />
                <input type="hidden" name="action" value="results" />
                <input type="submit" value="Search" />
              </form>
            </div></td>
        </tr>
        <tr>
          <td id="logo" colspan="2"><img src="images/logo.jpg" alt="" /></td>
          <td id="hdeco"><img src="images/headr.jpg" alt="" /></td>
        </tr>
        <tr>
          <td colspan="3"><table width="100%" cellpadding="5" cellspacing="5" summary="Main content layout">
              <tr>
                <td id="lcol"><h1>The WDBoards</h1><img src="images/yourimage.jpg" alt="" />Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper <a href="#">suscipit</a> lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio <a href="#">dignissim</a> qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.<h2>Sub-Section Title</h2><ul><li>Bullet List Item 1</li><li><a href="#">Bullet List Item 2</a></li>
                <li>Bullet List Item 3</li><li><a href="#">Bullet List Item 5</a></li>
                <li>Bullet List Item 6</li><li><a href="#">Bullet List Item 7</a></li>
                <li>Bullet List Item 8</li><li><a href="#">Bullet List Item 9</a></li>
                <li>Bullet List Item 10</li></ul></td>
                <td id="ccol"><h1>The WDBuddies</h1><img src="images/yourimage.jpg" alt="" />Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper <a href="#">suscipit</a> lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio <a href="#">dignissim</a> qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.<h2>Sub-Section Title</h2><ul><li>Bullet List Item 1</li><li><a href="#">Bullet List Item 2</a></li>
                <li>Bullet List Item 3</li><li><a href="#">Bullet List Item 5</a></li>
                <li>Bullet List Item 6</li><li><a href="#">Bullet List Item 7</a></li>
                <li>Bullet List Item 8</li><li><a href="#">Bullet List Item 9</a></li>
                <li>Bullet List Item 10</li></ul></td>
                <td id="rcol"><h1>WDBroadcasts</h1><img src="images/yourimage.jpg" alt="" />Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper <a href="#">suscipit</a> lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio <a href="#">dignissim</a> qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.<h2>Sub-Section Title</h2><ul><li>Bullet List Item 1</li><li><a href="#">Bullet List Item 2</a></li>
                <li>Bullet List Item 3</li><li><a href="#">WDBRadio 5</a></li>
                <li>Bullet List Item 6</li><li><a href="#">WDBPodcast 7</a></li>
                <li>Bullet List Item 8</li><li><a href="#">Bullet List Item 9</a></li>
                <li>Bullet List Item 10</li></ul></td>
            </table></td>
        </tr>
        <tr>
          <td id="footer" colspan="3">Copyright &copy; 2008 W.D.B. Enterprises LLC | All Rights Reserved | Design by: <a href="http://www.waltdisneyboards.com/" target="_blank" title="AV">AV</a></td>
        </tr>
      </table></td>
    <td id="rborder"></td>
  </tr>
</table>
</body>
</html>
<!-- 
Design by AV: http://www.waltdisneyboards.com/
-->

Here's how it shows.... http://www.waltdisneyboards.com/view.php?pg=wdbhub and the attachment is how it should show.

Seems to have a huge space at the top (is this because a graphic is missing or am I doing something wrong?) and things shifted around just a bit.

Can anyone lend a hand to see if what I can do to fix it?

Thanks!

If you make it a "standalone" webtemplate which does NOT use a theme, it will show up fine but without your vb header/footer. (Also remember to make image URLs full urls or move images to your server otherwise images will be broken as source code can't find them in your server).

If you want to insert it inside a webtemplate theme which will display it between your header/footer you can't paste it as it is, you have to edit it to fit to your style. (which should require HTML knowledge).

[ArnyVee]

Logician, how do I make it a 'standalone' webtemplate?

Edited: I guess I would simply select "no parent template", is that right?

I was originally going to keep some elements of the forums, but I think for this particular one, I just want to use a full template that I find.

[Logician]

Originally Posted by ArnyVee

Logician, how do I make it a 'standalone' webtemplate?

Edited: I guess I would simply select "no parent template", is that right?

right