• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

XenCarta Template Repository

Moses

Well-known member
#21
Titles
This code works to section your wiki articles nicely, and also provides anchor text compatible with the Quick Links template (in the next post).

Note: The colours are hard coded in these templates, edit them...

Template Name: title
Template Code:
Code:
<a name="{{{heading}}}"><div class="subHeading" style="text-shadow: 0 0 0 transparent, 0 1px 1px #094603;">{{{heading}}}</div></a>
Template Example:
Code:
[template=title2]heading = Rebels[/template]
Template Name: title2
Template Code:
Code:
<a name="{{{heading}}}"><div class="subHeading2">{{{heading}}}</div></a>
Template Example:
Code:
[template=title2]heading = Rebels[/template]

Example:
http://www.greenandgoldrugby.com/community/wiki/injury-suspension-list/

Screenshot:
title.png
 

Moses

Well-known member
#22
Quick Links
These work in conjunction with the title tags from the previous post.

Note: Colours are hard coded, you'll need to edit these.


Template Name: quicklinks-top

Template Code:
Code:
<ul class="quicklinks">
Template Name: quicklinks-row

Template Code:
Code:
<script type="text/javascript"><!--
document.write("<li><a href=\"" + document.location + "#{{{anchor}}}\">{{{text}}}</a></li>");
--></script>
Template Name: quicklinks-row-url

Template Code:
Code:
<li><a href="{{{url}}}" title="{{{text}}}">{{{text}}}</a></li>

Template Name: quicklinks-row-url-gold

Template Code:
Code:
<li><a href="{{{url}}}" title="{{{text}}}" class="gold">{{{text}}}</a></li>
CSS:
Add the following CSS to your extra.css template. Note some colours are hard coded.
Code:
.gold {
background: #E9E375 !important;
color: #094603 !important;
text-shadow: none !important;
font-weight: 800 !important;
}
 
.gold:hover {
background: #FBBD2B !important;
}
 
.quicklinks {
margin: 5px 0;4
}
 
.quicklinks li {
display: inline;
margin: 0 !important;
}
 
.quicklinks li a {
background: @primaryLightish url('styles/default/xenforo/gradients/navigation-tab.png') repeat-x top;
font-size: 11px;
color: white;
padding: 2px 10px;
text-shadow: 0 0 0 transparent, 0 1px 1px #23631C;
line-height: 19px;
border: 1px solid @primaryMedium;
border-radius: 10px;
}
 
.quicklinks li a:hover {
background: #23631c;
color: #e9e375;
text-decoration: none;
}


Template Example:
Code:
[template=title]heading = Quick Links[/template]
[template=quicklinks-top][/template]
[template=quicklinks-row-url-gold]url = [plain]http://www.greenandgoldrugby.com/community/threads/2012-super-rugby-injury-list.10262/[/plain]| text = Discussion Thread[/template]
[template=quicklinks-end][/template]
[template=quicklinks-top][/template]
[template=quicklinks-row]anchor = Brumbies| text = Brumbies[/template]
[template=quicklinks-row]anchor = Rebels| text = Rebels[/template]
[template=quicklinks-row]anchor = Reds| text = Reds[/template]
[template=quicklinks-row]anchor = Waratahs| text = Waratahs[/template]
[template=quicklinks-row]anchor = Western Force| text = Western Force[/template]
[template=quicklinks-end][/template]
[template=quicklinks-top][/template]
[template=quicklinks-row]anchor = Blues| text = Blues[/template]
[template=quicklinks-row]anchor = Chiefs| text = Chiefs[/template]
[template=quicklinks-row]anchor = Crusaders| text = Crusaders[/template]
[template=quicklinks-row]anchor = Highlanders| text = Highlanders[/template]
[template=quicklinks-row]anchor = Hurricanes| text = Hurricanes[/template]
[template=quicklinks-end][/template]
[template=quicklinks-top][/template]
[template=quicklinks-row]anchor = Bulls| text = Bulls[/template]
[template=quicklinks-row]anchor = Cheetahs| text = Cheetahs[/template]
[template=quicklinks-row]anchor = Lions| text = Lions[/template]
[template=quicklinks-row]anchor = Sharks| text = Sharks[/template]
[template=quicklinks-row]anchor = Stormers| text = Stormers[/template]
[template=quicklinks-end][/template]
Screenshot:
Quick Links.png

Live Example:
Rugby Injuries
 

Jaxel

Well-known member
#23
In case you guys are wondering... my index templates are very different now...

