Criação de um Widget personalizado

Qual é minha questão:
Gostaria como eu crio um Widget igual a desse fórum.
 https://i.imgur.com/oSe05RO.png

Aonde está escrito Servidor e Raidcall !

Endereço do meu fórum:
http://www.brasilplayforever.com

Versão do fórum:
PHPBB3

Olá, vai em PA Modulos Configuração do Portal Portal Estrutura Criar um Widget personalizado Nome: Qualquer 1 Utilizar um Table type marque Sim Título do Widget " Servidor e Raidcall " Font do Widget* coloque esse código

Código:

 <div style="text-align: center;"><font size="6"><span style="font-style: italic; color: SeaGreen;">IP DO SERVIDOR:ip.brasilplayforever.com.br:7777 <a href="http://files.sa-mp.com/sa-mp-0.3e-install.exe" class="postlink">[SA-MP 0.3e]</a> <br><br><br><br> IP DO <a href="http://www.teamspeak.com/?page=downloads" class="postlink" target="_blank" rel="nofollow">TS3</a><span style="font-weight: bold;"></span></span></font><a href="http://teamspeak.gameserver.gamed.de/ts3/releases/3.0.2/TeamSpeak3-Client-win32-3.0.2.exe" class="postlink" target="_blank" rel="nofollow"><span style="font-size: 24px; line-height: normal"><font color="violet"><strong></strong></font></span><font size="6"><span style="font-style: italic; color: SeaGreen;"></span></font></a><font size="6">:</font><font size="6"><span style="font-style: italic; color: SeaGreen;">ip.brasilplayforever.com.br<sup></sup></span></font><br><font size="6"><span style="font-style: italic; color: 

depois vá em Adição/remoção de widgets pessoais procure oque você acabou de fazer na lista vai na Colocação Coluna 1 e salve.

Pode me dizer como eu faço esses quadrados ?
https://i.imgur.com/jYKhMm6.png

Desculpe, uma dúvida por tópico.

Veja se resulta.

Adicione este código ao seu CSS.

Código:

.module .h3 {
background-image: url("http://www.sebrasil.com.br/styles/AeroBlack/theme/images/cellpic1.gif");
background-repeat: repeat;
border: 1px solid #eee;
color: #FFF;
-moz-border-radius-topleft: 10px;
-webkit-border-radius-topleft: 10px;
-moz-border-radius-bottomright: 10px;
-webkit-border-radius-bottomright: 10px;
-moz-box-shadow: 0px 5px 5px #CCCCCC;
-webkit-box-shadow: 0px 5px 5px #CCCCCC;
text-align: center;
}

Esse código passado vai deixar os bagulho tudo branco, use esse é o mesmo mais mudei as cores.

Código:

 .module .h3 {
background-image: url("http://www.sebrasil.com.br/styles/AeroBlack/theme/images/cellpic1.gif");
background-repeat: repeat;
border: 1px solid #FFFFF;
color: #FFFFF;
-moz-border-radius-topleft: 10px;
-webkit-border-radius-topleft: 10px;
-moz-border-radius-bottomright: 10px;
-webkit-border-radius-bottomright: 10px;
-moz-box-shadow: 0px 5px 5px #CCCCCC;
-webkit-box-shadow: 0px 5px 5px #CCCCCC;
text-align: center;
}

Valeu amigo , funfou aqui (: