WordPressでAAを綺麗に表示する方法

忙し過ぎて、艦これすらやる暇がない件について。
正確には僅かながら時間はあるけど、艦これ触ってると何も出来ないので触らないが正解なんですけどね!

さて。
今回は、自分用に書き留めておきます。

WordPressだけの事ではないのですが、blog等を書いていると、直面するアスキーアート(AA)の『ズレ』の問題。
AAを使うblogがどの程度存在するかは知りませんが、使っている人なら思い当たると思います。
多少ズレる程度ならいいのですが、原型が分からないぐらいズレてしまうのは、考え物ですよね。
私の場合はそこまで酷いズレではないのですが、やはり気分的に宜しくありません。
どうした物かと調べてみた所、WPでプラグインを入れなくても、<div>タグを用いる事によって、AAを綺麗に表示できるようなのです。

そのタグは以下の通り。


[note]<div style=’font-size:12pt;line-height:18px;font-family: “Mona","IPA MONAPGOTHIC","MS PGothic","MS Pゴシック","MS Pゴシック","MS Pゴシック",sans-serif;’>ここにAAを入れる</div>[/note]

こちらの<div>タグを適用するだけで、美麗なAAをblogで再現する事が出来ます。
一時期はCSSを使ってHPを作っていましたが、実は解説本やネット等で調べつつ作っていたので、CSSはさっぱり理解できていません(笑)。
しかし、これはコピペをして使うだけなので、実に簡単です。
では実際に、AAに対する効果を見てみましょう。

■ノーマル
 ̄ ̄ ̄ ̄
 *     +    巛 ヽ
            〒 !   +    。     +    。     *     。
      +    。  |  |
   *     +   / /   イヤッッホォォォオオォオウ!
       ∧_∧ / /
      (´∀` / / +    。     +    。   *     。
      ,-     f
      / ュヘ    | *     +    。     +   。 +
     〈_} )   |
        /    ! +    。     +    +     *
       ./  ,ヘ  |
 ガタン ||| j  / |  | |||
――――――――――――

■タグを適用した場合

 ̄ ̄ ̄ ̄
 *     +    巛 ヽ
            〒 !   +    。     +    。     *     。
      +    。  |  |
   *     +   / /   イヤッッホォォォオオォオウ!
       ∧_∧ / /
      (´∀` / / +    。     +    。   *     。
      ,-     f
      / ュヘ    | *     +    。     +   。 +
     〈_} )   |
        /    ! +    。     +    +     *
       ./  ,ヘ  |
 ガタン ||| j  / |  | |||
――――――――――――

と、私が良く使っているIYHスレのAAですが、比較すると全然違いますね。
<DIV>タグを導入するだけで、このようにAAを綺麗に表示する事が出来るわけです。

更にWPには『addQuicktag』と言う便利なプラグインがありますので、予めこのタグを登録しておくと、ボタン一発で呼び出す事が可能。
ちょっとした事ですが、blogが綺麗になる事は良い事だと思います、はい。