WordPress.orgで提供されているアイコン、Dashiconsについて紹介 - WIジャパン

WordPress.orgで提供されているアイコン、Dashiconsについて紹介

以下のWordPress.orgで公開されているWordPressに関連するアイコンを紹介します。

https://developer.wordpress.org/resource/dashicons/

developer.wordpress.orgとは

developer.wordpress.orgは、Developer Resources、つまり開発者向けのリソース(資源)を提供しているWordPressの公式サイトになります。

WordPressの開発に関連する情報を提供しているサイトです。

https://developer.wordpress.org/

Dashiconsの概要

WordPerssが公式に使用しているアイコンがDashiconsになります。

Dashicons は、WordPress 3.8 以降の公式アイコン フォントです。

https://developer.wordpress.org/resource/dashicons/

DashiconsはGPLv2で提供されます。

Dashicons は
GPLv2、またはフォント例外を含むそれ以降のバージョンでライセンスされます。

Dashiconsのより詳しい情報は以下のページからも確認できます。

https://make.wordpress.org/design/2020/04/20/next-steps-for-dashicons/

Dashiconsの使い方

Dashiconsは例えば以下のコードのようにページ上にhtmlのclassに指定の名称を入れることで使用ができます。

<div class="dashicons dashicons-wordpress"></div>

実際に上記のhtmlのソースコードをこのページで記載してみた結果が以下のWordPressアイコンです。

このdiv class=”dashicons xxxx”のxxxxに記載する文字列を以下のDashicons公式ページから確認することができます。

https://developer.wordpress.org/resource/dashicons/

Copy HTMLを押下すると、ページ上に表示させるためのHTMLのコードが表示されるので、表示されたHTMLをコピーしてWordPressで作成するページ上に貼り付けるとアイコンの画像が表示されます。

まとめ

DashiconsはWordPressが公式に提供しているWordPressのページ上に表示させることができるアイコンです。

WordPressで作成したサイト上のページにWordPressに関連するアイコンを表示させたい際にDashiconsを使用します。