記事内に脚注を挿入するプラグイン【Modern Footnotes】の使い方

記事内に脚注を挿入するプラグイン【Modern Footnotes】の使い方

記事を書いている際に専門用語などが出てきた場合、少し詳しく解説したい、と思うことがあります。
でも説明を書いていると、文章が長くなってしまったり、文脈がおかしくなってしまう。
そんなときは、文章に脚注をいれてみるのがおススメ。

脚注とは、文章の途中で解説が必要になった場合、その説明を文章内ではなく、本文下部などの欄外に注釈したもののこと。

Modern Footnotes】は、記事に脚注を挿入できるようにするプラグイン。
補足情報を欄外に持ってくることで、文脈が乱れず文章が読みやすくなります。

こんな場合におススメ

  • 記事に脚注をいれたい
  • 補足情報を入れつつ、文章を読みやすく表示したい

プラグインを使ってできること

  • 記事に脚注を挿入することができるようになる
  • ツールチップでの表示、または脚注番号の下部に表示するかを選択することができる

使用イメージ

ツールチップでの表示

Modern Footnotes 使用イメージ

脚注番号の下の行に表示する場合

Modern Footnotes 使用イメージ

インストール方法

Modern Footnotes インストール

  1. ダッシュボードから プラグイン > 新規追加 とクリックする
  2. Modern Footnotes“で検索する
  3. “今すぐインストール”をクリック。インストール後、有効化する

または、配布サイトからダウンロードして、インストール。
Modern Footnotes – WordPress プラグイン | WordPress.org

手動でインストールする方法はコチラ
WordPressのプラグインをインストールする方法WordPressのプラグインをインストールする方法

脚注の表示方法

脚注を入れたい語句の後ろに、下記のようにショートコードを記述します。

ショートコード

脚注を入れたい語句[mfn]ここに脚注文を記述[/mfn]

Modern Footnotesの設定

プラグインを有効化すると、管理画面 > 設定 に Modern Footnotes が追加されるので、そこから行います。

Modern Footnotes 設定

Expandable footnotes on desktop脚注の表示スタイルを選択する。
未チェック:脚注番号クリックでツールチップを表示
チェック済み:脚注番号の下の行に脚注を表示
Modern Footnotes Custom CSS表示デザインをCSSでカスタマイズする場合に記述する。

.modern-footnotes-footnote:脚注番号を表示する上付き文字要素
.modern-footnotes-footnote–selected:現在アクティブな上付き要素
.modern-footnotes-footnote__note:モバイルとデスクトップの両方の脚注に適用されるスタイル
.modern-footnotes-footnote__note–mobile:モバイル脚注のスタイル
.modern-footnotes-footnote__note–desktop:デスクトップの脚注のスタイル

Modern Footnotes Custom Shortcode[mfn]または[modern_footnote]以外のショートコードを使用したい場合は、括弧なしで記述する

動作確認環境

  • バージョン 1.3.0
  • WordPress 5.2.2
このプラグインは上記の環境で動作を確認しましたが、ご使用の環境によっては、動作しないなどの不具合が起きる可能性がありますので、ご注意ください。

まとめ

  • 【Modern Footnotes】は、記事に脚注を挿入するプラグイン。
  • 補足情報などを開設する場合は脚注をいれて文章を見やすくするのがおススメです。

ランキングに参加しています。

にほんブログ村 IT技術ブログ WordPressへ
クリックしていただけると、ブログ更新の励みになります。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA