Настройка Facebook Комментарии и как кнопка на Wordpress

Я хотел был бы установить Facebook Comments и Like button для блога Wordpress. Поэтому я установил этот блок кода сразу после <body>. Первая часть - это SDK для Facebook, и я думаю, что здесь нет ошибки. А вторая часть - это блок кода для веб-приложения. (Я заменил appid на XXXXX.)Настройка Facebook Комментарии и как кнопка на Wordpress

<script> 
    window.fbAsyncInit = function() { 
    FB.init({ 
     appId  : 'XXXXXX', 
     xfbml  : true, 
     version : 'v2.4' 
    }); 
    }; 

    (function(d, s, id){ 
    var js, fjs = d.getElementsByTagName(s)[0]; 
    if (d.getElementById(id)) {return;} 
    js = d.createElement(s); js.id = id; 
    js.src = "//connect.facebook.net/en_US/sdk.js"; 
    fjs.parentNode.insertBefore(js, fjs); 
    }(document, 'script', 'facebook-jssdk')); 
</script> 

<div id="fb-root"></div> 
<script>(function(d, s, id) { 
    var js, fjs = d.getElementsByTagName(s)[0]; 
    if (d.getElementById(id)) return; 
    js = d.createElement(s); js.id = id; 
    js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.4&appId=XXXXXX"; 
    fjs.parentNode.insertBefore(js, fjs); 
}(document, 'script', 'facebook-jssdk'));</script>

Тогда я помещаю Facebook Like Button сразу после одного сообщения.

<div class="fb-like" data-layout="box_count" data-action="like" data-show-faces="true" data-share="false"></div>

И комментарии к ним после него.

<div class="fb-comments" data-numposts="3" data-width="100%" data-href="http://<?php echo $_SERVER["HTTP_HOST"] . $_SERVER["REQUEST_URI"] ?>" data-mobile="false"></div>

Но в моих Wordpress temp demo, Facebook Комментарии показывает вверх и, как кнопка не делает. Здесь что-то не так?

источник

2015-10-06 chenghuayang

Похоже, что '.facebook-sharer' нуждается в явной ширине, например' 60px'. Хотя я заметил, что вы используете flexbox для родительского контейнера, ваша проблема, вероятно, связана с правилами, установленными для дочерних элементов контейнера. –

@DavidAlsbright Спасибо человек. Таким образом, проблема может заключаться в внешнем контейнере '.sharer-container', который является flexbox, чтобы обернуть внутренний контейнер' .facebook-sharer' и сделать его равным 0px. (Структура находится в [link above] (http://chenghuayang.com/blog/love-lorem-ipsum/#comments) или [скриншот] (http://imgur.com/RQW5ka3).) Но я не знаю, почему внутренний контейнер '.facebook-sharer' рухнул? Почему он не может действовать как другие участники торгов? – chenghuayang

Также кажется, что атрибут flexbox не вступил в силу в '.sharer-container', поскольку я отключил его в dev-инструментах. – chenghuayang

Первоначально, я хотел бы сделать Facebook Комментарии гибкими, поэтому дайте ему значение 100% ширины. Но в этом случае я также непреднамеренно указал некоторые div внутри Facebook Like Button. Таким образом, 100% -ная ширина ребенка просто заставляет родителя рухнуть, а вся кнопка Like Button рухнула.

Вы можете проверить текущую структуру Facebook Like Button в this temp demo или image.

источник

2015-10-07 07:10:50 chenghuayang

Настройка Facebook Комментарии и как кнопка на Wordpress

ответ

Смежные вопросы