SP-Design

Seja bem-vindo ao SP-Design. Aqui, lhe ajudaremos com o tema de seu Fórum/Blog/site, vocês poderão solicitar e fornecer ajuda a outros usuários sobre o design e estrutura, tanto grafica, tanto em css e templantes.


Regulamento e informações:      
Equipe SP-Design
Regras do fórum
Como entrar na equipe Staff
Seções do fórum:
Pedidos Graficos
Pedidos de Códigos
SP-Design e você
Antes de postar uma dúvida:
Função busca
Perguntas e respostas frequêntes
Tutoriais, dicas e astúcias
Feliz ano novo para você!
Leia a carta de boas festas da equipe SPD.
Área Vip, os códigos mais inovadores
Obtenha os códigos mais inovadores de nosso fórum, atraves de pontos de Cash.
Leia as Regras do SP-Design
Acabou de chegar? Para se "enturmar" rapidamente leia as regras desse fórum.
Tutoriais e Dicas
Veja aqui nossos tutoriais inéditos, e muitos outros tutoriais sobre Design.
Publique no SPublicidade
Publique, peça opinião de pessoas experientes, divulgue o seu trabalho com o SPublicidade
Modifique o visual do seu fórum
Dúvidas sobre códigos HTML, CSS, BBCode e JQuery. Também, poderá tirar dúvidas sobre Templantes.
Faça Pedidos Gráficos para seu fórum
Este é um serviço gratuito para customização e criação de banners, logos, avatares, ícones...
Novo Administrador na comunidade
Pro Administradores adicionam novo administrador na equipe SPD.

Ver o tópico anterior Ver o tópico seguinte Ir para baixo  Mensagem [Página 1 de 1]

HenRyqUéè

HenRyqUéè
Administrador
Desenvolvedor Web

Dom 09 Dez 2012, 2:36 pm


[tutorial] personalizando os ranks Groupe10

[TUTORIAL] Personalizando os ranks

Olá pessoal, neste tutorial, irei ensinar a como personalizar os ranks do estilo do RMBR, além desse estilo, irei expor vários outros estilos para ranks também.

[tutorial] personalizando os ranks Act_bottom
CRÉDITOS!
Todos os créditos desse tutorial a:
www.rmbr.forumeiros.com e www.spdesign.forumeiros.com
--> Tutoriais, dicas e astúcias <--
[TUTORIAL] Personalizando os ranks


- Criando um novo rank...
Vá em:

Painel > Usuarios e Grupos > Ranks > Administração dos ranks >> Adicionar Novo Rank
Título do Rank : Dê qualquer título ao rank (ex: Helper).
Rank Especial : Nesse caso vamos marcar sim, se colocarmos não, automaticamente ele iria para todos os membros.
Número mínimo de mensagens : (Ligado a: Rank especial - Não) Nesse caso ele ativaria o rank ao membro se ele tivesse o numero de mensagens especificado.
URL da imagem do Rank (http://URL_DE_L'IMAGE.gif) : Url da imagem do rank, nesse cso não iremos usar esta área.


- Adicionando classes para ligar no rank...
Vá em:

Painel > Visualização > Imagens e Cores > Cores >> Folha de estilo CSS
Para criar uma classe, primeiramente é nescessário você ter uma noção básica em css, como comandar os eventos, etc.

Vamos criar a nossa primeira classe, a que eu vou escolher é "h" (escolha as iniciais do nome do rank, para ficar menor na hora de adiciona-la e para não esquecer).

Como estamos referindo a textos e não tabelas, o código na folha ficaria assim:

Código:

.h{
ATRIBUTOS CSS
}

- Adicionando essa classe ao rank...
Devemos ir ao rank que nós criamos,e em "Título do Rank :" nós iremos adicionar o seguinte código:

Código:

<div class="h">NOME DO RANK</div>
Vamos entender as partes do código:

DIV: Tag HTML.
CLASS: Inicia a classe css que nós criamos.
H: Classe CSS que criamos.
NOME DO RANK: Aqui você irá colocar o nome do rank (ex: Helper).


- Estilos css para o rank...
Os códigos abaixo, vocês iraão colocar dentro da parte destacada:


.h{
ATRIBUTOS CSS
}

Estilo 1 (RMBR):
CLIQUE AQUI PARA ABRIR:

Estilo 2
CLIQUE AQUI PARA ABRIR:

Estilo 3
CLIQUE AQUI PARA ABRIR:

Esses são alguns estilos que eu disponibilizei para facilitar suas vidas, ms é claro que vc tendo um pouco de conhecimento de css, vc pode fazer seus própios estilos.

  • Funciona em quais versões?
    Todas




© RMBR & SPDesign


[tutorial] personalizando os ranks Act_bottom Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título:
[TUTORIAL] Personalizando os ranks

TiagoDJ-7.0

TiagoDJ-7.0
sou nível 12

Qua 20 Fev 2013, 7:36 am

esse e o melhor tutorial de hoje
nota 10

™David™

™David™
sou nível 5

Qui 18 Abr 2013, 4:30 pm

parabens


Conteúdo patrocinado

Ver o tópico anterior Ver o tópico seguinte Ir para o topo  Mensagem [Página 1 de 1]

Você não está conectado. Conecte-se ou registre-se



Permissões neste sub-fórum
Não podes responder a tópicos

TiagoDJ-7.0, Seg 03 Mar 2014, 3:21 pm

Tenma Hiraga, Dom 12 Jan 2014, 2:49 pm

TiagoDJ-7.0, Ter 31 Dez 2013, 5:50 pm

Crowley, Ter 31 Dez 2013, 8:42 am

TiagoDJ-7.0, Sex 27 Dez 2013, 9:33 pm

Ghost, Sex 27 Dez 2013, 6:37 pm

Crowley, Sex 27 Dez 2013, 12:53 pm

Crowley, Sex 27 Dez 2013, 12:46 pm

Destaque do Fórum
Destaque do Fórum

Carregando avatar...
Muito Obrigado
Parabens para o Membro destaque do fórum, pela sua ótima competencia em nosso fórum, um agradecimento dos Usuários e de toda a equipe a você !! Muito Obrigado !!

Quer um Widget igual a este ?
peça o seu aqui >>>

 

Atualizado com e-referrer
Publicidade | SEJA NOSSO PARCEIRO
Naruto Rpg FutureLes power infoMaster ExpShiftactifThe forum of Codes

2012 © SP-Design - Ajuda na criação de códigos e na aparência de seu Fórum™ - Design de Cyllaz - Todos os direitos reservados ®