Personalizando widgets

Qual é minha questão:
Olá como faço os Widgets assim?


Fórum onde visualizei o mesmo:
http://spublicidade.forumeiros.com/forum

Endereço do meu fórum:
http://swdesign.ativoforum.com

Versão do fórum:
PHPBB3

Olá!

Deverá entender de HTML, adicionar classes nos elementos que quer editar, fiz um código para você agora é só editar por meio de códigos CSS, aqui está:

Código:

        <div class="login"><form action="/login" method="post" name="form_login">

                <div id="label_userandpass"><label for="username">Nome da conta:</label></dt><dd><input type="text" tabindex="1" name="username" id="username" size="25" maxlength="40" value="" class="inputbox autowidth" /></dd></dl><dl><dt><label for="password">Senha:</label></dt><dd><input type="password" tabindex="2" id="password" name="password" size="25" maxlength="25" class="inputbox autowidth" /></div>

                <span class="esqueci"><br></br><a href="/profile.forum?mode=sendpassword"><img src ="http://2img.net/i/fa/admin/icones/small_ico/configuration.png"/> Esqueceu a senha?</a></br><br></br></span>

                <dd><input type="hidden" name="redirect" value="" /><input type="hidden" name="query" value="" /><input type="submit" name="login" tabindex="6" value="Entrar" class="button1" /></dd>
        </form> </div>

#username.inputbox.autowidth -> Classe que se refere a caixa aonde se digita o nome do usuário.
#password.inputbox.autowidth -> Classe que se refere a caixa aonde se digita a senha para login.
#label_userandpass -> Engloba toda a área de login e senha.
.login -> Engloba todo o formulário de login.
input[value="Entrar"] -> Se refere ao botão de enviar dados, ou seja o botão de login.

Melhores cumprimentos,
seender

Ops, desculpe não ter explicado, eu quero o efeito que tem nos widgets do http://spublicidade.forumeiros.com/forum tipo essa imagem no fundo do titulo do widget etc

Olá!

Utilize estes códigos:

Código:

.module .main-content {
    background: url("http://i43.servimg.com/u/f43/17/53/16/77/sem_ta12.png") repeat-x scroll center bottom transparent;
    border-radius: 0px 0px 7px 7px;
}
.module .main-head, #main #main-content .portal .module .main-head, #main #main-content #profile-advanced-right .module .main-head {
    background: url("http://hitskin.com/themes/16/11/22/i_list_bg.png") repeat scroll -1px 0px transparent !important;
    padding: 0.6em 1.3em !important;
}

Adicione em:
Painel...-> Visualização -> Imagens e cores -> Cores / Folha estilo CSS

Melhores cumprimentos,
seender

Nenhum resultado.

Olá!

Troque por este:

Código:

        .module{
            border-radius: 0px 0px 7px 7px;
        }
        .module{
            background: url("http://hitskin.com/themes/16/11/22/i_list_bg.png") repeat scroll -1px 0px transparent !important;
            padding: 0.6em 1.3em !important;
        }

Até mais!

Quase, olhe lá como está. Não esqueça que tem um degradê meio azul claro e branco de fundo no widget.

Saudações!

Troque o código por este.
Código:

Código:

.module{
    border-radius: 0px 0px 7px 7px;
}
.module{
    background: url("http://hitskin.com/themes/16/11/22/i_list_bg.png") repeat scroll -1px 0px transparent  !important;
background-repeat: repeat-x !important;
    padding: 0.6em 1.3em !important;
}

Até

Também estou com a mesma dúvida, só que eu quero mudar a cor do Fundo dos Títulos dos Widgets Esquerdo do Fórum(Não é do Portal)

Olá,
Aceda a Folha de Estilo CSS:

Painel de Controle Visualização Imagens e Cores Cores Folha de estilo CSS

Código:

Código:

.module {
background: url(http://i43.servimg.com/u/f43/17/53/16/77/sem_ta12.png) repeat-x center bottom;
-webkit-border-radius: 0 0 7px 7px;
border-radius: 0 0 7px 7px;
border: 1px solid #ddd;
}
.module .h3 {
background: url(http://hitskin.com/themes/16/11/22/i_list_bg.png) -1px 0px !important;
padding: 0.6em 1.3em !important;
margin-left: -10px;
margin-top: -6px;
width: 172px;
}


e Valide!

Até mais.

Resultou, pode fechar.