Follow Us @soratemplates

domingo, 26 de agosto de 2012

Entendendo e Personalizando IntenseDebate

Agora que vocês já sabem como instalar o sistema de comentários IntenseDebate (post anterior), vamos deixá-lo mais fofinho e entendê-lo mais!!! Você pode editar seu perfil e alguns códigos. Tudo é explicado no próprio site e feito com CSS, aqueles códigos adicionados acima de ]]></b:skin> no HTML ou pelo Designer de Modelo e ainda no próprio IntenseDebate. Primeiro, claro, é necessário entender algumas coisinhas básicas...
Bom, vamos entender o principal do painel, página que aparece após o login (claro rsrsrs...). Há um menu superior e os que ficam na lateral de acordo com cada opção desse menu.
Em My Account estão os dados referentes a sua conta e perfil, como os comentários de quem você segue, URL, http://intensedebate.com/people/SEU NOME DE USUÁRIO, sua senha, e-mail, notificações...nome público, informações sobre você, seus sites, sua foto, que pode ser a do Gravatar, conexão com outras redes sociais...O Gravatar é um avatar associado a um e-mail e que aparecerá sempre que usar o e-mail em outros sites. Com ele, sua foto aparece aqui nos comentários do Reino Kawaii. Para ter um:
***
1. Acesse: http://pt.gravatar.com
2. Digite seu e-mail no local indicado na imagem acima e clique no botão verde.
3. Você vai receber um e-mail para confirmar sua solicitação; basta confirmar então^-^
4. Na página que abrir, escolha um nome de usuário público e a senha, marque a última opção e clique em registro.
5. Na próxima etapa você pode escolher um e-mail secundário e seu avatar.
6. Depois de fazer o upload você deve agora atualizar as informações visíveis em seu perfil (clique em My Account), como sobre você, seus links, imagem de fundo do seu perfil...você edita tudo em My Account e como tá quase tudo em português, é bem fácil!!!
***
Nos extras do IntenseDebate ficam os banners para divulgá-lo, widgets interessantes, como os de comentários recentes, quantos comentários um blog tem....há ainda o RSS (feed) dos comentários, entre outros. E em support, é o suporte rsrsrs...

Sites e Personalização
Menu lateral da opção Sites
Em sites você gerencia os sites com IntenseDebate e adiciona novos com o mesmo procedimento do post anterior. É aqui que a gente modera os comentários, verifica o histórico, adiciona plugins (recomendo o Comment Luv-mostra o link dos posts dos leitores quando eles deixam o link para seus sites- o Add This -permite que o post seja divulgado em outras redes sociais- e os Smileys-emoticons nos comentários-), exporta, instala ou desinstala o IntenseDebate e configura ao nosso modo, tipo ativa a moderação de todos os comentários, organiza o layout, o que a gente quer ou não na visualização do formulário, das imagens, se quer que seja pop-up, fique incorporado, add twitter, facebook, escolhe o idioma, escreve uma mensagem para o leitor...e muda o CSS, que é o que dá aparência. No site há a explicação de tudo.
 
