歴史トラベル博物館・美術館・お城・遺跡・神社仏閣を歩いて歴史の探検

ワードプレス難しいー！

TCDのテーマでほんとに困るのが字が小さいこと。標準で12ピクセル（px)か14pxくらい？
これがおしゃれという中の人のイメージなのかもしれませんが、PCでもスマホでも読みにくいったらないのです。
で、調べたら、TCD公式のカスタマイズブログに変え方がありました。

グーグルさまの推奨は本文記事のフォント16pxらしい

tcd-manual.net

TCDテーマのスマホ記事ページの文字の大きさを変更する方法 | TCD LABO

http://tcd-manual.net/?p=3274

Q.スマホ記事の文字のフォントサイズを変更サイトのフォントサイズが小さすぎるとGoogle検索で「ページがモバイル フレンドリーではありません。」と表示されてしまうみたいです。

サイトのフォントサイズが小さすぎるとGoogle検索で「ページがモバイル フレンドリーではありません。」と表示されてしまうみたいです。
今回は、TCDテーマの記事のフォントサイズを大きくする方法をご説明します。

Googleの推奨サイズは16pxのようです。

管理人

じゃあ、最初からそういう設定にしてよー！

こんにちは（14px)

こんにちは(16px)

これくらい違う。（小声）

ともかくTCD公式さまが下のコードがCSSにあるから、「font-size:16px;」を追加しなさいというので。。。

.post p {

line-height: 2;
margin: 0 0 2em 0;
}

ダッシュボードで
外観→テーマの編集→スタイルシート (style.css)
を見て、Cntl＋Fで「post」を探して、
ここかなというところをフォント１４から１６や２６などに更新してみましたけど、PC上は変わりません。

↓

しかし、いろいろやっているうちに解決しました！

すくなくともGENSENのCSSには「.post p」はありませんでした。

かわりにもっと単純に、（sytele.cssで、Cntl+F＝検索で、「基本設定」と検索してでてくる以下のところの下に）

/* ———————————————————————-
基本設定
———————————————————————- */
body { font-family: YuGothic,’Yu Gothic’,’Hiragino Kaku Gothic ProN’,’ヒラギノ角ゴ ProN W3′,’メイリオ’, Meiryo,’ヒラギノ明朝 ProN’,’Hiragino Mincho ProN’,’Arial’,sans-serif; font-size:20px; color:#000; line-height:1.5; width:100%; min-width:1330px; background:#fff; overflow-x:hidden; }
a { color:#000; text-decoration:none; }
a, a .caption, input {
-webkit-transition-property:background-color, color, border-color; -webkit-transition-duration:0.2s; -webkit-transition-timing-function:ease;
-moz-transition-property:background-color, color, border-color; -moz-transition-duration:0.2s; -moz-transition-timing-function:ease;
-ms-transition-property:background-color, color, border-color; -ms-transition-duration:0.2s; -ms-transition-timing-function:ease;
-o-transition-property:background-color, color, border-color; -o-transition-duration:0.2s; -o-transition-timing-function:ease;
transition-property:background-color, color, border-color; transition-duration:0.2s; transition-timing-function:ease;
}
a:hover { color:#b69e84; text-decoration:none; }
.clear { clear:both; }
.hide { display:none; }

この下に
/* 記事の文字サイズ */
p{font-size:20px}
と書き加える。（コードは下のところをコピーしてください）

たったのこれだけ、書いたら解決しました～。(このときはやけになって20pxにしましたが、あとで16pxにしました、短い文は18pxでもいいかも。）

管理人

カスタマイズなんてレベルじゃないっ！もうイヤや！

上の解決に至るまでの試行錯誤（やらないでいいです）

style.css、responsive.css、style_sp.cssどれか

とあるので、ほかの二つも探しましょう。

GENSENには残りの二つのCSSはなさそうです。

editor-style-02.css

というのがあるので、これかな？

@media screen and (max-width: 640px) {

.post p {

font-size:16px;
line-height: 2;
margin: 0 0 2em 0;
}

}

だめでした。

テーマのCSS追加でも追加してもだめです。

Gensenの過剰ぎみのサービスにいろいろな設定がクリックでできるのですが、そのなかのひとつに
外観→TCDテーマオプションの基本設定で、本文のフォントを３つから選べるというのがあります。
ここを設定をかえるとすぐにかわります。

つまり、ここに対応するのが優先で、CSSを追加しても、それが優先されていないようなのです。

このフォントを３つから選ぶというのが、もとのファイルのどこにあるかを探さないといけないようです。

CSSで全部のフォントの数字を２PXあげたりもしてみましたが、タイトルなどの文字は大きくなるけど、記事の文字はかわりません。

もしかして、記事を書くたびに、大きさを指定すればいいの？

それもメンドーだけど。

Studio POPPO公式ブログ「ぽっぽブログ」

 

3 Users

9 Pockets

WordPressで記事内の文字サイズを全体的に変更したい - ぽっぽブログ

https://studiopoppo.jp/poppoblog/business/9204/

こんにちは、スタイルシート初心者の伊達あずさです。 「ぽっぽブログ」も開始からもうすぐ1年が経とうとしています。 当時の私はホームページもブログもやったことがないという全くの初心者だったにも関わらず、独自ドメインを取得してみたり、WordPressでブログを作成するなど無謀極まりない方法で「ぽっぽブログ」を開設してしまいました・・・ しかも、誰にも相談せずに1人でやってしまったんですよね。 今考えると当時の私よく頑張った！！ ・・・しかし、「とりあえずブログとして機能することが優先！！」となってしまっていた...

ぐぐってみたところ、こんなブログがありました。

でも、かわらない。。。

さらにぐぐると

Aoyama's BLOG

WordPressの文字背景やフォントサイズを簡単１発変更するプラグイン【TinyMCE Adva...

http://sorasfocus.com/tool/wordpress/1524/

こんにちは、あおやまです。 今回はTinyMCEAdvancedというプラグインの導入設定方法をお伝えしていき…

まさか、まさか。。。。またプラグイン導入か。。。。

「TinyMCE Advanced」の仲間「TinyMCE テンプレート」はもう入れています。

だったら相性も大丈夫かな。
というわけでインストしてみます。（Wordpressが4.8のままのため、最新のプラグインは4.9から対応のため、一度、削除して、

Advanced Editor Tools (previously TinyMCE Advanced)

ここの一番下にある一つ前のバージョン（4.5.6）のZIPファイルをPCにダウンロード。あらためてWPのプラグイン新規追加から、ZIPファイルをアップロードしてインストしました。

できました！！

ながかった~汗

でもデフォルトでは、小さいままで、

全体を指定して、フォントのサイズを一括して指定しないと、大きくなりません。。。。一手間面倒です。

管理人

SpeechBubbleを使った会話も小さい文字のまま。なんとかしたいなぁ

管理人

この会話文を16pxにあらためて指定すればいいのかな？
できたー！

まだまだ旅は続く

とりあえず、TCDさん早くデフォルトで16pxにしてー！