プラグイン不要。この記事が気に入ったらいいね!ボタンの導入

こんにちは、トヲル(@yorealog)です。
10月も下旬に差し掛かりました。

pixivの作品移転があまり進んでおりません…スピードアップせねばです。

今日は鳥取で震度6(弱?)の地震が発生してから、断続的に揺れが続いているようで心配です。
あの近辺には活断層がないとのことで、昔も揺れたという話があるのですが、前回は地震が発生してから1年後に南海付近でも地震が発生したという情報もあり、日本全体として予断を許さぬ状況ですね…。
常に備えをしておかなくては、と改めて感じた次第です。

さて、今回は…

img_1274

これです’ω’b

この…個別記事の一番最後に、この記事が気に入ったらいいねお願いします的なエリアを追加しようと思います…!
個別記事にこちらを追加しておくことで、読んで頂いたあとの「いいね!」率が上がるかも…?
そこはやはり、PV次第でしょうか!(*ノノ)

こちらのカスタマイズにはTwitterのフォローボタンも準備されています。
ブログの更新情報や過去記事を回していますので最新情報を受け取って頂くのに有用となるかもです。
ワタクシのTwitterアカウントは所謂相互アカウントというヤツでして、ポリシーに反しないアカウントさんであれば漏れなくフォローバックしております。フォロワー3,000ですけれど、リプライなどは返せるものはお返しするようにしております。但し、何の前触れもなくDMを頂くとビビってスルーしています((((‘▽’;))))

今後更にこのエリアに何やら(他のフォローボタン等)追加するどうかは今のところ未定となっております…。まったり。

カンタンに実装したいならプラグインがオススメ

手っ取り早く実装したいという場合には、下記のようなプラグインを導入すればOK。

インストールして有効化すれば良いようですよ。前者はちょっと試していないのですが、後者においてはUIも素敵でした!

プラグインなしでも実装できるようでしたので、私はそちらを選びました。
手軽で大変魅力的なのですが、便利だからとなんでもかんでもインストールしてしまいますと、管理するプラグインも増え続けてしまいますし、サーバーに負荷がかかるかも…と思いましたので(その辺りは良く分かっていないのですが)。

プラグインなしでいいねボタンを導入する手順

大変有名どころで、

こちらを参考に設置していけば良いと思います…!
手順通りに実施すれば問題なく表示されるはずです。

WordPressテーマ「マテリアル」をご利用の場合

序盤に書いてあります「いいねボタンの設置のためにbodyタグ直後に貼り付ける」という部分につきましては、テーマ「マテリアル」を使用されている場合には必要ないみたいです。

CSSの記述の部分につきましては、マテリアルの場合ですとレスポンシブパターンがいくつか用意されています。子テーマのstyle.cssを確認しつつ、それぞれのサイズに対応しているエリア全てにCSSの記述を入れる必要があるっぽいです(現に私の場合は、2箇所に入れただけですとタブレットの表示が上手くいきませんでした)。
スマートフォンやタブレットといった、所謂モバイルに対応している部分にはスマホ用のCSSを入れておけば多分大丈夫です。

また、当サイトのようにマテリアルを使用しているウェブサイトであれば、のページが大変参考になります。

当サイト「ヨリアログ」も、ちゃぼP様のウェブサイトのカスタマイズTIPSはいくつか参考にさせて頂きました…!とても素敵なTIPSばかりで、全て導入したい!と思ったのですが知識が薄いのでイマイチやり切れていませんorz

マテリアルは、カスタマイズがそんなに必要ないと言われていますのでカスタマイズしている方は意外に少ないかも知れませんね。知識のない状態でやたら弄っても良いことがないかもですし…。

いずれのサイト様でも仰っていることなのですが、バックアップは必ず取っておきましょう。
間違えると色々面倒、function.phpなどはもっと大変なことになってしまいますので。

ちなみに一時バックアップを取るのにオススメされているのがEvernoteです。

有料プランもありますが、個人で趣味用に使うのであれば無料で十分事足りると思います。
様々なアプリとの連携も出来、IFTTTとの連携パターンも豊富な上にシンプルさも良く非常に便利です。

Onenoteも近頃はEvernoteの動きに合わせ、機能面の強化を着々と進めており台頭してきた、という雰囲気なのですが、一時バックアップなどで単純にサクっとコピー、ペーストしたい場合にはやはりEvernoteに軍配が上がっていると思います。Onenoteは少し重いですし、範囲選択の動作も滑らかとは言えません。

あとは表示確認をするだけ

手順通りに進めましたら、最後に色々な端末で表示確認をします。

screenshot_20161007-135305

img_1206

問題なく表示されている感じですね(細かい部分は置いといて)。

ところで、facebookのいいねボタンが表示されない場合があるようです。
これにつきましては、facebookにログインした状態でサイトをご覧になれば解決するのではと思います。

実際ログインしたらば表示されるようになりましたから、恐らく問題ないのではと思うのですが…
何かありましたらお知らせくださいませ。

まあ私の場合は「気に入ったら」などと胸を張って言える記事を提供できているかどうかは自信がありませんので、ちょっと弱気に「いかがでしたか?」という風にしておきましたΣ( ノω’)

触りに書いた地震とかけている訳ではございません