今回はCSSについて・・・と見せてWordPressカスタマイズの記事です。
ホームページやブログでAA（アスキーアート）が崩れてしまうことがあります。

以下は修正方法です。



まず、適切なCSSを設定してフォントや文字幅などを調整します。

font-family: IPAMonaPGothic,'ＭＳ Ｐゴシック',sans-serif;
font-size  : 16px;
line-height: 18px;

大抵はこれで表示がうまくいくのですが、
WordPressには半角のダブルクォーテーションを自動で変換してくれる機能があり
これが悪さしてAAが崩れてしまうことがあったりします。

例）


これを修正するには
wp-includesディレクトリ内にある「formatting.php」を修正します。
（修正は自己責任で）

置換しているあたりをコメントアウト

		// Only call _wptexturize_pushpop_element if first char is correct tag opening
		$first = $curl[0];
		if ( '<' === $first ) {
			_wptexturize_pushpop_element($curl, $no_texturize_tags_stack, $no_texturize_tags, '<', '>');
		} elseif ( '[' === $first ) {
			_wptexturize_pushpop_element($curl, $no_texturize_shortcodes_stack, $no_texturize_shortcodes, '[', ']');
		} elseif ( empty($no_texturize_shortcodes_stack) && empty($no_texturize_tags_stack) ) {
			// This is not a tag, nor is the texturization disabled static strings
			$curl = str_replace($static_characters, $static_replacements, $curl);
			// regular expressions
			//$curl = preg_replace($dynamic_characters, $dynamic_replacements, $curl);
		}
		$curl = preg_replace('/&([^#])(?![a-zA-Z1-4]{1,8};)/', '&#038;$1', $curl);
	}
	return implode( '', $textarr );
}

これで綺麗にAAが表示されましす。やったね（＾ω＾）

　　　　　 _,,....,,_　
　　　-''":::::::::::::｀''-､
　　　ヽ::::::::::::::::::::::::::::ヽ
　　　　|::::::;ノ´￣＼:::::::::::＼_,. -‐ｧ　　　　　＿_　　 _____　　 ＿_____
　　　　|::::ﾉ　　　ヽ､ヽr-r'"´　　（.__ 　　　,´　_,, '-´￣￣｀-ゝ 、_ イ、
　　　_,.!イ_　　_,.ﾍｰｧ'二ﾊ二ヽ､へ,_7　 　 'r ´　　　　　　　　　　ヽ、ﾝ、
_..,,-":::::rｰ''7ｺ-‐'"´　 　 ;　 ',　｀ヽ/｀7　,'＝=─-　　　 　 -─=＝',　i
"-..,,_r-'ｧ'"´/　 /!　ﾊ 　ハ　 !　　iヾ_ﾉ　i　ｲ　iゝ、ｲ人レ／_ルヽｲ i　|
　　`!イ´ ,' |　/__,.!/　V　､!__ﾊ　 ,'　,ゝ　 ﾚﾘｲi (ﾋ_] 　　 　ﾋ_ﾝ ).| .|、i .||
　　　`! 　!/ﾚi'　(ﾋ_] 　　 　ﾋ_ﾝ ﾚ'i　ﾉ　　　!Y!""　 ,＿__, 　 "" 「 !ﾉ i　|
　　　,'　 ﾉ 　 !'"　 　 ,＿__,　 "' i .ﾚ'　　　 .L.',.　 　ヽ _ﾝ　　　　L」 ﾉ| .|
　　ノﾉ （　　,ﾊ.　　　 ヽ _ﾝ　 　人!　　　　 | ||ヽ、　　　　　　 ,ｲ| ||ｲ| /
　（ ,.ﾍ ,）､　　）＞,､ _____,　,.イ　 ハ　　　　レ ル｀ ー--─ ´ルﾚ　ﾚ´