TEMPLATE EXAMPLE: Wiki Index: (BB Code)
http://8wayrun.com/wiki/index/
Code:
[template=iconSTR] title=Main Characters [/template]
[template=iconROW] name=a Patroklos | slug=alpha-patroklos [/template]
[template=iconROW] name=Abyss | slug=abyss [/template]
[template=iconROW] name=Aeon | slug=aeon [/template]
[template=iconEND] [/template]

TEMPLATE NAME: iconSTR
Code:
<div class="iconList">
    <div class="subHeading"><b>{{{title}}}</b></div>
    <ul>
TEMPLATE NAME: iconEND
Code:
</ul>
</div>
TEMPLATE NAME: iconROW
Code:
<li>
    <div class="iconBlock">
        <div><a href="wiki/{{{slug}}}/"><img src="images/{{{slug}}}.jpg" border="0" style="max-width: 100%;" alt="{{{name}}}" /></a></div>
        <div class="secondaryContent"><a href="wiki/{{{slug}}}/"><b>{{{name}}}</b></a></div>
    </div>
</li>
TEMPLATE CSS:
Code:
Built into next version of XenCarta...
 

Jaxel

Well-known member
#25
Next version is coming sometime this week... will include the following changes as well:
  • The ability to delete entries in the history list
  • The ability to revert to older entries in the history list
  • Timespan checking... If while you are editing a page, someone else edits the page first, it will give an error telling you so.
  • Quick edit checking... If you edit a page, and within 15 minutes you edit it again, it won't post a new entry in the history list, and will not get posted to the various news feeds.
 
#29
Thanks for sharing the code below. I've just gone to use it, and it works, but doesn't float right. It fills the whole page. I added the css to EXTRA.css, is that correct?


Biography Block
This is a collection of templates that I'm using to float a Rugby Players' Biographical details to the right of a wiki entry. It'll obviously need a substantial amount of editing to be useful in other wikis, but hopefully this will get the creative juices flowing.


Template Name: player-top
Code:
<table class="player-table" >
        <tr>
                <td colspan="2" class="player-heading"><b>{{{name}}}</b></td>
        </tr>
        <tr>
                <td colspan="2" class="player-picture">
<div style="padding: 10px;">
<a href="http://cdn.greenandgoldrugby.com/804F73/gagr/up/wikiimages/{{{image}}}.jpg" target="_blank" class="LbTrigger" data-href="misc/lightbox"><img src="http://cdn.greenandgoldrugby.com/804F73/gagr/up/wikiimages/{{{image}}}-300.jpg" alt="gene-fairbanks-navy.jpg" class="bbCodeImage LbImage" style="max-height: 200px;"></a>
<p>{{{caption}}}</p>
</div>
</td>
        </tr>
Template Name: player-bio
Code:
<tr>
                <td colspan="2" class="player-heading"><b>Biography</b></td>
        </tr>
        <tr>
                <td class="player-primary"><b>Nickname</b></td>
                <td class="player-primary">{{{nickname}}}</td>
        </tr>
        <tr>
                <td class="player-secondary"><b>Birthplace</b></td>
                <td class="player-secondary">{{{bplace}}}</td>
        </tr>
        <tr>
                <td class="player-primary"><b>Date of Birth</b></td>
                <td class="player-primary">{{{dob}}}</td>
        </tr>
        <tr>
                <td class="player-secondary"><b>Age</b></td>
                <td class="player-secondary"><script type="text/javascript">
var now = new Date();
var today = new Date(now.getYear(),now.getMonth(),now.getDate());
var yearNow = now.getYear();
var monthNow = now.getMonth();
var dateNow = now.getDate();
 
var datestring = {{{dob_yyyymmdd}}} + '';
var dob = new Date(datestring.substring(0,4), datestring.substring(4,6)-1, datestring.substring(6,8));
var yearDob = dob.getYear();
 
yearAge = yearNow - yearDob;
var monthDob = dob.getMonth();
 
if (monthNow >= monthDob) var monthAge = monthNow - monthDob; else { yearAge--;
var monthAge = 12 + monthNow -monthDob; };
if (monthAge > 1) var monthDisplay = ' Months Old'; else { var monthDisplay = ' Month Old' };
 
