Customizar botao de novo tópico,responder e bloqueado

Detalhes da questão

Endereço do fórum: http://BestCode.Forumeiros.com
Versão do fórum: PunBB

Descrição

Bom, quero sabe como faço para botar os botões novo tópico responder etc.. customizados no fórum, eu já tentei por alguns porem o código que eu botava ele ficava tudo junto muito feio rs.

Quero nesse estilo:

Boas!

Mas isso são imagens! Porque não coloca em:
Painel de Controle ->> Visualização ->> Gestão de Imagens ->> Modo Avançado ->> Botões
Depois é só colar o URL lá da imagem.

Deseja assim?
Até mais.

Olá, crie um novo javascript com esse código com investimento em todas as paginas:

Código:

$(document).ready(function(){$('img[src="http://2img.net/i/fa/punbb/post.png"]').replaceWith('<div class="botãonovotopico">Novo Tópico</div>')});$(document).ready(function(){$('img[src="http://2img.net/i/fa/punbb/reply.png"]').replaceWith('<div class="botãoresponder">Responder</div>')});$(document).ready(function(){$('img[src="http://2img.net/i/fa/prosilver/button_topic_locked_en.png"]').replaceWith('<div class="botãobloqueado">Bloqueado</div>')});

Basta você editar as imagens utilizadas para que tenha efeito o js...

E depois adicione esse código css:

Código:

.botãonovotopico, .botãoresponder {
    background-color: #3091C1!important;
    background-image: #3091C1!important;
    border-image-source: initial!important;
    border-image-slice: initial!important;
    border-image-width: initial!important;
    border-image-outset: initial!important;
    border-image-repeat: initial!important;
    box-shadow: rgba(0, 0, 0, 0.188235) 0px 2px 1px, rgba(0, 0, 0, 0.188235) 0px -1px 0px inset, rgba(255, 255, 255, 0.188235) 0px 1px 0px 0px inset!important;
    color: rgb(255, 255, 255)!important;
    cursor: pointer!important;
    display: inline-block!important;
    height: 32px!important;
    text-align: center!important;
    text-decoration: none!important;
    text-shadow: rgba(0, 0, 0, 0.247059) 0px 1px 0px!important;
    white-space: nowrap!important;
    font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif!important;
    font-size: 16px!important;
    font-style: normal!important;
    font-variant: normal!important;
    font-weight: 300!important;
    line-height: 31px!important;
    border-width: medium!important;
    border-style: none!important;
    border-color: initial!important;
    border-radius: 5px!important;
    margin: 10px!important;
    padding: 0px 24px!important;
}
div.botãobloqueado {background-color: red!important;
    background-image: red!important;
    border-image-source: initial!important;
    border-image-slice: initial!important;
    border-image-width: initial!important;
    border-image-outset: initial!important;
    border-image-repeat: initial!important;
    box-shadow: rgba(0, 0, 0, 0.188235) 0px 2px 1px, rgba(0, 0, 0, 0.188235) 0px -1px 0px inset, rgba(255, 255, 255, 0.188235) 0px 1px 0px 0px inset!important;
    color: rgb(255, 255, 255)!important;
    cursor: pointer!important;
    display: inline-block!important;
    height: 32px!important;
    text-align: center!important;
    text-decoration: none!important;
    text-shadow: rgba(0, 0, 0, 0.247059) 0px 1px 0px!important;
    white-space: nowrap!important;
    font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif!important;
    font-size: 16px!important;
    font-style: normal!important;
    font-variant: normal!important;
    font-weight: 300!important;
    line-height: 31px!important;
    border-width: medium!important;
    border-style: none!important;
    border-color: initial!important;
    border-radius: 5px!important;
    margin: 10px!important;
    padding: 0px 24px!important;}

Até mais.

Eu uso essas imagens:



porem continua normal.

Troque o js por este:

Código:

$(document).ready(function(){$('img[src="http://i.imgur.com/ConUhwO.png"]').replaceWith('<div class="botãonovotopico">Novo Tópico</div>')});$(document).ready(function(){$('img[src="http://i.imgur.com/wIlmAxh.png"]').replaceWith('<div class="botãoresponder">Responder</div>')});$(document).ready(function(){$('img[src="http://i.imgur.com/lERYELy.png"]').replaceWith('<div class="botãobloqueado">Bloqueado</div>')});

Agora fará efeito;
Até mais.

Resolvido pode fechar.