1,377 views

この記事は最終更新から 2242日 が経過しています。

WordPressの仕組みで正しいやり方があるのだと思うのですが…

今回はプラグインで独自フォントを組み込んでみます。

■プログラム

たったこれだけで独自フォントプラグインが作れます。
※一部の古いブラウザはTTFファイルに未対応です。
※その場合は、WOFFファイルで公開されているフォントを試してみてください。

addorgfont.php

<?php
/* Plugin Name: Add Org.Font */
////////////////////////////////////////////////////////////////////////
if (class_exists('AddOrgFont')) {
  $obj = new AddOrgFont();
}
////////////////////////////////////////////////////////////////////////
class AddOrgFont{
  public function __construct() {
    add_action('wp_head', array($this,'proc_my_add_css'), 1);
  }
  public function proc_my_add_css() {
    $font_path = plugins_url('MyFont.woff',__FILE__);
echo <<< EOM
<style type="text/css">
@font-face {
  font-family: MyFont;
  src: url({$font_path}) format("truetype");
}
</style>
EOM;
  }
}     // end of class
?>

■作成手順

１） フォントファイルをダウンロードします。
２） 上記プログラムをテキストファイル「addorgfont.php」（文字コード UTF-8）として保存します。
３） 上記１）,２）のファイルを同じディレクトリに置き、一つの ZIPファイル「addorgfont.zip」にまとめます。
４） 「プラグイン」－「新規登録」メニューにて、addorgfont.zip をアプロードし、有効化します。
５） WordPressの投稿文の中で以下のように使います。

<p style="font-family:MyFont>
どうでしょう？
</p>