document.write (yearAge + ' Years, ' + monthAge + monthDisplay);
</script></td>
        </tr>
        <tr>
                <td class="player-primary"><b>Height</b></td>
                <td class="player-primary">{{{height}}}</td>
        </tr>
        <tr>
                <td class="player-secondary"><b>Weight</b></td>
                <td class="player-secondary">{{{weight}}}</td>
        </tr>
        <tr>
                <td class="player-primary"><b>Position</b></td>
                <td class="player-primary">{{{position}}}</td>
        </tr>
        <tr>
                <td class="player-secondary"><b>School</b></td>
                <td class="player-secondary">{{{school}}}</td>
        </tr>
Template Name: player-career
Code:
<tr>
                <td colspan="2" class="player-heading"><b>{{{career}}} Career</b></td>
        </tr>
        <tr>
                <td class="player-primary">{{{team}}}</td>
                <td class="player-primary">{{{years}}}</td>
        </tr>
Template Name: player-tweets
Code:
<tr>
                <td colspan="2" class="player-heading"><b>On Twitter</b></td>
        </tr>
        <tr>
                <td colspan="2"><div style="padding: 5px;"><script src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
  version: 2,
  type: 'search',
  search: 'from:@{{{TwitterName}}}',
  interval: 30000,
  title: '',
  subject: '',
  width: 290,
  height: 250,
  theme: {
    shell: {
      background: '#23631c',
      color: '#f9cf6d'
    },
    tweets: {
      background: '#ffffff',
      color: '#91ac75',
      links: '#094603'
    }
  },
  features: {
    scrollbar: true,
    loop: false,
    live: true,
    behavior: 'all'
  }
}).render().start();
</script></div></td>
        </tr>
Template Name: table-end
Code:
</tbody></table>
CSS:
Code:
.player-table {
float: right;
margin: 0px 0px 5px 10px;
width: 300px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border: 1px solid @primaryMedium;
}
 
.player-primary { line-height: 160%; background: @contentBackground;}
 
.player-secondary { line-height: 160%; background: @primaryLightest;}
 
.player-heading {
font-weight: bold;
font-size: 12pt;
text-shadow: 0 0 0 transparent, 0 1px 1px #23631C;
color: @secondaryLighter;
background: @primaryMedium url('styles/default/xenforo/gradients/category-23px-light.png') repeat-x top;
padding: 1px 0;
margin: 3px auto 5px;
}
 
.player-picture {background: @secondaryLightest;}

Template Usage:
The three templates provide the flexibility I need with players having different bio requirements. Many have Club, Domestic and International careers, others just Club. Some don't have twitter so I don't use the player-tweets template.

Example:
Code:
[template=player-top]
| name = James Horwill
| image = reds/james-horwill
| caption = Pretty in Pink[/template]
[template=player-bio]| nickname = Big Kev
| bplace = Warwick
| dob = 29th May, 1985
| dob_yyyymmdd = 19820727
| school = Brisbane Boys College
| height = 2.00m
| weight = 117kg
| position = Lock[/template]
[template=player-career]| career = Club| team = Queensland University
| years = 2010 - present
[/template]
[template=player-career]| career = Province| team = Queensland Reds
| years = 2006 - present
[/template]
[template=player-career]| career = International| team = Australia
| years = 2007 - present
[/template]
[template=player-tweets]TwitterName = jhorwill[/template]
[template=table-end][/template]
Screenshot:
View attachment 23416
 
#30
In case you guys are wondering... my index templates are very different now...

TEMPLATE EXAMPLE: Wiki Index: (BB Code)
http://8wayrun.com/wiki/index/
Code:
[template=iconSTR] title=Main Characters [/template]
[template=iconROW] name=a Patroklos | slug=alpha-patroklos [/template]
[template=iconROW] name=Abyss | slug=abyss [/template]
[template=iconROW] name=Aeon | slug=aeon [/template]
[template=iconEND] [/template]

TEMPLATE NAME: iconSTR
Code:
<div class="iconList">
    <div class="subHeading"><b>{{{title}}}</b></div>
    <ul>
TEMPLATE NAME: iconEND
Code:
</ul>
</div>
TEMPLATE NAME: iconROW
Code:
<li>
    <div class="iconBlock">
        <div><a href="wiki/{{{slug}}}/"><img src="images/{{{slug}}}.jpg" border="0" style="max-width: 100%;" alt="{{{name}}}" /></a></div>
        <div class="secondaryContent"><a href="wiki/{{{slug}}}/"><b>{{{name}}}</b></a></div>
    </div>
</li>
TEMPLATE CSS:
Code:
Built into next version of XenCarta...

