[TUTORIAL] Colocando o widget "Selecione o Tema" para foruns phpBB3

Hoje vou ensinar a vocês a como colocar o widget para o usuário selecionar o tema do fórum, não é necessário colocar imagens (a não ser o logo) a não ser que você queira, pois o código gera todas as cores e imagens pra você.

PRÉVIA:

[Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem]
FUNCIONA EM: phpBB3. (testado!)

1° CÓDIGO JAVASCRIPT:

Aceda em:

Painel de Controle Módulos :seta:HTML e JavaScript Gestão dos códigos JavaScript.

Código:

logo = 'LOGO DO FORUM';
ver = 'prosilver';
function loadskin() {
var a = my_getcookie('skin');
defskin = (ver == 'invision') ? 'grey' : 'blue';
var s = (a == defskin) ? '' : ('_' + a);
if (a != null) {
if (a != 'default') {
if (location.search == '') this.location = this.location.pathname + '?change_theme=' + ver + s + location.hash;
else if (!(/\?change|&change/.test(location.search))) this.location = this.location.href.replace(this.location.search, this.location.search + '&change_theme=' + ver + s);
else if (qStr('change_theme') != (ver + s)) this.location = this.location.href.replace(this.location.search, '?change_theme=' + ver + s);
} else if (/\?change|&change/.test(location.search)) {
this.location = this.location.href.split('?')[0] }
}
}
function chgskin(skin) {
my_setcookie('skin', skin, 0, 0);
loadskin();
}
function qStr(key, default_) {
if (default_ == null) default_ = "";
key = key.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
var regex = new RegExp("[\\?&]" + key + "=([^&#]*)");
var qs = regex.exec(window.location.href);
if (qs == null) return default_;
else return qs[1];
}
$(function(){
loadskin();
$("#logo").html('<img src="LOGO DO FORUM" />').fadeIn("slow");
});

Nas partes onde está escrito "LOGO DO FORUM" e 'LOGO DO FORUM', troque pelo url da imagem do logo do seu forum.

TÍTULO: Dê um título ao codigo.
INVESTIMENTO: Marque "Em todas as Páginas".
CÓDIGO JAVASCRIPT: Cole o código acima fazendo as alterações.
SALVE!

2° WIDGET:

Aceda em:

Painel de Controle Módulos Portal e Widgets Gestão dos widgets do forum.

Código:

 <div class="theme">            <a class="default" href="#" onclick="chgskin('default');return false"></a>            <a class="blue" href="#" onclick="chgskin('blue');return false"></a>            <a class="red" href="#" onclick="chgskin('red');return false"></a>            <a class="magenta" href="#" onclick="chgskin('magenta');return false"></a>            <a class="lightgreen" href="#" onclick="chgskin('lightgreen');return false"></a>            <a class="yellow" href="#" onclick="chgskin('yellow');return false"></a>            <a class="grey" href="#" onclick="chgskin('grey');return false"></a>            <a class="pink" href="#" onclick="chgskin('pink');return false"></a>        </div>        <style type="text/css">        <!-- #logo {display:none}-->
        .theme {padding: 10px 0px 0px;}
        .theme a {
            display: inline-block;
            text-decoration: none;
            width: 12px;
            height: 12px;
            border: 1px solid #444;
            margin: 2px 2px 2px 0;
            line-height: 2px;
        }
        .default{background:transparent;}
        .blue{background:#0D97DC}
        .red{background:#D90C1C}
        .magenta{background:#904E8B}
        .lightgreen{background:#86D70B}
        .yellow{background:#DCDA0A}
        .grey{background:#727272}
        .pink{background:#DF0F82}
        </style>

NOME DO WIDGET: Dê um nome ao Widget.
UTILIZAR UM TABLE TYPE: Marque "Sim".
TÍTULO DO WIDGET: Coloque "Escolha o Tema:".
FONTE DO WIDGET: Cole o código acima.
SALVE!

Tá ai pessoal, espero que gostem.

CRÉDITOS: clubteen9x
TRADUÇÃO E EDIÇÃO: Quakeline