WordPressでd3.jsのグラフィカルな投票表示プラグインを作りました

Voting chart プラグイン作りました

d3.jsを使ってグラフィカルに記事の投票結果を表示するVoting Chartのベータ版公開します。

WordPress Plugin Directoryにアップしました!ダウンロードはこちらから↓
WordPress › Voting Chart Plugin « WordPress Plugins

記事の感想を良い、悪いで投票してもらうプラグイン

d3.jsでWordPress投票プラグインを作成中 | A-tak.com

上記の記事でもプラグイン作成してるーというのは書いていまして、まだまだな部分はありますが、とりあえず公開することにしました。ただ、国際化もしていないのでまずはこのサイトでzipで上げておきます。

d3.jsとAJAX組み合わせたWordPressプラグインを作りたいという世界に何人いるかわからない層の方々の参考にでもなればという意味でも早々に公開してみました。すんません、私もよくわかってないので、まずい所たくさんあると思います。

インストール

冒頭のリンクからzipをダウンロードし解凍してWordPressのwp-contents/pluginsの中に放り込んでください。そうするとプラグインの設定画面に「Voting Chart」が表示されます。

プラグイン画面から有効にします

「有効化」をクリックして有効にすればOKです。各記事の一番下に勝手に投票のメッセージが表示されます。

設定

設定画面

管理画面の設定メニューの中に「Voting Chart」の設定があります。各種メッセージが変更できますが、Good message と Bad messageは全角4文字ぐらいにしないと投票のバーと被ります。

Please push messageとThank you messageにはHTMLも書けます。改行入れると自動的に<br />タグを出力します。

投票表示のカスタマイズ

記事の下にある投票を促すメッセージの欄は「vote-chart-box」のdivタグで囲ってありますのでCSSで表示を変更できます。

ランク表示ショートコード

[]で囲んで「vote_chart_rank」と入れるとランキングが表示されます。固定ページなどでランキングを表示させるといいでしょう。今の所評判の良い上位10個の記事をシンプルな番号月リストで表示します。ランキングは「vote-ranking-box」のdivタグで囲っているのでCSSでカスタマイズできるはずです。

[2013/09/15追記]
「vote_chart_rank type=bad」を入れると評判の悪いランキングを表示できるようにしました。

今後

グラフの高さとか色とかコードに埋め込んでいるので、ここら辺を変えられるようにするのと、国際化してからWordPressのPlugin Directoryに登録できるようにしようかと思います。

バージョン更新履歴

Voting Chartタグからどうぞ

関連記事はCMの下をご覧ください

WordPressでd3.jsのグラフィカルな投票表示プラグインを作りました」への2件のフィードバック

  1. ピンバック: Voting Chart 0.6公開 – 評判の悪いランキング表示対応 | A-tak.com

  2. ピンバック: Voting Chart 0.7公開しました | A-tak.com

コメントを残す

メールアドレスが公開されることはありません。

CAPTCHA