これはスマホユーザー側がAAを正常表示させる話ではなく、ブログ側がスマホユーザーにAAを問題なく見せられるようにした話です。


　
　 　 　　　＿＿＿_
　 　　　／⌒　　⌒＼
　　　／（ ●） 　（●）＼　　　いやーブログ村にも登録したし
　 ／::::::⌒（__人__）⌒::::: ＼ 　これでPVどんどん増えるだろー
　 |　　　　　|r┬-|　　　　　|　　よかったよかった
　 ＼ 　　 　 `ー’´ 　 　 ／
　
　
　
　
　
　
　
　　 ／￣￣＼
　／　　 _ノ　　＼
　|　　　 （ ●）（●）　　……全然良くないぞ
.　|　　　　 （__人__）　　　これを見てみろ
　 |　　　　　｀ ⌒´ﾉ　　
.　 |　　　　　　 　 }
.　 ヽ　　　　　 　 }
　　 ヽ　　　　　ノ　　　
　　　/　　　 く　
　　　|　　　　 ＼ 　
　 　 |　　　　|ヽ、二⌒)
　

　
　　　　　 　　　＿＿＿_
　　　　 　／::::::─三三─＼
　　　　／:::::::: （ ○）三（○）＼　　　……っ！！
　　　　|::::::::::::::::::::（__人__）:::: 　| 　　あ…ああ……スマホでのAAの表示ね…
　 　　 ＼:::::::::　 　|r┬-| 　 ,／　　　確かに今だとAA表示が
　　　　ノ::::::::::::　　`ー’´　　　＼　　崩れまくってるんだよなぁ…
　
　
　
　
　
　
　
　　 　　　／￣￣￣＼
　　　　／　─　 　 ─ ＼　　まあそれはあれだ……
　　 ／　 （●） 　（●）　 ＼.　見る側の人間にブックマークレットとか
　　 |　　　　（__人__）　U　　|　　使ってもらってだな……
　　 ＼　　　 ｀ ⌒´　　　　／　　　
　　 ／ 　 　 　　　　 　 　 ＼　
　
　
ブックマークレットとは
まあ簡単にいうとAAとかの表示を正しくするコード的なものである
【スマホのブラウザで AA みるやつ（ブックマークレット）の登録のしかたとつかいかた。】
http://togetter.com/li/954323
　
　
　
　　　　 ., ──‐､
　　　 ／　　　　　＼　　おいおいおい
　 　 |　　　　 _ノ　　ヽ　それじゃ全然ユーザーフレンドリーじゃないだろ
　　　| 　　　 （ ●) (●)　ブックマークレットとか使う奴そうそういないって
　　　| 　U　 　 （__人__） , -―ーっ　　どうにかして普通に見る分でも
　　　 |　　　　 ｀ ⌒´ﾉ （ ゝ彡￣　　　AA表示がされるようにしろよ
　　　. ﾝ　　 　 　 　 }　 |.　|
　 ／⌒　 　 　 　 ノ　 .|,　 |
　/　　　ﾉ 　 _ィ ´ー‐ｨ'　　|
../　　 /　　　　r_＿＿__ ノ
/　　 /　 　 　 |i
　
　
　
　
　
　
　
　
　
　
　　　　　 　　＿＿＿　　　　　
　 　 　 　 ／　　　　　＼　　　うーん…それはわかってるんだがAA表示ねぇ
　　　　 ／ 　 ／　 　 ＼＼　　前に調べた時には情報なかったんだよ…
　　　／　 　 （●） 　（●） ＼ 　新情報があればいいのだが……おや？
　 　 |　 U　 　 （__人__）　 　 |　　　　_＿＿＿＿＿＿＿＿＿_
　　　＼　　 　　 ｀ ⌒´ 　 ,／　　　　| |　　　　　　　　　　　　　|
＿＿／　　　　　　　　 　 `ヽ　 　 　 | |　　　　　　　　　　　　　|
| |　/　　 ,.　　　　 　 　 　 　i　 　 　 | |　　　　　　　　　　　　　|
| | /　　 /　　　　　　　　　ｉ　| . 　 　 | |　　　　　　　　　　　　　|
| | |　⌒ ーnｎｎ 　 　 　 　|　|　　　　|_|_＿＿＿＿_＿＿＿＿_|
￣ ＼＿_､("二）￣￣￣￣￣ｌ二二ｌ二二　 ＿|_|＿_|＿
　
　
　
AAを使ったfc2ブログをスマホで見れるようにする設定
http://matometest755.blog.fc2.com/blog-entry-6.html
　
　
　
　 　 　　　＿＿＿_
　 　　　／⌒　　⌒＼
　　　／（ ●） 　（●）＼　　　おいなんだ！それらしい情報があるじゃねぇか！
　 ／::::::⌒（__人__）⌒::::: ＼ 　こいつはやったぞ！
　 |　　　　　|r┬-|　　　　　|　　早速こいつを適応してっと……
　 ＼ 　　 　 `ー’´ 　 　 ／
　
　
　
　
　
　
　
　
　　　　 ＿＿＿_
　　　／　　　　　＼
　.／　　─　 　 ─＼　　……ってあれ？
／ 　　‐=・=‐　‐=・= ＼　全然適応されない……
|　 U　 　 （__人__）　 　 |　うーんどうやらこれは記事毎に挿入されている
＼　　　　　｀ ⌒´ 　 ,／　タグが悪戯をしているようだな……
　
　
　
　
WordPressでAAを正常表示する方法
https://www.tabinomichi.com/?p=157
の
<div style="font-family:'ＭＳ Ｐゴシック','ＭＳＰゴシック','MSPゴシック','MS Pゴシック';font-size:16px;line-height:18px;">この間にAA</div>
↑この表記が邪魔になっているようなのである。
　
　
　
　 　　　＿＿＿_
　　　／　　 　 　＼　　　うーんこれはどうするか……
　 ／　　　　 　 　　＼　方法は二通り考えられる
／ 　　　　　　　　　　＼　一つは記事毎のコードを無視して
|　 　　　＼　　 ,＿　　 |　強制的に変換してしまうという方法
/　　ｕ　 ∩ノ ⊃―）／　そしてもう一つは記事毎のコードを削除して
(　 ＼　／ ＿ノ　|　 |　　ブログ自体の標準表示をAA表示に適したものに
.＼　“　　／＿＿|　 |　　変えてしまうという方法……
　　＼ ／＿＿＿ ／
　
　
　
　
　
　
　
　
　　 　 　 　 ＿＿__
　 　 　 　／　　 　 ＼
.　　 　／　　　　　　　＼　　まあ前から標準表示をAA基準にしようとは
.　　／　／）　ノ ' 　ヽ､　＼　思ってたんだけど
　　|　／ .ｲ '（ー）　（ー）　u|　そうすると今度は普通の文章の時
.　　 /,'才.ﾐ).　（__人__）　 ／　見づらい感じになるんだよなぁ……
.　　 |　≧ｼ'　　｀ ⌒´ 　 ＼
　／＼　ヽ 　　　　　　　　　ヽ
　


　　　 ／￣￣＼
　　／　　 _ノ　　＼
　　|　　　 （ ●）（●）　　ああ、なるほど
　　|　　　　 （__人__）　　AA表示に最適化すると
　　|　　　　　　　　　ﾉ　行間がかなり詰めた感じになるから
　　|　　 　 ∩ノ ⊃ }　　普通の文章が見づらくなるわけか
　 /ヽ　　 ／ ＿ノ }　　
　(　ヽ　 /　　/　ノ
　　ヽ　“　　/＿|　 |
　　　＼＿_/＿＿ /
　
　
　
　
　
　
　
　
　　　　 ＿＿＿_
　　　／　　　　　＼
　.／　　─　 　 ─＼　　まあ今度は逆に普通の文字の時に
／ 　　‐=・=‐　‐=・= ＼　Add Quicktagsでコードを入れればいいかなぁと……
|　 U　 　 （__人__）　 　 |　うん…スマホのアクセスは馬鹿には出来ないし
＼　　　　　｀ ⌒´ 　 ,／　これで行ってみましょう
　
　
　
↑の例、普通の文章の時、例えば
<div style="font-family:'メイリオ', 'Meiryo, Osaka', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif, sans-serif; font-size: 14px; line-height: 150%;" >
この間に文字
</div>
とすれば
　
　 　
そしてWordPressのテーマCSS内の
.entry-content（個別記事の領域、テーマによっては表示が違うかも）を

このように書き換え。
　
.entry-content {
font-family: 'ＭＳ Ｐゴシック', 'MS PGothic', 'MS Pｺﾞｼｯｸ', 'MS Pゴシック', ＭＳＰゴシック, MSPゴシック, IPAMonaPGothic, 'IPA モナー Pゴシック', 'IPA mona PGothic', 'IPA MONAPGOTHIC', Mona, Monapo, Saitamaar, sans-serif;
font-size:16px;line-height:18px;
width: 100%;
padding-bottom: 10px;
border-bottom: 1px solid #e2e2e2;
overflow: hidden;
-moz-text-size-adjust: none;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
text-size-adjust: 100%;
}
　
　
　
.　　　　　　＿＿＿_
　　　　　／　―　　-＼
.　　.　／　 （●） 　（●）　　　すまん……
　　／　　　　 （__人__）　＼　　あってるかどうかはしらん
　　|　　　　 　　｀ ⌒´　　　|
.　　＼　　　　　 　　　　 ／
.　　　ノ　　　　　　　　　＼
　／´　 　　　　　　　　　　ヽ
　
　
　
　
　
　
　
　 　　　＿＿＿_　　
　　　／　　 　 　＼
　 ／　　─　 　 ─＼　　よし、えーとじゃあそれで
／ 　　 （●） 　（●） ＼　今度は今まで記載したタグを消せばいいんだよな
|　 　　 　 （__人__）　 　 |　どのくらい記事ってあるんだっけ
/　　　　 ∩ノ ⊃　　／ 　少ないようなら手作業で消してもいいが…
(　 ＼　／ ＿ノ　|　 |　　
.＼　“　　／＿＿|　 | 　　
　　＼ ／＿＿＿ ／
　

　
　　　　　　 　　　＿＿＿_
　　　　　　　　／　　 　 　＼
　　　　　 　／　─　 　 ─　＼ 　　　うん、440件か
　　　　　／ 　（⌒） 　（⌒）　　＼　　一記事あたり一分で処理したとすると
.　　　　 |　 　　 （__人__）　　　　 |　　まあ7時間強で終わる計算だな
　　　 　 ＼　　 　｀ ⌒´　 　　.／ヽ　楽勝楽勝……
　　　　　　（ヽ、　　　　　　 /￣）　 |
　　　　　　 |　 ｀`ー――‐''|　　ヽ、.|
　　　　　　 ゝ　 ノ　　　　　 ヽ　 ノ　|
　
　
　
　
　
　
　
　
　
　　　　 ／￣￣￣＼　　　　ってそんなわけねーだろ
　　　／　　 _ノ　 ヽ_ ＼　　　死んじまうわ
　 ／　　　（●）　（●） ヽ ミ　　　　　　　ﾋﾟｺｯ
　 |　　　　　 （__人__）　　|. ／＼　　,☆
　 ＼　　　　　｀ ⌒´　 ／　＼　 ＼.／￣￣ ＼　
　　　〉　　　　　　　　く＼.　／＼／　─　 ─　＼　　　
　　/　　　　　　　`ー一⌒)　　　|　 （●） （●）　|　 　
　　|　 　 　 　 ￣￣￣丁　＼　 .| 　 （__人__） 　 |　　　
　　　　　　　　　　　　　　　　 ＼ |　　 ｀ ⌒´ 　 ｜
　　　　　 　 　 　 　 　 　 　 　 　 |　　　　　　　　|
　　　　　 　 　 　 　 　 　 　 　 　 ヽ　　　　　　　}
　　　　　　　　　　　　　　　　　　　 ヽ　　　　　ノ
　　　　　　　　　　　　　　　　　 　 ／　　　　　 ＼
　
　
　
　
というわけで記事内のタグ等々を簡単に置き換えられる
Search Regexというアドオンを導入

　
『Source』は『Post content』（投稿記事）を選ぶ。（というかデフォルトでそれになってるけど）
んで、今回の件ですと
『Search pattern』に
<div style="font-family:'ＭＳ Ｐゴシック','ＭＳＰゴシック','MSPゴシック','MS Pゴシック';font-size:16px;line-height:18px;">
を記載し
『Replace pattern』に
　（全角スペース）
を入れて、『Replace＆save』で置き換え。

