A-TAK.COM

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

※Amazonのアソシエイトとして、A-TAK.COMは適格販売により収入を得ています
※本サイトではその他アフィリエイトも利用しております。

広告
シェア

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タグからどうぞ

広告

シェア

投稿日

カテゴリー:

, ,

投稿者:

カテゴリ一覧