I run a NFL Football Forum at
GridironFans.com, and we pride ourselves in bringing all the latest NFL news to the members of our community. We have one forum where I post all the NFL news. The forum is closed to posting new threads to everyone except for a group called "NFL News Reporters". When this group posts news they are required to to enter topic tags for each story. We use the
Zoints Topic Tag Mod. People who use this modification should be used to this field:
On our site though the reporters are required to use pre-determined tags. How do they do this? By clicking on them from this field:
We use a custom code that replaces the default topic tagentry field with this pre-defined list. They click on the tags to select them and the tags are then added to each post. How did we pull this off? By using a custom code. I edited the "zointstags_tagform" template to this:
Code:
<br>
<!-- zoints tags field -->
<fieldset class="fieldset" style="margin:0px 0px 0px 0px">
<legend>You Must Click Once On The Applicable Topic Tags:</legend>
<div style="padding:$stylevar[formspacer]px">
<table cellpadding="0" cellspacing="$stylevar[cellspacing]" border="0" width="95%">
<tr>
<td><input type="hidden" class="bginput" id="tags" name="zointstags" value="$zointstags" size="40" tabindex="1" /></td>
</tr>
<tr>
<td><!-- BEGIN Topic Tags - TMO -->
<td width="100%" class="row1"><span class="gen">
<style type="text/css">
.selected { background-color: #7777FF; }
.unselected { background-color: transparent; }
#popularTags span { font-size: 11px; font-family: monospace; }
#popularTags {width: 100%;}
</style>
<script type="text/javascript">
Array.prototype.contains = function (ele) {
for (var i = 0; i < this.length; i++) {
if (this[i] == ele) {
return true;
}
}
return false;
};
Array.prototype.remove = function (ele) {
var arr = new Array();
var count = 0;
for (var i = 0; i < this.length; i++) {
if (this[i] != ele) {
arr[count] = this[i];
count++;
}
}
return arr;
};
window.onload = function () {
var taglist = document.getElementById('tags');
taglist.value = taglist.value.replace (/\s+/g,''); // strip space
var tags = taglist.value.split(',');
var populartags = document.getElementById('popularTags').getElementsByTagName('span');
for (var i = 0; i < populartags.length; i++) {
if (tags.contains(populartags[i].innerHTML)) {
populartags[i].className = 'selected';
}
}
}
function doTag(ele) {
var thisTag = ele.innerHTML;
var taglist = document.getElementById('tags');
var tags = taglist.value.split(',');
// If tag is already listed, remove it
if (tags.contains(thisTag)) {
tags = tags.remove(thisTag);
ele.className = 'unselected';
// Otherwise add it
} else {
tags.splice(tags.length-1, 0, thisTag);
ele.className = 'selected';
}
taglist.value = tags.join(',');
document.getElementById('tags').focus();
}
</script>
<table id="popularTags">
<tr>
<td colspan=4><span onclick="doTag(this)">afc</span></td>
<td colspan=4><span onclick="doTag(this)">nfc</span></td>
</tr>
<tr>
<td><span onclick="doTag(this)">afceast</span></td>
<td><span onclick="doTag(this)">afcnorth</span></td>
<td><span onclick="doTag(this)">afcsouth</span></td>
<td><span onclick="doTag(this)">afcwest</span></td>
<td><span onclick="doTag(this)">nfceast</span></td>
<td><span onclick="doTag(this)">nfcnorth</span></td>
<td><span onclick="doTag(this)">nfcsouth</span></td>
<td><span onclick="doTag(this)">nfcwest</span></td>
</tr>
<tr>
<td><span onclick="doTag(this)">bills</span></td>
<td><span onclick="doTag(this)">bengals</span></td>
<td><span onclick="doTag(this)">colts</span></td>
<td><span onclick="doTag(this)">broncos</span></td>
<td><span onclick="doTag(this)">cowboys</span></td>
<td><span onclick="doTag(this)">bears</span></td>
<td><span onclick="doTag(this)">buccaneers</span></td>
<td><span onclick="doTag(this)">49ers</span></td>
</tr>
<tr>
<td><span onclick="doTag(this)">dolphins</span></td>
<td><span onclick="doTag(this)">browns</span></td>
<td><span onclick="doTag(this)">jaguars</span></td>
<td><span onclick="doTag(this)">chargers</span></td>
<td><span onclick="doTag(this)">eagles</span></td>
<td><span onclick="doTag(this)">lions</span></td>
<td><span onclick="doTag(this)">falcons</span></td>
<td><span onclick="doTag(this)">cardinals</span></td>
</tr>
<tr>
<td><span onclick="doTag(this)">jets</span></td>
<td><span onclick="doTag(this)">ravens</span></td>
<td><span onclick="doTag(this)">texans</span></td>
<td><span onclick="doTag(this)">chiefs</span></td>
<td><span onclick="doTag(this)">giants</span></td>
<td><span onclick="doTag(this)">packers</span></td>
<td><span onclick="doTag(this)">panthers</span></td>
<td><span onclick="doTag(this)">rams</span></td>
</tr>
<tr>
<td><span onclick="doTag(this)">patriots</span></td>
<td><span onclick="doTag(this)">steelers</span></td>
<td><span onclick="doTag(this)">titans</span></td>
<td><span onclick="doTag(this)">raiders</span></td>
<td><span onclick="doTag(this)">redskins</span></td>
<td><span onclick="doTag(this)">vikings</span></td>
<td><span onclick="doTag(this)">saints</span></td>
<td><span onclick="doTag(this)">seahawks</span></td>
</tr>
<tr>
<td><span onclick="doTag(this)">nfl</span></td>
<td><span onclick="doTag(this)">draft</span></td>
<td><span onclick="doTag(this)">injury</span></td>
<td><span onclick="doTag(this)">legal</span></td>
<td><span onclick="doTag(this)">rumor</span></td>
<td><span onclick="doTag(this)">score</span></td>
<td><span onclick="doTag(this)">topstory</span></td>
<td><span onclick="doTag(this)">transaction</span></td>
</tr>
</table>
<br/>
<b>NOTE:</b> The 'nfl' tag is for league news only. You do not
have to tag everything with 'nfl'.
<!-- END Topic Tags - TMO --></td>
</tr>
</table></fieldset>
<!-- / zoints tags field -->
Now....once a story is posted they get grouped into the tags used. So say I want to check out the latest headlines for a particular team. On my site people can click on my custom navbar and choose the team, division, conference and other tags (League News, NFL Draft, Injury News, Legal News, NFL Rumors, Top Stories, Transactions, Scores). If I want to check out the latest headlines for the Bills I would click on
"Buffalo Bills" under the AFC menu and it brings up all the NFL news posted for the Bills.
To create your own pre-defined list of tags just edit the table and the text within. Some basic html knowledge will be needed for this.
I hope people found this post informative and helpful. I am greatful to the people at Zoints for their great modification. I wish I could give support for this but I am still learning about vbulletin myself and am not 'up to speed' with many of the coders here. Hopefully this helps people as a step in the right direction if this is a feature they'd like on their site.
Linear Mode
