宮さんが「ういーっす。Dashicons in WordPress 3.9の日本語訳はないの〜?」って言ってたので訳そうと思ったんだけど、Dashiconsの使い方そのものの日本語訳が見つかんなかったんで、ついでにご紹介。
「Dashicons」はWordPress 3.8から導入され、先日リリースされ、3.9でさらにいくつか追加されたWordPressの管理画面で使われている公式のアイコンフォントで、
こんなようなやつです。
テーマで使うには
functions.phpに以下を追加して、
add_action( 'wp_enqueue_scripts', 'themename_scripts' ); function themename_scripts() { wp_enqueue_style( 'themename-style', get_stylesheet_uri(), array('dashicons'), '1.0' ); }
スタイルシートで、適用したい要素の擬似クラスに以下のようにします。
.paintbrush-link:before { font-family: "dashicons"; content: "\f100"; }
content: "XXXXX";
のXXXXX
は
http://melchoyce.github.io/dashicons/
で希望のアイコンをクリックしてから上の「Copy CSS」をクリックすると取得できます。
参考: Using WordPress 3.8′s dashicons in your theme or plugin
記事等のコンテンツ内で使うには
functions.phpに上述のコードを追加したら、投稿エディター内等で
<div class="dashicons dashicons-admin-media"></div>
のように入れると表示されます。
この「dashicons-admin-media」等にアイコンが割り振られていて
http://melchoyce.github.io/dashicons/
で希望のアイコンをクリックしてから上の「Copy HTML」をクリックすると希望のクラス名を取得できます。
カスタム投稿タイプのメニューアイコンとして使うには
// Register a new custom post type named "Portfolio" register_post_type('portfolio', array( 'public' => true, 'menu_icon' => 'dashicons-portfolio', 'label' => __( 'Portfolio', 'local' ), );
のように’menu_icon’で希望のアイコンのCSSクラス名を指定します。クラス名は
http://melchoyce.github.io/dashicons/
で希望のアイコンをクリックしてから上の「Copy HTML」をクリックして取得できるhtmlのdivの2つ目のクラスがその該当のクラス名です。(これの一覧はどっかにないのかな?)