【WP】5段階評価ができる「Yet Another Stars Rating」の導入方法

wp-yet-another-stars-rating

商品などのレビューに評価として星がついているのを見かけることがあると思います。外部からの評価として商品購入の参考にもなります。

今回はWordPress上の記事に5つ星の評価をつけることができるプラグイン「Yet Another Stars Rating」の導入方法をご紹介します。

Yet Another Stars Rating

「Yet Another Stars Rating」プラグインをインストールして有効化をします。通常は「無料版」ですが「有料版」へアップグレードすることができます。

無料版は総合評価のみですが、有料版ではひとつに記事に対して複数の評価を設置することができるようになります。

表示場所

wp-yet-another-stars-rating-01

「Yet Another Stars Rating」は、WordPress上で投稿された本文を表示する「the_content関数」にフックしているので、page.phpやsingle.phpでthe_content()が使われいる場所に評価(星マーク)が表示されるようになっています。

設定方法

「設定」メニューに「Yet Another Stars Rating: Settings」が追加されていますので、「Yet Another Stars Rating: Settings」の設定画面を開きます。

初期設定では表示されないように設定されているので表示をするために「General settings」で設定を変更します。

Auto insert options

表示方法の基本設定を

設定項目 説明 設定内容
Use Auto Insert? 表示・非表示を設定します
  • Yes:表示する
  • No:表示しない
What? 評価方法を設定します
  • Overall Rating / Author Rating:投稿管理者の評価を掲載する
  • Visitor Votes:訪問者の評価を掲載する
  • Both:上記の両方の評価を掲載する
Where? 掲載場所を設定します
  • Before the post:本文の上に表示する
  • After the post:本文の下に表示する
Size 評価マークの大きさを設定します 「Small」「Medium」「Large」の3種類から選ぶことができます
Exclude Pages? 固定ページでの表示を設定します
  • Yes:表示しない
  • No:表示する
Use only in custom post types? カスタム投稿の表示を設定します
  • Yes:カスタム投稿のみで表示する
  • No:カスタム投稿以外で表示する

Show “Overall Rating” in Archive Page?

評価方法が「Overall Rating / Author Rating」と設定されている場合で、表示する場合はアーカイブページ内で「the_content関数」を使用していることが表示条件になります。

説明 設定内容
カテゴリーやアーカイブなどの表示を設定します
  • Yes:表示する
  • No:表示しない

Show “Visitor Votes” in Archive Page?

評価方法が「Visitor Votes」と設定されている場合で、表示する場合はアーカイブページ内で「the_content関数」を使用していることが表示条件になります。

説明 設定内容
カテゴリーやアーカイブなどの表示を設定します
  • Yes:表示する
  • No:表示しない

Insert custom text to show before / after stars

評価マークに任意のテキストを追加するかを設定します。

設定名 説明 設定内容
設定された任意のテキストの表示・非表示を設定します
  • Yes:表示する
  • No:表示しない
Custom text to display before Overall Rating 「Overall Rating」の星マークの前に追記するテキストを設定します
Custom text to display before Visitor Rating 「Overall Rating」の星マークの前に追記するテキストを設定します
Custom text to display when a non logged user has already rated 評価済みの場合に表示するテキストを設定します

Do you want show stats for visitors votes?

「Visitor Votes」の場合の評価された統計グラフを表示するかを設定します。

説明 設定内容
統計グラフの表示を設定します。
  • Yes:表示する
  • No:表示しない

Allow only logged in user to vote?

評価できるユーザーをログインできるユーザーに限定するのかを設定します。

説明 設定内容
評価できるユーザーを設定します。
  • Allow only logged-in users:ログインできるユーザーのみ
  • Allow everybody (logged in and anonymous):すべての閲覧者

Which rich snippets do you want to use?

検索結果などに表示されるスニペットに掲載される内容を設定します。

説明 設定内容
スニペットに掲載する評価内容を設定します。
  • Review Rating:評価値
  • Aggregate Rating:平均値

How do you want to rate “Overall Rating”?

表示されるマークを設定します。無料版では星マークのみが有効になります。

説明 設定内容
表示されるマークを設定します。
  • Stars:星マーク
  • Numbers:数字

備考

「Yet Another Stars Rating」で使用されている英語表記は日本語用の翻訳ファイルを使用する事で表記を変更することがでいます。

関連記事

【デザイン】印象に残るビジネスカードデザイン

名刺は自分たちのことを覚えてもらうために重要なビジネスツールです。そこで受け取ったら印象に残るであろうデザインのビジネスカードを集めてみました。 Tok&Stok(Business Card) ブラジルの家具メーカー「Tok&Stok」のビジネスカード...続きを読む

2015.02.15インスピレーション

【無料】商用利用OKシームレステクスチャ「岩石(白玉石風)」素材

自然の岩肌を表現したシームレスの無料で使えるテクスチャです。白玉石のような白色の石の質感を再現しています。継ぎ目のないシームレス加工をしているテクスチャです。テクスチャマッピングやタイル敷の背景素材などにお使いいただけます。商用利用OKのフリー素材となっております。 ...続きを読む

2018.09.12シームレステクスチャ

【JavaScript】チェックボックスとラジオボタンのデザインをカスタマイズする『iCheck』

フォームなどで使われるチェックボックスとラジオボタンのデザイン。「jQuery」と「Zepto」を使いチェックボックスとラジオボタンのデザインをカスタマイズするライブラリ『iCheck』をご紹介します。 実装イメージ 『iCheck』はいくつかのスキンデータも用意され...続きを読む

2015.02.10HTMLコーディング

【フォト】吉田町川尻海岸『幸福呼ぶ鳥居~初日の出~』

静岡県吉田町にある川尻海岸では年始の期間限定で『幸福呼ぶ鳥居』がお目見えします。鳥居に朝日が昇る様子は幻想的です。初日の出の日は、多くの方々でにぎわっていました。 フォトギャラリー ※写真をクリックすると拡大表示します。 [gallery link="file" col...続きを読む

2017.01.01フォトギャラリー

【HTML】Adobe Dreamweaverを使いSass・SCSSをコンパイルする方法

前回、ブログにて「Sass・SCSSを使うことでWEBサイトの制作を効率化すること」をとりあげました。そこでSass・SCSSは、どちらもCSSを効率よく記述することができること。そして、Sass・SCSSを変換(コンパイル)してCSSとして書き出してWEBサイトに組み込むことを...続きを読む

2019.05.16HTMLコーディング