WordPressにいいねボタンとタグクラウドを設置する!

このブログのクオリティを上げていく企画の第4回。
前回、記事を見やすくするためにスタイルを追加した。
今回は以下の問題に対応していく!

  • いいねボタンを設置したい
  • タグクラウドを設置したい

いいねボタンを設置する

Like Button Ratingをインストールした。

記事一覧画面に「よく気づきました」ボタンが表示された。
なんなの「よく気づきました」って・・・。
一覧画面より記事詳細画面に表示したいなぁ。

Like Button Ratingのデフォルトの表示

どうやら色々とカスタマイズするにはLikeBtn.comに会員登録しないといけないらしい。
(めんどうくせぇ。やるけど。)

会員登録が官僚してE-mailやAPI keyが埋め込まれた状態

記事一覧にはいいねボタンを表示したくないのでチェックを外す。

投稿一覧のいいねボタンを無効化している図

テーマが選んでデザインをカスタマイズできる。
でも、ちょっと好みのデザインがないなぁ。

いいねボタンのデザインをカスタマイズしている図

Custom theme & imageを選べば細かくカスタマイズできるっぽい。

いいねボタンのデザインをカスタマイズしている図2

デフォルトだとlikeボタンとそれを取り消すDislikeボタンが表示される。
Dislikeボタンは不要なのでオフにする。

Dislikeボタンを無効化している図

プレビューで確認しながらカスタマイズできる。
なんか想像してたデザインと違うんだよな。

いいねボタンをプレビューしている図

カスタマイズ項目がたくさんあるけど痒い所に手が届かなくてモヤモヤするわ。
赤枠の箇所を消したいけど消せないっていうね。

いいねボタンをプレビューしている図2

まぁこれでいいか。

いいねボタンをプレビューしている図3。ほんとは文字無しにしたかった。

実際に記事画面で確認するとこんな感じ。
余白を調整したいな。

記事画面でいいねボタンを表示している図

外観カスタマイズ追加CSSに以下を追記して余白を調整した。

.likebtn_container {
	margin: 20px 0;
}

とりあえずこんなもんかな。

余白を調節後、記事画面でいいねボタンを表示している図

タグクラウドを導入する

次はタグクラウドを導入する。
てっきりこれもプラグインが必要なのかと思ってたんだけど、ウィジェットにあるんすねコレ。
全然気づかなかった。

ウィジェットでタグクラウドを有効化している図

で、有効にして確認するとこんな感じで表示された。良いじゃん。
でもこれクローラーが拾ってノイズになりそうな気がしなくもない。

タグクラウドを表示した図

今日はここまで。

「WordPressにいいねボタンとタグクラウドを設置する!」への1件のフィードバック

コメントする