Vou deixar aqui os pontos principais do CSS, os quais você pode adicionar no seu template acima de ]]</b:skin> ou em Custom CSS no IntenseDebate. Para mais códigos: http://support.intensedebate.com/css-documentation
1.Adicionar background:
#idc-container-parent #idc-container .idc-c {
background: #CCC;
}
2.Personalizar fonte (estilo, tamanho):
#idc-container-parent #idc-container,
#idc-container-parent #idc-container div {
font-family: Helvetica, Arial, serif;
}
#idc-container-parent #idc-container,
#idc-container-parent #idc-container div {
font-size: 14px;
}
3.Escolher a cor do texto:
#idc-container-parent #idc-container,
#idc-container-parent #idc-container div {
color: #fcc;
}
4. Cor dos links:
#idc-container-parent #idc-container a {
color: #fcc;
}
#idc-container-parent #idc-container a:hover {
color: #fee;
}
5. Escolher largura:
#idc-container-parent #idc-container {
width: 460px;
}
6. Adicionar borda:
#idc-container-parent #idc-container {
border: 2px solid #CCC;
}
7. Estilo do header Comments e Post a new comment
#idc-container-parent #idc-container h3 {
font-size: 15px;
line-height: 1.3em;
}
8. Estilo do número de comentários:
#idc-container-parent #idc-container .idc-head h3 {
color: #c00;
}
9. Não mostrar número de comentários:
#idc-container-parent #idc-container h3 .idc-commentcount_wrap {
display: none;
}
10.Personalizar onde se escreve o comentário:
#idc-container-parent #idc-container .idc-new {
background-color: #f0f0f0;
padding: 10px 15px;
width: auto;
}
11.Plano de fundo do painel de controle do usuário registrado
#idc-container-parent #idc-container .idc-head .idc-user {
background: #fcc;
}
12. Remover borda do rodapé:
#idc-container-parent #idc-container .idc-foot {
border: none;
}
13.Destacar comentários do administrador
#idc-container-parent #idc-container .idc-c .idc-admin {
color: #9c3;
}
14. Estilos para comentários de redes sociais:
Facebook:
#idc-container-parent #idc-container .idc-c.idc-facebook {
border-top: 1px solid #3b5998;
}
#idc-container-parent #idc-container .idc-c-h {
background: none;
padding-top: 3px;
}
Twitter
#idc-container-parent #idc-container .idc-c.idc-twitter {
border-top: 1px solid #33ccff;
}
#idc-container-parent #idc-container .idc-c-h {
background: none;
padding-top: 3px;
}
15. Cabeçalho dos comentários 
#idc-container-parent #idc-container .idc-c .idc-c-h {
background: #F6F6F6;
border-top: 1px solid #CCC;
}
16. Avatar
#idc-container-parent #idc-container .idc-c-h .idc-a {
border: 1px solid #09f !important;
}
Agora é só ir editando os códigos das cores, adicionando sombras (text-shadow: 1px 2px 3px #fff; ou box-shadow: 1px 2px 3px #fff;), bordas (border-radius:5px; ou border: 2px dotted #ffffff;)...e assim por diante.
Espero que tenha ajudado :3 Beijus<3

13 comentários:

  1. vc poderia explicar como muda o cabeçalho onde fica o nome dos comentarista e o fundo do comentário só isso mais assim vc botou uma filarão de códigos não intender nada :(

    ResponderExcluir
    Respostas
    1. Acima de cada código há o título daquilo que será modificado, incluindo onde ficam os nomes e planos de fundo.

      Excluir
    2. mais onde boto o código todos no mesmo canto ? antes do ]] mais como muda o fundo ta ai ok . mais como que muda a cor do head onde fica o nome do comentarista ? pois nesse código ai só tem pra alterar o tamanho e a fonte !

      Excluir
    3. Tudo na área de CSS do Blogger ou do seu Intense Debate; no head é só add um background: #codigo da cor; ao código.
      Os códigos que estão aí são o básico do básico mesmo; aí é só add o que quiser.

      Excluir
  2. Eu Consegui! http://chromodowns.blogspot.com.br/
    Obrigado!

    ResponderExcluir
  3. De nada e muito obrigada a vocês <3

    ResponderExcluir
  4. Olá Roberta, você sabe me dizer se existe algum modo de conectar o intense debate com o número de comentários do blogger? Porque eu tenho os dois sistemas mas na contagem a aparece apenas o número de comentários do sistema padrão. Já tentei tirar i do blogger e deixar somente o intense mas não funcionou :(

    Ps. Adoro seus tutoriais, sempre me salvam! Vou tentar fazer esse agora hehe sucesso! Bjs

    ResponderExcluir
    Respostas
    1. Que eu saiba, nao. Sempre vejo recomendacoes de se usar o intense debate apenas nos posts novos, que ainda nao receberam comentarios, para nao conflitar com o sistema padrao do blogger. Assim, os antigos posts terao o sistema do blogger, com contagem e tudo, e os novos serao de fato salvos no intense debate. Veja o post anterior a esse.
      Muito obrigada e bju...

      Excluir
  5. Olá!
    Sei que esse post é antigo, mas gostaria de saber se há como mostrar o número de comentários na página inicial do blog.
    Há comentários nos posts, mas fica aparecendo "0 comentários". :(
    Você poderia me ajudar?

    Obrigada desde já~ (mesmo se não puder, haha).

    ResponderExcluir
  6. Faz tempos que não uso intense debate; se você usou um dos códigos desse post, tente remover a parte do Não mostrar número de comentários do Css.
    Olhando no site do Intense Debate, encontrei esse link que talvez possa ajudar: Comment Links. Mas a interface do Blogger mudou, pode ser isso também, algo pode estar incompatível...
    Espero que ajude :) De qualquer modo, se encontrar mais alguma coisa referente a sua dúvida, atualizo aqui ok ;D

    ResponderExcluir

Muito obrigada por seu comentário e por sua presença! Ambos são super importantes para mim.

Apenas peço que:
- Comente a vontade, dê sua opinião, faça críticas, esclareça suas dúvidas e dê suas sugestões sobre o assunto referente às postagens;
- Use um vocabulário livre para todas as idades;
- Não ofenda ninguém em hipótese alguma.

Os comentários são moderados e não são permitidos comentários de pessoas que não se identifiquem. Algumas dúvidas podem ser previamente esclarecidas na F.A.Q, assim como créditos e outras coisas.

Por favor, entrem em contato por meio das redes sociais também para dúvidas, sugestões, pedidos ou outros:
Facebook - Twitter - Google+ - Deviantart