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″>
user-scalable=yesというのは、「ズームOK」ということだそう。
もし、レイアウトがくずれたら
もしレイアウトがおかしくなったり、表示が変わってしまたら、コピーしておいたheader.phpファイルをftpツールで上書きすれば大丈夫だと思います。
実は私も、誤入力したようで変な画面になって焦りました!
(ほんともう、自分でも期待どおりの動きをすると感心してしまいます・・・。必ず間違うよ。涙)
そのときは、上記にあるテーマの編集画面上で、コードを元に戻したのですが直らなくて、焦ってftpツールを使ったら戻りました。
おかげさまで、ピンチで拡大できるようになりました!よかった~