Para quem quiser colocar ícones no titulo de cada widget da sidebar (ou outra coisa que consigam imaginar), aqui vai uma dica para envolver cada widget numa <div> com um id diferente, fornecendo assim uma âncora para o especificar as regras de CSS.
Ora para aplicar esta dica, primeira deve-se procurar no S2 uma linha semelhante a esta, e que se encontrará dentro da função Page::print:
println "</head><body>\n";
Esta é a zona do S2 em que é construido o <head> do HTML do template, por isso vamos adicionar aqui o seguinte código:
println"""<script type="text/javascript\">
String.prototype.white_spaces = function() {
var meses=new Array();
meses=['Janeiro','Fevereiro','Março','Abril','Maio','Junho','Julho','Agosto','Setembro','Outubro','Novembro','Dezembro'];
trimmed=this.replace(/ /g,'');
trimmed=trimmed.replace(/\./g,'');
for (a=0;a<11;a++){
trimmed_mes=trimmed.match(meses[a]);
if (trimmed_mes=trimmed.match(meses[a])){
trimmed="calend";
}
}
return (trimmed);
}
</script>""";
Este código, resumidamente, utiliza uma propriedade dos objectos de todos javascript chamada prototype que permite estender qualquer objectos acrescentando-lhe novos métodos. Em javascript todas as string são objectos do tipo String, que neste caso está a ser estendida para passar a ter um método chamado white_spaces() que remove todos os espaços brancos de uma string.
Este local, na função Page::print é também um bom sitio para colocar o código da Dica deixada no post http://tubodeensaio.blogs.ua.sapo.pt/29113.html, ou seja println"""<script>jQuery(document).ready( function() { setTimeout( function(){ jQuery('body').css( 'margin-top', 0 ) }, 500 ); });</script>"""; que o que faz é esperar pelo carregamento de todos os recursos da página (jQuery(document.ready)) e depois espera meio segundo (setTimeout( ..... , 500 ) ) para colocar o margin-top do body a 0.
Depois de terem estendido o objecto de String na função Page::print devem localizar no S2 a função print_generic_widget e substitui-la pelo código que está em baixo:
function print_generic_widget (string title, string content) {
if ($content->length() > 0) {
if ($title->length() > 0) {
println """<script type="text/javascript">
var title='$title';
document.write('<div id="'+title.white_spaces()+'">');
</script>
<div class="title"><div class="pref"></div>$*label_label_prefix""" + """$title</div>
<div class="widgetBg">""";
}
println $content;
println """</div></div> """;
}
}
Este bloco de código modifica a função original, fazendo com que seja imprimido no HTML um pouco de código Javascript que vai criar uma <div> com um id que corresponde ao título da widget sem espaços. Por exemplo, para a widget "Sobre mim" vai ser criada uma <div id="sobremim">.
Para aplicarem CSS especifico à widget Sobre mim apenas terão que utilizar o selector #sobremim.
Não tenho a certeza se esta dica se aplica a todos os templates, mas funciona com certeza numa boa parte deles e pode ser vista em funcionamento no template Sapo do Campus.
Espero que seja útil e que façam bom uso dela!
) e pelo resultado conseguido. 