I realize this is a little old....but its still a great add-on
Would it be possible to get your individual character templates? (Charts, picture, placing ect)


Thank you for this amazing add-on :)
 
#33
In case you guys are wondering... my index templates are very different now...

TEMPLATE EXAMPLE: Wiki Index: (BB Code)
http://8wayrun.com/wiki/index/
Code:
[template=iconSTR] title=Main Characters [/template]
[template=iconROW] name=a Patroklos | slug=alpha-patroklos [/template]
[template=iconROW] name=Abyss | slug=abyss [/template]
[template=iconROW] name=Aeon | slug=aeon [/template]
[template=iconEND] [/template]

TEMPLATE NAME: iconSTR
Code:
<div class="iconList">
    <div class="subHeading"><b>{{{title}}}</b></div>
    <ul>
TEMPLATE NAME: iconEND
Code:
</ul>
</div>
TEMPLATE NAME: iconROW
Code:
<li>
    <div class="iconBlock">
        <div><a href="wiki/{{{slug}}}/"><img src="images/{{{slug}}}.jpg" border="0" style="max-width: 100%;" alt="{{{name}}}" /></a></div>
        <div class="secondaryContent"><a href="wiki/{{{slug}}}/"><b>{{{name}}}</b></a></div>
    </div>
</li>
TEMPLATE CSS:
Code:
Built into next version of XenCarta...
Do you mind posting your new templates and there usage?
http://8wayrun.com/wiki/special/templates

Many thanks!
 
#35
Quick Links
These work in conjunction with the title tags from the previous post.

Note: Colours are hard coded, you'll need to edit these.


Template Name: quicklinks-top

Template Code:
Code:
<ul class="quicklinks">
Template Name: quicklinks-row

Template Code:
Code:
<script type="text/javascript"><!--
document.write("<li><a href=\"" + document.location + "#{{{anchor}}}\">{{{text}}}</a></li>");
--></script>
Template Name: quicklinks-row-url

Template Code:
Code:
<li><a href="{{{url}}}" title="{{{text}}}">{{{text}}}</a></li>

Template Name: quicklinks-row-url-gold

Template Code:
Code:
<li><a href="{{{url}}}" title="{{{text}}}" class="gold">{{{text}}}</a></li>
CSS:
Add the following CSS to your extra.css template. Note some colours are hard coded.
Code:
.gold {
background: #E9E375 !important;
color: #094603 !important;
text-shadow: none !important;
font-weight: 800 !important;
}

.gold:hover {
background: #FBBD2B !important;
}

.quicklinks {
margin: 5px 0;4
}

.quicklinks li {
display: inline;
margin: 0 !important;
}

.quicklinks li a {
background: @primaryLightish url('styles/default/xenforo/gradients/navigation-tab.png') repeat-x top;
font-size: 11px;
color: white;
padding: 2px 10px;
text-shadow: 0 0 0 transparent, 0 1px 1px #23631C;
line-height: 19px;
border: 1px solid @primaryMedium;
border-radius: 10px;
}

.quicklinks li a:hover {
background: #23631c;
color: #e9e375;
text-decoration: none;
}


Template Example:
Code:
[template=title]heading = Quick Links[/template]
[template=quicklinks-top][/template]
[template=quicklinks-row-url-gold]url = [plain]http://www.greenandgoldrugby.com/community/threads/2012-super-rugby-injury-list.10262/[/plain]| text = Discussion Thread[/template]
[template=quicklinks-end][/template]
[template=quicklinks-top][/template]
[template=quicklinks-row]anchor = Brumbies| text = Brumbies[/template]
[template=quicklinks-row]anchor = Rebels| text = Rebels[/template]
[template=quicklinks-row]anchor = Reds| text = Reds[/template]
[template=quicklinks-row]anchor = Waratahs| text = Waratahs[/template]
[template=quicklinks-row]anchor = Western Force| text = Western Force[/template]
[template=quicklinks-end][/template]
[template=quicklinks-top][/template]
[template=quicklinks-row]anchor = Blues| text = Blues[/template]
[template=quicklinks-row]anchor = Chiefs| text = Chiefs[/template]
[template=quicklinks-row]anchor = Crusaders| text = Crusaders[/template]
[template=quicklinks-row]anchor = Highlanders| text = Highlanders[/template]
[template=quicklinks-row]anchor = Hurricanes| text = Hurricanes[/template]
[template=quicklinks-end][/template]
[template=quicklinks-top][/template]
[template=quicklinks-row]anchor = Bulls| text = Bulls[/template]
[template=quicklinks-row]anchor = Cheetahs| text = Cheetahs[/template]
[template=quicklinks-row]anchor = Lions| text = Lions[/template]
[template=quicklinks-row]anchor = Sharks| text = Sharks[/template]
[template=quicklinks-row]anchor = Stormers| text = Stormers[/template]
[template=quicklinks-end][/template]
Screenshot:
View attachment 28714

