The following is the source of the template. Click "Expand" to view it.
{| class="infobox" style="border-radius:6px 6px 0 0; -moz-border-radius: 6px 6px 0 0; font-size:84%; width:275px; background-color:#fff; margin-bottom: 0px; border-bottom: 0px none #fff;" |- ! colspan="2" style="-moz-border-radius:4px 4px 0 0; border-radius:4px 4px 0 0; background-color:{{{headercolor|#3366CC}}}; color:{{{headerfontcolor|#ffffff}}}; font-size:{{{headerfontsize|200%}}}; text-align: center; padding:12px;" | {{{name|{{SUBPAGENAME}}}}}{{#if:{{{name2|}}}|<br /><span style="font-size:65%;">({{{name2}}})</span>|}} {{#if:{{{image|}}}{{{main|}}}{{{temp|}}}{{{human|}}}{{{main1|}}}{{{temp1|}}}{{{human1|}}}| {{!}}- {{!}} id="ci-profile" class="{{infobox character/util|top|{{{tabclasses}}}}}" colspan="2" style="text-align:center; padding:0.5em;" {{!}} {{#if:{{{image|}}}|{{infobox character/util|{{{image}}}|{{{imagewidth|}}}|{{{caption|}}}|1}}| {{#tag:tabber|{{#if:{{{main|}}}| {{#if:{{{maintitle|}}}|{{{maintitle}}}|{{infobox character/util|{{{kind|}}}}}}}={{infobox character/util|{{{main}}}|{{{mainwidth|}}}|{{{maincaption|}}}|2}}| {{#if:{{{main1|}}}{{{main2|}}}{{{main3|}}}{{{main4|}}}{{{main5|}}}|{{#if:{{{maintitle|}}}|{{{maintitle}}}|Main}}=<div class="{{infobox character/util|main|{{{tabclasses}}}}}">{{#tag:tabber|{{#if:{{{main1|}}}|{{#if:{{{main1title|}}}|{{{main1title}}}|{{infobox character/util|{{{kind|}}}}}}}={{infobox character/util|{{{main1}}}|{{{main1width|}}}|{{{main1caption|}}}|3}}|}} {{!}}-{{!}}{{#if:{{{main2|}}}|{{#if:{{{main2title|}}}|{{{main2title}}}|Main 2}}={{infobox character/util|{{{main2}}}|{{{main2width|}}}|{{{main2caption|}}}|3}}|}} {{!}}-{{!}}{{#if:{{{main3|}}}|{{#if:{{{main3title|}}}|{{{main3title}}}|Main 3}}={{infobox character/util|{{{main3}}}|{{{main3width|}}}|{{{main3caption|}}}|3}}|}} {{!}}-{{!}}{{#if:{{{main4|}}}|{{#if:{{{main4title|}}}|{{{main4title}}}|Main 4}}={{infobox character/util|{{{main4}}}|{{{main4width|}}}|{{{main4caption|}}}|3}}|}} {{!}}-{{!}}{{#if:{{{main5|}}}|{{#if:{{{main5title|}}}|{{{main5title}}}|Main 5}}={{infobox character/util|{{{main5}}}|{{{main5width|}}}|{{{main5caption|}}}|3}}|}} }}</div>|}}}} {{!}}-{{!}}{{#if:{{{temp|}}}| {{#if:{{{temptitle|}}}|{{{temptitle}}}|Temporary}}={{infobox character/util|{{{temp}}}|{{{tempwidth|}}}|{{{tempcaption|}}}|2}}| {{#if:{{{temp1|}}}{{{temp2|}}}{{{temp3|}}}{{{temp4|}}}{{{temp5|}}}{{{temp6|}}}{{{temp7|}}}|{{#if:{{{temptitle|}}}|{{{temptitle}}}|Temporary}}=<div class="{{infobox character/util|temp|{{{tabclasses}}}}}">{{#tag:tabber|{{#if:{{{temp1|}}}|{{#if:{{{temp1title|}}}|{{{temp1title}}}|Temp 1}}={{infobox character/util|{{{temp1}}}|{{{temp1width|}}}|{{{temp1caption|}}}|3}}|}} {{!}}-{{!}}{{#if:{{{temp2|}}}|{{#if:{{{temp2title|}}}|{{{temp2title}}}|Temp 2}}={{infobox character/util|{{{temp2}}}|{{{temp2width|}}}|{{{temp2caption|}}}|3}}|}} {{!}}-{{!}}{{#if:{{{temp3|}}}|{{#if:{{{temp3title|}}}|{{{temp3title}}}|Temp 3}}={{infobox character/util|{{{temp3}}}|{{{temp3width|}}}|{{{temp3caption|}}}|3}}|}} {{!}}-{{!}}{{#if:{{{temp4|}}}|{{#if:{{{temp4title|}}}|{{{temp4title}}}|Temp 4}}={{infobox character/util|{{{temp4}}}|{{{temp4width|}}}|{{{temp4caption|}}}|3}}|}} {{!}}-{{!}}{{#if:{{{temp5|}}}|{{#if:{{{temp5title|}}}|{{{temp5title}}}|Temp 5}}={{infobox character/util|{{{temp5}}}|{{{temp5width|}}}|{{{temp5caption|}}}|3}}|}} {{!}}-{{!}}{{#if:{{{temp6|}}}|{{#if:{{{temp6title|}}}|{{{temp6title}}}|Temp 6}}={{infobox character/util|{{{temp6}}}|{{{temp6width|}}}|{{{temp6caption|}}}|3}}|}} {{!}}-{{!}}{{#if:{{{temp7|}}}|{{#if:{{{temp7title|}}}|{{{temp7title}}}|Temp 7}}={{infobox character/util|{{{temp7}}}|{{{temp7width|}}}|{{{temp7caption|}}}|3}}|}} {{!}}-{{!}}{{#if:{{{temp8|}}}|{{#if:{{{temp8title|}}}|{{{temp8title}}}|Temp 8}}={{infobox character/util|{{{temp8}}}|{{{temp8width|}}}|{{{temp8caption|}}}|3}}|}} }}</div>|}}}} {{!}}-{{!}}{{#if:{{{costume|}}}| {{#if:{{{costumetitle|}}}|{{{costumetitle}}}|Costume}}={{infobox character/util|{{{costume}}}|{{{costumewidth|}}}|{{{costumecaption|}}}|2}}| {{#if:{{{costume1|}}}{{{costume2|}}}{{{costume3|}}}{{{costume4|}}}{{{costume5|}}}|{{#if:{{{costumetitle|}}}|{{{costumetitle}}}|Costumes}}=<div class="{{infobox character/util|costume|{{{tabclasses}}}}}">{{#tag:tabber|{{#if:{{{costume1|}}}|{{#if:{{{costume1title|}}}|{{{costume1title}}}|Costume 1}}={{infobox character/util|{{{costume1}}}|{{{costume1width|}}}|{{{costume1caption|}}}|3}}|}} {{!}}-{{!}}{{#if:{{{costume2|}}}|{{#if:{{{costume2title|}}}|{{{costume2title}}}|Costume 2}}={{infobox character/util|{{{costume2}}}|{{{costume2width|}}}|{{{costume2caption|}}}|3}}|}} {{!}}-{{!}}{{#if:{{{costume3|}}}|{{#if:{{{costume3title|}}}|{{{costume3title}}}|Costume 3}}={{infobox character/util|{{{costume3}}}|{{{costume3width|}}}|{{{costume3caption|}}}|3}}|}} {{!}}-{{!}}{{#if:{{{costume4|}}}|{{#if:{{{costume4title|}}}|{{{costume4title}}}|Costume 4}}={{infobox character/util|{{{costume4}}}|{{{costume4width|}}}|{{{costume4caption|}}}|3}}|}} {{!}}-{{!}}{{#if:{{{costume5|}}}|{{#if:{{{costume5title|}}}|{{{costume5title}}}|Costume 5}}={{infobox character/util|{{{costume5}}}|{{{costume5width|}}}|{{{costume5caption|}}}|3}}|}} }}</div>|}}}} {{!}}-{{!}}{{#if:{{{human|}}}| {{#if:{{{humantitle|}}}|{{{humantitle}}}|Human}}={{infobox character/util|{{{human}}}|{{{humanwidth|}}}|{{{humancaption|}}}|h}}| {{#if:{{{human1|}}}{{{human2|}}}{{{human3|}}}{{{human4|}}}{{{human5|}}}|{{#if:{{{humantitle|}}}|{{{humantitle}}}|EG}}=<div class="{{infobox character/util|human|{{{tabclasses}}}}}">{{#tag:tabber|{{#if:{{{human1|}}}|{{#if:{{{human1title|}}}|{{{human1title}}}|Human 1}}={{infobox character/util|{{{human1}}}|{{{human1width|}}}|{{{human1caption|}}}|h}}|}} {{!}}-{{!}}{{#if:{{{human2|}}}|{{#if:{{{human2title|}}}|{{{human2title}}}|Human 2}}={{infobox character/util|{{{human2}}}|{{{human2width|}}}|{{{human2caption|}}}|h}}|}} {{!}}-{{!}}{{#if:{{{human3|}}}|{{#if:{{{human3title|}}}|{{{human3title}}}|Human 3}}={{infobox character/util|{{{human3}}}|{{{human3width|}}}|{{{human3caption|}}}|h}}|}} {{!}}-{{!}}{{#if:{{{human4|}}}|{{#if:{{{human4title|}}}|{{{human4title}}}|Human 4}}={{infobox character/util|{{{human4}}}|{{{human4width|}}}|{{{human4caption|}}}|h}}|}} {{!}}-{{!}}{{#if:{{{human5|}}}|{{#if:{{{human5title|}}}|{{{human5title}}}|Human 5}}={{infobox character/util|{{{human5}}}|{{{human5width|}}}|{{{human5caption|}}}|h}}|}} }}</div>|}}}} }}}}}} |- | style="width:30%;" | | style="width:70%;" | |- {{#if: {{{kind|}}} | {{!}}'''Kind''' {{!}}{{main other|{{#switch:{{PAGENAME}}|Creatures|Inanimate objects={{{kind}}}|#default={{#ifexpr:{{#if:{{#pos:{{#explode:{{{kind}}}| & |0}}|[}}|1|0}}|{{{kind}}}|{{#switch:{{ucfirst:{{lc:{{#explode:{{{kind}}}| & |0}}}}}}|Earth=[[Earth ponies|Earth]]|Pegasus=[[Pegasi|Pegasus]]|Unicorn=[[Unicorns|Unicorn]]|Alicorn=[[Alicorns|Alicorn]]|Crystal=[[Crystal Ponies|Crystal]]|#default={{#ifexist:{{#explode:{{{kind}}}| & |0}}|[[{{#explode:{{{kind}}}| & |0}}]]|{{#explode:{{{kind}}}| & |0}}}}}}{{#switch:{{lc:{{#explode:{{{kind}}}| & |1}}}}|=|human=<br />[[Humans|Human]] ({{H:title|Equestria Girls films and/or merchandise|''EG''}})[[Category:Equestria Girls characters]]|#default=<br />{{#explode:{{{kind}}}| & |1}}}}}}}}|{{{kind}}}}} {{!}}- }} {{#if: {{{sex|}}} | {{!}}'''Sex''' {{!}}{{#replace:{{{sex}}}| & |<br />}} {{!}}- }} {{#if: {{{owner|}}} | {{!}}'''Owner''' {{!}}{{{owner}}} {{!}}- }} {{#if: {{{residence|}}} | {{!}}'''Residence''' {{!}}{{{residence}}} {{!}}- }} {{#if: {{{occupation|}}} | {{!}}'''Occupation''' {{!}}{{{occupation}}} {{!}}- }} {{#if:{{NAMESPACE}}||{{#ifexpr:{{#ifeq:{{PAGENAME}}|Creatures|1|{{#if:{{#dpl:debug=0|title={{PAGENAME}}/Gallery|allowcachedresults=true|include=%0}}|1|0}} or {{has spec|char|{{PAGENAME}}}} or {{has overview|{{PAGENAME}}}}}}| {{!}}'''Other links''' {{!}}<ul style="list-style-type:none; margin:-0.25em 0em;">{{#if:{{#dpl:debug=0|title={{PAGENAME}}/Gallery|allowcachedresults=true|include=%0}}|<li>[[{{PAGENAME}}/Gallery#{{#switch:{{PAGENAME}}|Creatures|Inanimate objects={{{name}}}|}}|{{PAGENAME}} image gallery]]</li>|}}{{#ifeq:{{PAGENAME}}|Creatures||{{#ifexpr:{{has overview|{{PAGENAME}}}}|<li>[[{{PAGENAME}}/Gallery/Overview|Appearances gallery]]</li>|}}}}{{#ifeq:{{PAGENAME}}|Creatures||{{#ifexpr:{{has spec|char|{{PAGENAME}}}}|<li>[[Forum:Speculation/{{PAGENAME}}|Speculation forum]]</li>|}}}}</ul> }}}} |} {{#if: {{{eyes|}}} {{{mane|}}} {{{hair|}}} {{{coat|}}} {{{skin|}}} {{{misc1|}}} {{{misc2|}}} {{{misc3|}}} {{{misc4|}}} {{{{misc5|}}} {{{aura|}}} {{{nicknames|}}} {{{relatives|}}} {{{cutie mark|}}} {{{voice|}}} {{{singing voice|}}} | {{{!}} class="infobox mw-collapsible mw-collapsed" style="border-bottom-left-radius:6px; border-bottom-right-radius: 6px; font-size:84%; width:275px; margin-top: 0px; border-top: 0px; background: #fff;" ! style="text-align: left; background-color:{{{headercolor|#3366CC}}}; color:{{{headerfontcolor|#ffffff}}}; text-align: center; padding-left: 5px;" colspan="2" {{!}} More info {{!}}- {{!}} style="width:20%;" {{!}} {{!}} style="width:80%;" {{!}} {{!}}- {{#if: {{{eyes|}}} | {{!}}'''Eyes''' {{!}}{{colorsquare|{{{eyes}}}}} {{!}}- }} {{#if: {{{mane|}}} | {{!}}'''Mane''' {{!}}{{colorsquare|{{{mane}}}}} {{!}}- }} {{#if: {{{hair|}}} | {{!}}'''Hair''' {{!}}{{colorsquare|{{{hair}}}}} {{!}}- }} {{#if: {{{coat|}}} | {{!}}'''Coat''' {{!}}{{colorsquare|{{{coat}}}}} {{!}}- }} {{#if: {{{skin|}}} | {{!}}'''Skin''' {{!}}{{colorsquare|{{{skin}}}}} {{!}}- }} {{#if: {{{colors|}}} | {{!}}'''Colors''' {{!}}{{colorsquare|{{{colors}}}}} {{!}}- }} {{#if: {{{misc1|}}} | {{!}}'''{{{misc1}}}''' {{!}}{{colorsquare|{{{misc1text}}}}} {{!}}- }} {{#if: {{{misc2|}}} | {{!}}'''{{{misc2}}}''' {{!}}{{colorsquare|{{{misc2text}}}}} {{!}}- }} {{#if: {{{misc3|}}} | {{!}}'''{{{misc3}}}''' {{!}}{{colorsquare|{{{misc3text}}}}} {{!}}- }} {{#if: {{{misc4|}}} | {{!}}'''{{{misc4}}}''' {{!}}{{colorsquare|{{{misc4text}}}}} {{!}}- }} {{#if: {{{misc5|}}} | {{!}}'''{{{misc5}}}''' {{!}}{{colorsquare|{{{misc5text}}}}} {{!}}- }} {{#if: {{{aura|}}} | {{!}}'''Magic aura''' {{!}}{{colorsquare|{{{aura}}}}} {{!}}- }} {{#if: {{{nicknames|}}} | {{!}}'''Nicknames''' {{!}}{{{nicknames}}} {{!}}- }} {{#if: {{{relatives|}}} | {{!}}'''Relatives''' {{!}}{{{relatives}}} {{!}}- }} {{#if: {{{cutie mark|}}} | {{!}} colspan="2" style="text-align: center; background-color:{{{headercolor|#3366CC}}}; color:{{{headerfontcolor|#ffffff}}}; padding-bottom: 1em" {{!}} '''Cutie mark'''<br />{{{cutie mark}}} {{!}}- }} {{#if: {{{voice|}}} | {{!}}'''Voice''' {{!}}{{{voice}}} {{!}}- }} {{#if: {{{singing voice|}}} | {{!}}'''Singing<br />voice''' {{!}}{{{singing voice}}} }} {{!}}} | {{{!}} class="infobox" style="border-bottom-left-radius:6px; border-bottom-right-radius: 6px; font-size:84%; width:275px; margin-top: 0px; border-top: 0px; background: #fff;" {{!}}- {{!}} {{!}}} }}{{#if:{{#pos:{{{name|}}}|"}}|{{Title|{{{name}}}}}}}<includeonly>{{#if:{{NAMESPACE}}||{{#switch:{{PAGENAME}}|Creatures|Inanimate objects=|{{#switch:{{ucfirst:{{lc:{{#explode:{{{kind}}}| & |0}}}}}}|Earth=[[Category:Earth ponies]]|Pegasus=[[Category:Pegasus ponies]]|Unicorn=[[Category:Unicorn ponies]]|Alicorn=[[Category:Alicorn ponies]][[Category:Royalty]]|Crystal=[[Category:Crystal Ponies]]|Human=[[Category:Humans]]|#default=}}{{#if:{{{owner|}}}|[[Category:Pets]]|}}{{#if:{{{sex|}}}|[[Category:{{#if:{{#pos:{{{sex}}}|&}}|{{#if:{{#pos:{{lc:{{#explode:{{{sex}}}|&|0}}}}|female}}|Female|{{#if:{{#pos:{{lc:{{#explode:{{{sex}}}|&|0}}}}|male}}|Male}}}}|{{{sex}}}}} characters]]}}}}}}<!--For cleanup-->{{#if:{{{owner|}}}{{{colors|}}}|{{#if:{{{mane|}}}{{{coat|}}}{{{cutie mark|}}}|[[Category:Infoboxes with mixed usage]]|}}|}}
Well, it would be easier if it was a portable infobox, but you can still use the classes and the ids included in the template to customize it with CSS. If you simply want to recreate the design of My Little Pony Wiki, this is the CSS they use:
.infobox { border: 1px solid #aaaaaa; background-color: #f9f9f9; color: black; margin-bottom: 0.5em; margin-left: 1em; padding: 0.2em; float: right; clear: right; } .infobox td, .infobox th { vertical-align: top; } .infobox caption { font-size: larger; margin-left: inherit; } .infobox.bordered { border-collapse: collapse; } .infobox.bordered td, .infobox.bordered th { border: 1px solid #aaaaaa; } .infobox.bordered .borderless td, .infobox.bordered .borderless th { border: 0; }
Ah ok, because I am trying to make a deisign my Leatherface Wiki infobox http://leatherface.wikia.com/wiki/Template:Character_Info
It is generally suggested that new wikis stick to using portable infoboxes; which this one is not. If you do that, you can use a theme to easily (relatively) style the template.
Andrewds1021 wrote: It is generally suggested that new wikis stick to using portable infoboxes; which this one is not. If you do that, you can use a theme to easily (relatively) style the template.
Yeah, I think it is a better choice for multiple reasons:
.portable-infobox { border: 1px solid #3A3A3A; border-radius: 5px; } .portable-infobox .pi-title { margin: 4px; border-radius: 5px 5px 0 0; } .portable-infobox .pi-header { margin: 4px; padding: 3px 35px; text-align: left; font-size: 9pt; }
Ok thanks, Aiihuan