こんばんは！Lyustyleです。
ここ数日、サイトデザインで迷走していました。
あまりにあちこち迷走していたため、その間に学んだことがあまりにも多く、そのすべてを記録するわけにはいきませんが、その一旦を記録しておきたいと思います。
目次
事のはじまりはテーマを差し替えたことから・・・
先日まで使っていたテーマ、Atahualpaは、 細かいところまで実際にCSSなどを書かずとも微調整が効くすごいテーマでした。しかし、あまりに細かくできるため、自分が実際にはスタイルシートのどこをいじっているのかがわからず、また、テーマを構成するファイルも、一般的なものとはことなり独自のものがたくさんあるので、思い通りのカスタマイズをすることが自分のちからでは無理。CSSのどれをいじればh2タグのデザインをいじれるのかどうかさえ分からない。
そこで、せっかくならWordpress開発チームがつくっているテーマ、Twenty twelveに変えたわけです。これなら、多くの方のカスタマイズ例なども公開されており、勉強になるなと思いました。
お世話になった記事
- ひとつひとつの投稿タイトルのカスタマイズ
【WordPress】 TwentyTwelveのタイトル表示をカスタマイズする | work.log. - ウィジェットまわりのカスタマイズではこちら
Twenty Twelve ウィジェットのタイトルを大きく | WordPressのプラグインに感謝.
TwentyTwelve サイドバー/ウェジェットタイトルの表示変更 | 初めてのワードプレス カスタマイズ.
ウィジェットのタイトルのカスタマイズなどに大いに参考にさせて頂きました。 - 個別記事の見出し（ｈ２，ｈ３）などのカスタマイズにはこちら
【WordPress】 TwentyTwelveの見出しをカスタマイズする | work.log.
これらのサイト、記事にお世話になりながら、少しずつ「ああ、そうだった。スタイルシートのここをこうしたらよかったんだ。」と楽しみながら調整していました。
ところがあの事件がおこったのでした。
突然、２バイト文字が空白になる！ブログが真っ白け
突然、記事が真っ白になってしまいました。
日本語の文字で描いた部分はまったく表示されず、英数字のみが白い海の中に漂っています。
これは衝撃的でした。
なにがきっかけかよくわからないのですが、どうもWordpressの３．６へのアップデート後に起こったようです。
大変焦りました。見に来てくれた人にもうしわけない。せっかく来てくださったのに真っ白じゃがっかりされるだろう。（実際に、私と同じ症状になっているサイトを見たことがあります。検索していってみたらホワイトアウトだったので、がっかりしました）
何とかしないといけないけど、何をしていいやらさっぱりわからないので、とりあえず他のPCからサイトをみてみる事にしました。
すると・・・
-
iPadminiのサファリでは正常に表示される。
-
MacBookAirのChromeでも問題なし。
ほっとしました。これなら見に来てくれた人は問題なく読めているはずです。
しかしよく考えてみるとこのようになっています。
-
iPadminiはiOS。MacBookAirはMacOS。OSが違うからかもしれない
-
つまり、Windowsの人は何らかの原因で見られないのでは・・・
そこで、別室にあるWindowsPCを使って表示させてみました。
なんと、綺麗に表示されています。
僕のPCでだけ、ホワイトアウトしているのです。
もうさっぱり原因がわかりません。
ここまでが昨日。
今日は、とりあえず他のPCで見られるのだから様子を見ようと思い、更新もMacや別室のPCでやればいいいやと思っていましたが、それでも普段使いのPCで更新できないとやはり不便。
そこで今日は思い切ってテーマを変えました。
最新のThirteenに変えてみました。ところがこちらはデザインのカスタマイズの上でまだまだ情報がすくない。スタイルシートの記述も微妙にかわっているため、お世話になった記事のとおりにはいかないことがわかりました。
もう迷走しています。
テーマをYOKOに変えました。これは素敵なデザインで、カスタマイズ例もたくさんあります。
しかし、スタイルシートやFunctionがテーマようにカスタマイズされたものになっており、まだまだ応用力のない私にはうまくデザインのカスタマイズができない。
残念ながらあきらめます。
またThirteenに戻るか・・・
それともTwenty twelveに戻して、別のPCで作業するか・・・
TwentyTwelveは、ライブプレビューでさえホワイトアウトしているので、一度テーマを削除してまたインストールしなおしたけどやはりだめ。
あれこれさまよってやってきました。
テンプレートタグ/the excerpt – WordPress Codex 日本語版.
気になることが書いてあります。
（注） 日本語のように語句の間を半角スペースで区切らない言語では「55単語」を判定できないため、抜粋できずに本文のほとんどが出力されてしまうことがあります。
WordPress 日本語版では、この問題を含むマルチバイト関連の問題に対処するために WP Multibyte Patch プラグインを同梱しています。このプラグインを使用すると、110文字まで（設定により変更可）を抜粋文として出力できます。
「マルチバイト・・・・？」なんか、そんなプラグインがあったっけ。
WP Multibyte Patch | EastCoder;.
WP Multibyte Patch | EastCoder;
これです。ここに言ってみるとなんと次のようなことが書いてありました。
Twenty Twelve の Open Sans フォント対策
Twenty Twelve テーマの Open Sans Web フォントが一部ブラウザにおいて日本語表示の不具合を引き起こす問題の対応として、翻訳ファイルの有無に関わらず当該フォントの無効化を行う機能を提供します。
これはなんだか、ものすごく関係がある気がします。「日本語表示の不具合」「一部ブラウザ」。
そこで、このプラグインをアップデートしました。
そうすると、見事にホワイトアウトがなおっていました！
ホワイトアウトの原因はTwenty Twelve テーマの Open Sans Web フォントだったようだ
これです。
おかげさまで、現在は普段使いのPCでも順調に表示され、こうして記事を書くことができています。
まだ、実はここには書いていないさまざまな課題があり、その解決をめざしてあっちへいき、こっちへいきの数日間だったのですが、迷走を重ねたかいがあり、ようやく解決できました。
Twenty Twelveの日本語表示周りで苦しんでいる方は、もしかしたら「WP Multibyte Patch 」を最新にしていないからかもしれません。
まめにプラクグインをアップデートする方は大丈夫ですね。
以上、迷走の記録でした。
コメント