Live Example:
Rugby Injuries

quicklinks-end template missing for the full solution. Otherwise, great stuff. Thanks for all the goodies :)

I will guess the body only has " </ul> " in it.
 
Last edited:
#36
Hello everyone, it seems our team is having one small issue. How to make a simple table. Is there some template or trick to doing this? I am feeling we are overlooking something simple and obvious. Any pointers in the right direction will be greatly appreciated.
 
#37
In case you guys are wondering... my index templates are very different now...

TEMPLATE EXAMPLE: Wiki Index: (BB Code)
http://8wayrun.com/wiki/index/
Code:
[template=iconSTR] title=Main Characters [/template]
[template=iconROW] name=a Patroklos | slug=alpha-patroklos [/template]
[template=iconROW] name=Abyss | slug=abyss [/template]
[template=iconROW] name=Aeon | slug=aeon [/template]
[template=iconEND] [/template]

TEMPLATE NAME: iconSTR
Code:
<div class="iconList">
    <div class="subHeading"><b>{{{title}}}</b></div>
    <ul>
TEMPLATE NAME: iconEND
Code:
</ul>
</div>
TEMPLATE NAME: iconROW
Code:
<li>
    <div class="iconBlock">
        <div><a href="wiki/{{{slug}}}/"><img src="images/{{{slug}}}.jpg" border="0" style="max-width: 100%;" alt="{{{name}}}" /></a></div>
        <div class="secondaryContent"><a href="wiki/{{{slug}}}/"><b>{{{name}}}</b></a></div>
    </div>
</li>
TEMPLATE CSS:
Code:
Built into next version of XenCarta...
How do you increase the size of the icons?

Update: Figured it out.

In the iconROW wiki template, I changed

HTML:
<div><a href="wiki/{{{slug}}}/"><img src="images/{{{slug}}}.jpg" border="0" style="max-width: 100%;" alt="{{{name}}}" /></a></div>
to
HTML:
<div><a href="wiki/{{{slug}}}/"><img src="images/{{{slug}}}.jpg" width="200" height="200" border="0" alt="{{{name}}}" /></a></div>
and in the EWRCarta.css, I changed

Code:
.wikiPage .wikiContent .iconList li { margin: 10px 2px 0px; position: relative; display: inline-block; width: 96px; }
to
Code:
.wikiPage .wikiContent .iconList li { margin: 10px 2px 0px; position: relative; display: inline-block; width: 200px; }
 
Last edited:
#38
Biography Block
This is a collection of templates that I'm using to float a Rugby Players' Biographical details to the right of a wiki entry. It'll obviously need a substantial amount of editing to be useful in other wikis, but hopefully this will get the creative juices flowing.


Template Name: player-top
Code:
<table class="player-table" >
        <tr>
                <td colspan="2" class="player-heading"><b>{{{name}}}</b></td>
        </tr>
        <tr>
                <td colspan="2" class="player-picture">
<div style="padding: 10px;">
<a href="http://cdn.greenandgoldrugby.com/804F73/gagr/up/wikiimages/{{{image}}}.jpg" target="_blank" class="LbTrigger" data-href="misc/lightbox"><img src="http://cdn.greenandgoldrugby.com/804F73/gagr/up/wikiimages/{{{image}}}-300.jpg" alt="gene-fairbanks-navy.jpg" class="bbCodeImage LbImage" style="max-height: 200px;"></a>
<p>{{{caption}}}</p>
</div>
</td>
        </tr>
Template Name: player-bio
Code:
<tr>
                <td colspan="2" class="player-heading"><b>Biography</b></td>
        </tr>
        <tr>
                <td class="player-primary"><b>Nickname</b></td>
                <td class="player-primary">{{{nickname}}}</td>
        </tr>
        <tr>
                <td class="player-secondary"><b>Birthplace</b></td>
                <td class="player-secondary">{{{bplace}}}</td>
        </tr>
        <tr>
                <td class="player-primary"><b>Date of Birth</b></td>
                <td class="player-primary">{{{dob}}}</td>
        </tr>
        <tr>
                <td class="player-secondary"><b>Age</b></td>
                <td class="player-secondary"><script type="text/javascript">