その後
</div>
を
　（全角スペース）
に置き換え。
　
特に</div>の置き換えは若干不安でしたが、AA表示以外ではそこまで使用していなかった為影響は少なかったようです。
勿論、この作業は記事内に上のタグを使用してない場合は必要ないですよ。　
　
　
　　　　 ＿＿＿_
　　　／　　　　　＼
　.／　　─　 　 ─＼　これで一括置き換えすればいいと……
／ 　　‐=・=‐　‐=・= ＼　しかし一括変換って不安だよなぁ
|　 U　 　 （__人__）　 　 |　上手くいってくれ……
＼　　　　　｀ ⌒´ 　 ,／　
　

　
　　 ／￣￣＼
　／　　 _ノ　　＼
　|　　　 （ ●）（●）　　おっと上手く行ったようだな
.　|　　　　 （__人__）　　これでPCから見るブログの方はOKってわけか
　 |　　　　　｀ ⌒´ﾉ　　ではスマホからのアクセスはどうするんだ？
.　 |　　　　　　 　 }
.　 ヽ　　　　　 　 }
　　 ヽ　　　　　ノ　　　
　　　/　　　 く　
　　　|　　　　 ＼ 　
　 　 |　　　　|ヽ、二⌒)
　
　
　
　
　
　
　
　 　　　＿＿＿_
　　　／　　 　 　＼ （ ;;;;(
　 ／　　＿ノ　 ヽ__＼) ;;;;) 　　
／ 　　 （─） 　（─ /;;／ 　 その点も悩ましいところなんだけど……
|　 U　 　 （__人__） l;;,´　　　今現在はスマホの表示に
/　　　 　 ∩ ノ)━・’／ 　　WPtouchというプラグインを使っているわけだ
(　 ＼　／ ＿ノ´.|　 | 　　　
.＼　 ” 　／＿＿|　 | 　　　　
　　＼ ／＿＿＿ ／　
　
　
　
　

このようにスマホ向けにサイトを変換してくれるプラグイン。
おしゃれである。
ちなみにこれで使用してるバージョンは4.3.6
　
　
　　 　 　 　 ＿＿__
　 　 　 　／　　 　 ＼　　　そのプラグインの個別記事のスタイルを
.　　 　／　　　　　　　＼　　直接書き換えればいいかな…
.　　／　／）　ノ ' 　ヽ､　＼　プラグインがアップデートされた時が面倒くさいけど
　　|　／ .ｲ '（ー）　（ー）　u|　まあカスタマイズ自体は大したことないし……
.　　 /,'才.ﾐ).　（__人__）　 ／
.　　 |　≧ｼ'　　｀ ⌒´ 　 ＼
　／＼　ヽ 　　　　　　　　　ヽ
　
というわけで
wp-content/plugins/wptouch/themes/bauhaus/default
の中にあるstyle.cssを変更
　
そこの中にある
.post-page-content （個別記事スタイル、674行辺り）
を
.post-page-content {
font-family: 'ＭＳ Ｐゴシック', 'MS PGothic', 'MS Pｺﾞｼｯｸ', 'MS Pゴシック', ＭＳＰゴシック, MSPゴシック, IPAMonaPGothic, 'IPA モナー Pゴシック', 'IPA mona PGothic', 'IPA MONAPGOTHIC', Mona, Monapo, Saitamaar, sans-serif;
color: #000000;
font-size: 60%;
padding-left: 3px;
padding-right: 3px;
overflow: hidden;
margin-left: 0;
}
↑このように変更しました。

　
　
　　　　　 　　＿＿＿　　　　　
　 　 　 　 ／　　　　　＼　　
　　　　 ／ 　 ／　 　 ＼＼　　さーてこれで上手く行くかなー？
　　　／　 　 （●） 　（●） ＼ 　
　 　 |　 　　 　 （__人__）　 　 |　　
　　　＼　　 　　 ｀ ⌒´ 　 ,／　　　
　　　／　　　　　　　　 　 `ヽ　 　
　　/　　 ,.　　　　 　 　 　 　i　
　 /　　 /　　　　　　　　　ｉ　|
　

　
　　 ／￣￣＼　
　／　　 _ノ　　＼　
　|　　　 （ ●）（●）　うーん、大体上手く表示されてるみたいだけど
.　|　u.　　 （__人__）　文字数が多い行は中途半端なところで
　 |　　　　　｀ ⌒´ﾉ　改行されちゃってるな
.　 |　　　　　　 　 }
.　 ヽ　　　　　 　 }
　　 ヽ　　　　　ノ
　 　 i⌒＼ ,__(‐- ､
　 　 l ＼　巛ー─;＼
　　 　|　｀ヽ-‐ーく＿）
.　　　 |　　　　　　l
　
　
　
　
　
　
　　 　 　 ＿＿＿_
　　　　／　　 　 　＼
　　 ／　　─　 　 ─＼　　どうやらそのようだな……
　／ 　　 （●） 　（●） ＼　ならば……
　|　 U　 　 （__人__）　 　 | 　　　
　＼　　　　 ｀ ⌒´　　 ／
,,::-イ.ヽヽ、___ ーーノﾞ-､.
:　 　| 　';　＼_____ ノ.| ヽ　i
　 　 |　　＼/ﾞ（__)＼,| 　i　|
　 　 ＞　　 ヽ. ハ　 | 　 |｜
　
wp-content/plugins/wptouch/themes/bauhaus/default
の中にあるheader.phpの
viewportを下のように
　
<meta name="viewport" content="device-width, initial-scale=0.92" >
　
0.92に変更。

　
　
　 　　　＿＿＿_　　
　　　／　　 　 　＼　　　　えーと…これはまあ簡単に説明すると　　　　　　　　　　
　 ／　─　 　 ─　＼　　　スマホで見る場合　　　　　　　　　　
／ 　 （●） 　（●）　 ＼　　0.92倍に縮小して表示するって感じです
|.　 　　 （__人__）　　 　 |　　多分……
/　　　　 ∩ノ ⊃　　／　　
(　 ＼　／ ＿ノ　|　 |　　 　
.＼　“　　／＿＿|　 | 　　　
　　＼ ／＿＿＿ ／　
　
なんでそんなに中途半端な数字かというと
僕のサイトの場合それが丁度良かった為です。
皆さんは自分のサイトにあった縮尺を選んでみてください。
　
　
　
　
　
　　　 ／￣￣＼
　　／　　 _ノ　　＼
　　|　　　 （ ●）（●）　　…大体良くなったようだけど
　　|　　　　 （__人__）　　まだ少し改行で乱れてるところがあるなぁ……
　　|　U　　　　　　　ﾉ
　　|　　 　 ∩ノ ⊃ }
　 /ヽ　　 ／ ＿ノ }
　(　ヽ　 /　　/　ノ
　　ヽ　“　　/＿|　 |
　　　＼＿_/＿＿ /
　
　
　
　
　
　
　　　　 ＿＿＿_
　　　／　　　　　＼
　.／　　─　 　 ─＼　　うーん…正直これ以上viewportで調整するのは
／ 　　‐=・=‐　‐=・= ＼　文字が小さくなりすぎてよくなさそうなので
|　 U　 　 （__人__）　 　 |　そういった少し改行が乱れてる部分は
＼　　　　　｀ ⌒´ 　 ,／　手作業で直すことにしよう
　

　 　 　　　＿＿＿_
　 　　　／⌒　　⌒＼
　　　／（ ●） 　（●）＼　　　まあというわけでこんな感じで完成ーー！　
　 ／::::::⌒（__人__）⌒::::: ＼ 　これでスマホからでも
　 |　　　　　|r┬-|　　　　　|　旅の道第三停留所でAAが綺麗に見えるようになったぜ
　 ＼ 　　 　 `ー’´ 　 　 ／　というわけでこれからも宜しくお願いしますよ！
　
　
　
　
　
　


ブログランキングに参加中。
よかったら↓をクリックして貰えるとありがたいです。
更新の励みになります。