【ソーシャルボタン設置】はてなブックマークのボタンだけ表示されない

2017年11月5日 at 3:14

お世話になります。
SBまとめ
http://comtopia.jp/sns_btn/
というサービスを活用し作成した以下のコードを自社サイトに貼ると、はてなブックマークのボタンだけ表示されず空欄になってしまいます。
(添付写真のように表示されます)
(コード内「●●●」は伏字です)

どのように修正すればよろしいでしょうか?
お手数をおかけいたしますが、何卒ご教示のほど、よろしくお願い申し上げます。


<div id="boxArea" style="display:table;padding:0 0 0 2px;"><div style="width:112px;height:22px;float:left;"><iframe src="//www.facebook.com/v2.0/plugins/like.php?href=http%3A%2F%2F●●●%2F●●●%2F●●●%2F●●●&width&layout=button_count&action=like&show_faces=false&share=false&height=90&appId=1882727678716753" scrolling="no" frameborder="0" style="border:none; overflow:hidden; height:90px;" allowTransparency="true"></iframe></div><div style="width:126px;height:22px;float:left;"><a href="http://b.hatena.ne.jp/entry/" class="hatena-bookmark-button" data-hatena-bookmark-layout="basic-label-counter" data-hatena-bookmark-lang="ja" title="このエントリーをはてなブックマークに追加"><img src="https://b.st-hatena.com/images/entry-button/button-only@2x.png" alt="このエントリーをはてなブックマークに追加" width="20" height="20" style="border: none;" /></a><script type="text/javascript" src="https://b.st-hatena.com/js/bookmark_button.js" charset="utf-8" async="async"></script></div><div style="width:74px;height:22px;float:left;"><a href="https://twitter.com/share" class="twitter-share-button"{count} data-via="●●●" data-lang="ja" data-hashtags="●●●"data-dnt="true">ツイート</a><script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script></div><div style="width:86px;height:22px;float:left;"><span><script type="text/javascript" src="//media.line.me/js/line-button.js?v=20140411" ></script><script type="text/javascript">new media_line_me.LineButton({"pc":true,"lang":"ja","type":"a"});</script></span></div><div style="width:76px;height:22px;float:left;"><div class="g-plusone" data-size="medium"></div>
<script type="text/javascript">
window.___gcfg = {lang: 'ja'};
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/platform.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();</script></div></div>

添付: sns.png
タグ:

Re: 【ソーシャルボタン設置】はてなブックマークのボタンだけ表示されない

2017年11月5日 at 12:42
まとめサービスを提供されている方にお問い合わせされた方が良いかと思います。concrete5ユーザーがみんなそのサービスを使っているわけでは無いので、みなさん分からないと思います。
 

Re: 【ソーシャルボタン設置】はてなブックマークのボタンだけ表示されない

2017年11月6日 at 0:30
takuro hishikawa様、コメントありがとうございます。
上記サービスでなくても良いので、以下の準でソーシャルボタンが横一列に表示されるようにしたいです。

Facebook、はてな、Twitter、Google+、LINE

どのようにすればよろしいでしょうか?
サンプルコードなどがございましたら、ご教示いただけますと誠に幸いです。

(各サービスのサイトのコードをコピーして並べただけですと、横一列にならなかったので、外部サービスを使ってみたのですが、それでもできなかったため、現在ご相談させていただいております。)

お手数をおかけいたしますが、何卒ご教示のほど、よろしくお願い申し上げます。
 

Re: 【ソーシャルボタン設置】はてなブックマークのボタンだけ表示されない

2017年11月6日 at 10:13
こちらのアドオンをお使いいただけます
http://www.concrete5.org/marketplace/addons/social-share-lite1

並び順の変更にはテンプレートの調整が必要です。ドキュメントご参照ください
http://concrete5-japan.org/help/5-7/developer/working-with-blocks/working-with-existing-block-types/modifying-the-default-view-template-for-a-core-block-type/
 

Re: Re: 【ソーシャルボタン設置】はてなブックマークのボタンだけ表示されない

2017年11月6日 at 19:44
takuro hishikawa様

ご教示いただきありがとうございます。
おかげさまで設置できました。
(並び順の変更は私には難しすぎて理解できませんでした。汗)
誠にありがとうございました。
 

Re: 【ソーシャルボタン設置】はてなブックマークのボタンだけ表示されない

2017年11月7日 at 22:31
takuro hishikawa様

本日ソーシャルシェアライトを設置した複数のページを確認した所、添付のようにSNSボタンが立て並びに表示されてしまっていました(きちんと横並びに表示されていたページもありました)。
どんな原因が考えられますでしょうか?
確認項目や対応策などございましたら、ご教示いただけますと幸いです。
お手数をおかけいたしますが、何卒ご確認のほど、よろしくお願い申し上げます。
添付: snsb.png
 

Re: 【ソーシャルボタン設置】はてなブックマークのボタンだけ表示されない

2017年11月8日 at 9:19
CSSが干渉しているのかな。ちょっと、実物を見てみないと分かりませんね…。
 

Re: 【ソーシャルボタン設置】はてなブックマークのボタンだけ表示されない

2017年11月17日 at 3:11
takuro hishikawa様

こちら、CSSの関係かも知れないのですね。自分でも調べて確認してみます。
いつもご教示いただきありがとうございます。