「関数リファレンス/wp star rating」の版間の差分

2015年5月12日 (火) 09:33時点における最新版

0〜5 の 0.5 単位 (例: 星 1 個、 1.5 個、 2 個等) で表示される星の評価数を HTML エレメントとして出力します。オプションとして、評価数が指定されていれば、 $number パラメーターを引き渡すことでタイトル属性に表示させることも可能です。

デフォルトでは、管理画面でのみ使えるようになっています。

<?php wp_star_rating( $args ); ?>

$args

（array） （optional） 引数の array

初期値： 星 0 個

• rating - 数字の評価値。 0 から 5 まで 0.5 づつの増加 (または 0 から 100 パーセントの評価)。デフォルト値は 0。
• type - 'percent' または 'rating'。デフォルト値は 'rating'。
• number - 送信された評価数。 タイトル属性のテキスト上に hover で表示される。

(none) 

内容をそのまま戻す

星の評価結果は以下のように表示されます:

<? php $args = array(
   'rating' => 3.5,
   'type' => 'rating',
   'number' => 1234,
);
wp_star_rating( $args ); ?>

上記のコードは以下の HTML を出力します:

<div class="star-rating" title="3.5 rating based on 1,234 ratings"><div class="star star-full"></div><div class="star star-full"></div><div class="star star-full"></div><div class="star star-half"></div><div class="star star-empty"></div></div>

この関数をフロントエンドで使用するためには、テンプレートが wp-admin/includes/template.php ファイルを含み、適切なダッシュアイコンの CSS フォント情報が enqueue されている必要があります。 CSS の例:

@font-face {
	font-family: "dashicons";
	src: url("../fonts/dashicons.eot");
}

@font-face {
	font-family: "dashicons";
	src: url(data:application/x-font-woff;charset=utf-8;base64,/* !! Large amount of data removed, see wp-includes/css/dashicons.css for complete data !! */) format("woff"),
		url("../fonts/dashicons.ttf") format("truetype"),
		url("../fonts/dashicons.svg#dashicons") format("svg");
	font-weight: normal;
	font-style: normal;
}

.star-rating .star-full:before {
    content: "\f155";
}

.star-rating .star-half:before {
    content: "\f459";
}

.star-rating .star-empty:before {
    content: "\f154";
}

.star-rating .star {
    color: #0074A2;
    display: inline-block;
    font-family: dashicons;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    height: 20px;
    line-height: 1;
    text-align: center;
    text-decoration: inherit;
    vertical-align: top;
    width: 20px;
}

説明を明確化するために、上記 CSS 内のフォントデータは省略されています。このデータは実働コードに含まれている必要があります。 wp-admin/css/dashicons.css を参照してください。

Version 3.8 にて導入されました。

wp_star_rating() は wp-admin/includes/template.php にあります。

Using WordPress 3.8's dashicons in your theme or plugin - James Koster

最新英語版： WordPress Codex » Function_Reference/wp_star_rating （最新版との差分）