【WordPress】paragraphブロックバーの文字装飾「斜体」っていつ使う?疑問解決からcss変更まで

WordPressのブロックエディタでパラグラフ(paragraph)を選択して文字入力している時、ブロックツールが表示されます。

そのブロックツール内の「B」の隣りに「/」がありますが、文字入力したその文字を選択した状態で「/」をクリックすると、文字が斜めに傾きます。この斜めに傾いた文字を斜体と言います。では、この斜体っていつ使うものなのでしょうか?

今回はまず斜体について説明し、その後に斜体装飾が適応されているparagraphブロックバーの文字装飾変更手順をお伝えします。

もくじ

斜体とは

斜体は、欧文(アルファベットを用いた文)の立体活字(斜めになってない普通の文字)を右に傾けた形のことを言います。左側に傾けた斜体もあり、左斜体と呼びます。斜めになびいているような状態の文字が斜体で書かれた文字です。

いつ、どのように使うの?

では、斜体はどのような時に使うのでしょうか?

欧文では、立体活字の文中の語句を強調・区別する目的で使用されている。欧米文での斜体の一般的な使用法としては下記のようなものがある。

・語句の強調
・書名、雑誌名、新聞名等の引用
・船の名称
・外国語
・専門用語などを取り上げそれについて解説する時のその当該語句。
・生物の2名法(属および種の表記)
・物理量や数学の変数として用いられる記号
・引用元のWebページアドレス

文全体が斜体になっている場合で、その中でまた斜体を使うことが必要な場合は、その語句は立体で表記する。使用の有無や使用頻度、使用法は文献によって異なるが、学術論文や学術誌では比較的多く見られる。

ウィキペディア 斜体

斜体の一般的な使用法は、文中の語句の強調や区別のためだとわかりました。

斜体の使用例を見てみよう

実際の使用例を見てみましょう。参考にウィキペディアで「blog」を検索してみました。

Blog …省略… Many blogs provide commentary on a particular subject or topic, ranging from politics to sports. Others function as more personal online diaries or online brand advertising of a particular individual or company. A typical blog combines text, digital images, and links to other blogs, web pages, and other media related to its topic. The ability of readers to leave publicly viewable comments, and interact with other commenters, is an important contribution to the popularity of many blogs. However, blog owners or authors often moderate and filter online comments to remove hate speech or other offensive content. Most blogs are primarily textual, although some focus on art (art blogs), photographs (photoblogs), videos (video blogs or “vlogs“), music (MP3 blogs), and audio (podcasts). In education, blogs can be used as instructional resources; these are referred to as edublogsMicroblogging is another type of blogging, featuring very short posts. …省略…

Wikipedia Blog

専門用語に斜体を使用しているのがかわりますね。

和文で斜体は使う?

上記の使用例は欧文でした。では和文では斜体をどう使うのでしょうか。

和文で斜体を使うのは稀

じつは、和文で斜体が使用されるのは稀です。たしかに和文ではあまり見かけませんよね。欧文での斜体の使用例を説明する際に利用したウィキペディアのblogを日本語版にして見てみましょう。

ウェブサイトとしての体裁は、主として管理者が記事を投稿する私的ニュースサイト、あるいは公開日記である。特定の投稿方法に限定はされないが、ブログ向けのソフトウェアやウェブスペースがあり、それをダウンロードやレンタルして使えば、HTMLを知らなくても、自身のブログとしてウェブブラウザから手軽に情報の発信・更新ができる。

ウィキペディア ブログ

日本語版では、欧文で斜体表記されていた専門用語の部分に斜体が適応されていませんでした。

和文で語句を強調したい時はどうするの?

では、和文で語句を強調・区別したい時はどうするのでしょうか?

和文で語句を強調・区別したい時は、太字を使用したり、鉤括弧(「…」)を使用します。欧文と和文では、語句を目立たせたい時の発想が根本的に違うようです。実際、テキストエディタによっては、日本語用フォントに最初から斜体がない場合もあるようです。

一方でWindows Vista 以降のマイクロソフト製 OS に標準で搭載されているメイリオでは、「欧文とは違い日本語には斜体を使う文化的背景がない」という理由から、日本語文字の斜体は用意されていない。メイリオの場合、文章をイタリックに指定しても、欧文は斜体になっても日本語部分は斜体にならない。

ウィキペディア 斜体

なぜWordPressに斜体があるの?

WordPressは欧文を使用する文化圏で開発されたので、斜体が標準装備されています。

もしもWordPressが日本で開発されていたら、「/」には斜体ではなくて別の文字装飾が当てはめられていたかもしれません。

実際に「/」を別の文字装飾に変更する

和文入力を中心にWordPressを使用する場合、「/」が斜体装飾のままだと「/」をほとんど使わないままになってしまい、少しもったいない気がします。

そこで、この「/」に別の文字装飾を適応して、和文入力でも使用しやすいようにしたいと思います。

どのような文字装飾がいいか

では、和文入力で使用する文字装飾として適したものは何か考えてみましょう。

ブロックツール内の「/」の隣りの「B」はBoldのBで太文字のことです。実際に適応してみると、結構目立ちます。太文字は、欧文だけでなく和文においても語句を強調・区別する時に利用できる便利な文字装飾です。ですから、太文字はそのまま利用することにして、太文字以外の文字装飾を考えることにします。

蛍光ペン風の太めアンダーラインも、和文に適した文字装飾です。学生の時、文中の語句を目立たせたい時によく利用しましたよね。実際に適応してみましたが、いかがでしょうか?蛍光ペン風の太めアンダーラインも語句を目立たせることのできる文字装飾かと思います。

ということで、これ以降は「/」の文字装飾を「蛍光ペン風の太めアンダーライン」に変更する方法をお伝えします

文字装飾を変更する方法

文字装飾を変更する方法を順番をおってお伝えします。

書き込み先に移動

WordPressの管理画面から、

「管理画面 —> 外観 —> カスタマイズ —> 追加CSS」の順番で移動する。

文字装飾用のCSSを書き込む

追加CSSのところにCSSコードを書き込みます。

①のところに蛍光ペン風の太めアンダーラインになるCSSコードを書き込みます。書き込むコードは以下です。

em{/*「em」は元々の文字装飾である「斜体」のこと*/
  background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #ffff66 0%) repeat scroll 0 0;/*アンダーライン部分のコード。今回は色を#ffff66にしました。*/
  font-style: normal;/*斜体をキャンセルしている*/
  font-weight: bolder;/*太文字にしている*/
}

上部に表示されている②「公開」をクリックすると、「/」の文字装飾が変更されます。

アンダーライン以外の文字装飾も可能

「/」をアンダーライン以外の文字装飾に変更したい場合も、同様の方法で変更が可能です。(ここに自分が)

em{
/*///ここから///*/
ここに文字装飾用のCSSを書き込む
/*///ここまで///*/
}

元に戻したい場合

変更した文字装飾のCSSを解除して元の状態に戻したい場合は、追加CSSに書き込んだCSSコードを全て消去してから、もう一度、②「公開」をクリックすれば、元の状態に戻ります。

まとめ

斜体は欧文のための文字装飾でだとわかりました。

また、欧文用に開発されたWordPressを和文用にカスタムする方法もお伝えしました。

カスタムしたブロックツールを使い、読みやすい文章を書きましょう。