var now = new Date();
var today = new Date(now.getYear(),now.getMonth(),now.getDate());
var yearNow = now.getYear();
var monthNow = now.getMonth();
var dateNow = now.getDate();
 
var datestring = {{{dob_yyyymmdd}}} + '';
var dob = new Date(datestring.substring(0,4), datestring.substring(4,6)-1, datestring.substring(6,8));
var yearDob = dob.getYear();
 
yearAge = yearNow - yearDob;
var monthDob = dob.getMonth();
 
if (monthNow >= monthDob) var monthAge = monthNow - monthDob; else { yearAge--;
var monthAge = 12 + monthNow -monthDob; };
if (monthAge > 1) var monthDisplay = ' Months Old'; else { var monthDisplay = ' Month Old' };
 
document.write (yearAge + ' Years, ' + monthAge + monthDisplay);
</script></td>
        </tr>
        <tr>
                <td class="player-primary"><b>Height</b></td>
                <td class="player-primary">{{{height}}}</td>
        </tr>
        <tr>
                <td class="player-secondary"><b>Weight</b></td>
                <td class="player-secondary">{{{weight}}}</td>
        </tr>
        <tr>
                <td class="player-primary"><b>Position</b></td>
                <td class="player-primary">{{{position}}}</td>
        </tr>
        <tr>
                <td class="player-secondary"><b>School</b></td>
                <td class="player-secondary">{{{school}}}</td>
        </tr>
Template Name: player-career
Code:
<tr>
                <td colspan="2" class="player-heading"><b>{{{career}}} Career</b></td>
        </tr>
        <tr>
                <td class="player-primary">{{{team}}}</td>
                <td class="player-primary">{{{years}}}</td>
        </tr>
Template Name: player-tweets
Code:
<tr>
                <td colspan="2" class="player-heading"><b>On Twitter</b></td>
        </tr>
        <tr>
                <td colspan="2"><div style="padding: 5px;"><script src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
  version: 2,
  type: 'search',
  search: 'from:@{{{TwitterName}}}',
  interval: 30000,
  title: '',
  subject: '',
  width: 290,
  height: 250,
  theme: {
    shell: {
      background: '#23631c',
      color: '#f9cf6d'
    },
    tweets: {
      background: '#ffffff',
      color: '#91ac75',
      links: '#094603'
    }
  },
  features: {
    scrollbar: true,
    loop: false,
    live: true,
    behavior: 'all'
  }
}).render().start();
</script></div></td>
        </tr>
Template Name: table-end
Code:
</tbody></table>
CSS:
Code:
.player-table {
float: right;
margin: 0px 0px 5px 10px;
width: 300px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border: 1px solid @primaryMedium;
}
 
.player-primary { line-height: 160%; background: @contentBackground;}
 
.player-secondary { line-height: 160%; background: @primaryLightest;}
 
.player-heading {
font-weight: bold;
font-size: 12pt;
text-shadow: 0 0 0 transparent, 0 1px 1px #23631C;
color: @secondaryLighter;
background: @primaryMedium url('styles/default/xenforo/gradients/category-23px-light.png') repeat-x top;
padding: 1px 0;
margin: 3px auto 5px;
}
 
.player-picture {background: @secondaryLightest;}

Template Usage:
The three templates provide the flexibility I need with players having different bio requirements. Many have Club, Domestic and International careers, others just Club. Some don't have twitter so I don't use the player-tweets template.

Example:
Code:
[template=player-top]
| name = James Horwill
| image = reds/james-horwill
| caption = Pretty in Pink[/template]
[template=player-bio]| nickname = Big Kev
| bplace = Warwick
| dob = 29th May, 1985
| dob_yyyymmdd = 19820727
| school = Brisbane Boys College
| height = 2.00m
| weight = 117kg
| position = Lock[/template]
[template=player-career]| career = Club| team = Queensland University
| years = 2010 - present
[/template]
[template=player-career]| career = Province| team = Queensland Reds
| years = 2006 - present
[/template]
[template=player-career]| career = International| team = Australia
| years = 2007 - present
[/template]
[template=player-tweets]TwitterName = jhorwill[/template]
[template=table-end][/template]
Screenshot:
View attachment 23416

Pardon my ignorance, but where should I add style .css and once you create the template, how the user can call for work ?

Best regards.