めておーる

好きなものを好きなだけ。Twitter▷@uimasaaan

はてなブログをLINEでシェアする

 で記事をシェアしたい!!

しかし、はてなブログのシェアマークは統一性がなくて使用したくない。

 

色々なサイトを回ったけれど画期的な方法は書いてないしコピペでささっと設置できるようにしたい。そう思って今回作りました。

 

 LINEボタンを設置する

f:id:uimasaaa:20180920132426p:plain

 

基本的なことは「ひつじの雑記帳」さんから考えました。

 

⚠️本サイトはテーマ:Minimalismを使用しています。他のデザインでも適応になるかは確認してません。ので、フォーマット崩れたりとかしても責任は取れないです。セーブしてから始めたほうが良いと思います。

 

設定方法

1.設定画面から詳細設定に。headに要素を追加からHTMLを記入します。

 

<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet">

 

2.デザイン画面から記事の設定に行く→記事上カスタマイズにこのコードを貼る。

 

f:id:uimasaaa:20180920134028p:plain

 

<div class="shrbtn">
<!-- HatenaBookmark -->
<a href="http://b.hatena.ne.jp/entry/{URLEncodedPermalink}" class="share_btn">
<span class="htvcenter" style="line-height: 1.6;">
<i class="blogicon-bookmark" style="font-size:22px"></i>
</span>
</a>
<!-- twitter -->
<a href="http://twitter.com/intent/tweet?text={Title} {URLEncodedPermalink}" class="share_btn">
<i class="fab fa-twitter"></i>
</a>
<!-- facebook -->
<a href="http://www.facebook.com/sharer.php?u={URLEncodedPermalink}" class="share_btn">
<i class="fab fa-facebook-square"></i>
</a>
<!-- LINE -->
<a href=https://social-plugins.line.me/lineit/share?url={URLEncodedPermalink} class="share_btn">
<i class="fab fa-line"></i>
<!-- feedly -->
<a href="http://feedly.com/i/subscription/feed/http://ブログURL/feed" target="_blank" class="share_btn">
<i class="fa fa-rss"></i>
</a>
</div>

 

LINEの場合公式からも拡散ボタンを配布していましたが決められたデザインしか貼れなかったのでこちらにしました。

 

いらないなって思う拡散先は消去してもいいかもしれません。