ミチヨ商店

WordPressを始めて57日目です。今日は、画面の拡大の設定方法についてお話しますよ。

画面を拡大したい

自他共に認めるパソコン周り超初心者の私なので、WordPressのテーマももちろん、いただきものです。スウェーデンのデザイナーさんだったかな。

ある日、自分の記事をスマホで確認していたときのこと。記事内にWordPressの画面をはっているのですが、小さくて見えないことに気づきました。
これは大変！

さらに、親指と人差し指でシュッと広げる、こういうのができません。

改めてみて見ると、他のかたのサイトも、できたりできなかったり。

私の記事はWordPressについてがほとんどなので、画像を拡大できないのはやっぱり困ります・・・。

きっとどうになかるはず！と調べ始めましたが
あれって、何ていうの？？

画面を拡大する操作の名称

操作の名称がわからないと、調べようがないじゃないか！
タップ、はクリックのようなことだし。
ドラッグ・・・、なわけないしな。

ス、がついた気がする。スなんとか。
ス、スウォッチ。そりゃ時計だ。ス、・・・、スウィッシュ、そりゃナイキのマークだよ。

あ、フリック？違う、それは入力のときのやつ。

う～ん、ス、ス、スワ、スワイプじゃない？スワイプでしょ！
でも、違いました。それは、画面をすっとはらうやつだった。

じゃあ、なに？？？

正解は「ピンチ」

やっと、わかりました。ピンチっていうんだって。ピンチイン、ピンチアウト。（そんなの知らない。また、生まれて初めて聞いた）

で、設定方法調べていったことろ、案外簡単にできることがわかり一安心。
難易度★☆☆くらいです。

headerファイルをいじるので、それがちょっとイヤだけど。練習にもおすすめです。テーマのフォルダにある、header.phpをコピーしてからお試しくださいね。

ピンチの設定方法

まずは、お使いのテーマのヘッダーファイルを確認。

外観の[テーマの編集]→テンプレートから[ヘッダー]をクリック。
上のほうにある、metaタグを修正するので、meta nameを探します。

私のテーマにもともと入っていたコードは、次のとおり。
<meta name=”viewport” content=”width=device-width, initial-scale=1.0, maximum-scale=1.0″ >

「拡大は1倍まで」という意味だそう。何も変わらないってことらしい。

上記を、次のとおり書き換えました。

<meta name=”viewport” content=”width=device-width,
initial-scale=1.0, user-scalable=yes, minimum-scale=1.0,
maximum-scale=2.0″>

もし、レイアウトがくずれたら

もしレイアウトがおかしくなったり、表示が変わってしまたら、コピーしておいたheader.phpファイルをftpツールで上書きすれば大丈夫だと思います。

実は私も、誤入力したようで変な画面になって焦りました！

（ほんともう、自分でも期待どおりの動きをすると感心してしまいます・・・。必ず間違うよ。涙）

そのときは、上記にあるテーマの編集画面上で、コードを元に戻したのですが直らなくて、焦ってftpツールを使ったら戻りました。

Tweet