Eu tenho o editor de tabelas demotti e não consigo descobrir uma maneira simples de classificar uma determinada coluna em mais de uma maneira de duas áreas quentes diferentes no mesmo cabeçalho. (Uma maneira via "nome do jogo" e outra via "porcentagem".)
Meu código já classifica Game no nome do jogo, mas faz o mesmo ao clicar em porcentagem (portanto, este não é por porcentagem, mas por nome).

Qual é a maneira com menos código para fazer isso? (De preferência com as opções existentes do editor de tabelas.)

Coluna do cabeçalho da tabela:

<th>Game <span class="percSort">%</span></th>

Coluna do corpo:

<th class="gamename">
<div style="width:66%;background-color: hsla(84,100%,50%,0.7);"></div>
<span class="name">Alphabetic</span>
<span class="perc">66%</span>
</th>

Código Domready:

    $("#games")
    .tablesorter({
        sortList: [['.percSort',1]],
        textExtraction:{
            1:function(node, table, cellIndex) {
                return $(node).find('.name').text();
            },
            '.percSort':function(node, table, cellIndex) {
                return $(node).find('.perc').text();
            }
       }
    });

O que não posso fazer: divida minha coluna correspondente em mais coluna. Ele exibe barras coloridas através do css que você pode ver.