～SNSのシェアボタン多数をブログに設置したい～

いつもお世話になっております。

FC2ブログをしていますが、お恥ずかしながらプログラムの知識がないもので教えてください。

ブログ記事･各投稿の頭とお尻にSNSのシェアボタンを設置したいと思います。
希望としては、最低限facebook、google、LINEは欲しいです。(さらに多ければありがたいです)

イメージ的には以下で紹介しているものが近いかな？と思っています。

SNSのシェアボタンの設置方法まとめ (サンプルコード付き)
https://syncer.jp/how-to-setting-share-button

が、試しにブログ記事の最初に【サンプル(新デザイン対応版)】のHTMLを張り付けてみたところ、ものすごくデザインの崩れたものになってしまいました…

質問としては、以下の通りです。

①【SNSのシェアボタンの設置方法まとめ (サンプルコード付き)】のやり方で進める場合…
　HTML貼り付けでデザインが崩れてしまったのですが、貼り付けるの箇所は

<!-- シェアボタン [ここからコピー] -->

から

<!-- シェアボタン [ここまでコピー] -->

で合っているでしょうか？

また、HTMLを貼り付けるだけでなく、CSSも触る必要があるでしょうか？

②こちら以外で、貼り付けだけでOKなテンプレートを紹介されているサイトなど
　ご存知でしたら教えてください。

以上、アドバイスいただけましたら幸いです。

よろしくお願いいたします。

質問者からの補足コメント

• 早々のご回答をありがとうございました！
  
  cssとJavaScriptをアドバイス通りに貼り付けて、再度投稿してみた結果…添付のようにデザインが崩れてしまいました(´；ω；`)
  PHPもいじる必要が、あるのでしょうか…
  
  よろしければ、アドバイスいただけましたら幸いです。

  
  No.1の回答に寄せられた補足コメントです。 補足日時：2017/05/27 14:26

No.1 回答者： taigoito 回答日時： 2017/05/26 21:51

同サイトのcssのコードを、cssファイルの一番下の部分に貼り付けて、

その上JavaScriptも必要だと思います。多分。

JavaScriptは、htmlファイルの終わりの方の、
</body>
と書いてある部分の手前に、
<script type="text/javascript">
（コピペの記述）
</script>
</body>
と、スクリプトタグで挟んで挿入します。多分。

FC2ブログについては使ったことがないので、ご参考まで。