【WordPress】おススメ度を表す星段階評価の作り方
色んなおススメを紹介するブログではよく目にする星段階評価ってありますよね？
一目でおススメ度合いが分かり、おススメされている商品などは使ってみたくなりますね。
でもいざブログで紹介する立場になった時に、あの星段階評価ってどうやって作ってるんだろうってなりますよね。画像で一個一個作るのもちょっと面倒ですし…。
そんな訳で調べてみました！
今回はブログなどでよく目にする、星段階評価の作り方をメモしていきます。
Shortcode Star Ratingをインストールする
星段階評価を作ってくれる便利なプラグイン、「Shortcode Star Rating」をインストールします。
「プラグイン」→「新規追加」→「Shortcode Star Rating」検索→「Shortcode Star Rating」をインストールして有効化
Shortcode Star Ratingの設定
「設定」→「Shortcode Star Rating」で設定画面にいけます。
とてもシンプルな設定画面ですね。私の様な複雑な設定画面が苦手な人にはすごくうれしい設計です(｀･ω･´)
まず設定項目に関して説明していきますね。
星の色
星の色を設定する項目です。初めから問題ない色が設定されているので自分なりのこだわりがなければ初期設定のままで大丈夫だと思います。
もし色を変えたいというときはこちらのサイトから色のコードをコピーして張りつけましょう。
親ボックスに合わせる
こちらの設定も初期設定のままで問題はないと思いますが、星を強調したい場合はチェックボックスにチェックをいれます。
記事に星段階評価を作ってみる
実際の使い方について説明します。
記事作成中、表示させたい位置にコードを入力するだけです。例えば
と入力すると
星5段階評価、評価は欲し3つなります。
コードは下の4種類があります。
- rating ⇒ 星の数（評価数）
- max ⇒ 最大の星の数
- type ⇒ percentと書くことで、パーセントで星評価
- numeric ⇒ 星評価の後ろに%表示を出す
「type」と「numeric」の使い方事例も出しておきますね
・星10段階評価で評価50％の評価の場合
・星10段階評価で評価50％、パーセント表示を出す場合
基本的にはmaxとratingだけでおススメ評価できると思いますが、場合によってはパーセント表示で評価してみるのもいいですね。
さて今回は星を使った段階評価作成方法でした。お疲れ様でした！
