Como deixar os comentários do Facebook responsivos em seu site

Os blogueiros que utilizam a caixa de comentários do Facebook como centro da discussão em seus blogs, podem ter problemas ao migrar para um design responsivo. isso porque o código oferecido pelo facebook na página de desenvolvimento do facebook entrega o mesmo com uma largura fixa.

A dica, então, para quem quer ver como a caixa de comentários do facebook se ajuste à largura de seu blog de acordo com a resolução de tela do visitante, é colocar um código simples no arquivo css.

Comentários do facebook

Comentários do facebookVeja

Outra opção interessante é ativar a opção de mobile da caixa de seus comentários. Para tanto, adicione o código data-mobile=”auto-detect” no código fornecido pelo facebook.

Comentários do Facebook responsivos

A linha abaixo deverá funcionar se adicionada corretamente ao arquivo style.css de seu WordPress ou outro equivalente.

 .fb-comments, .fb-comments span, .fb-comments.fb_iframe_widget span iframe {
    width: 100% !important;
}

Deixe seu comentário