【初心者】アフィンガー５の使い方！ブログをスマホで画面拡大する方法

こんにちは、ブロガーちゃんさとです。

先日、ブログをスマホで確認していたときに気づいたんです。

指２本で画面をさわっても拡大・縮小されない！

ほかのアフィンガー５のブログではできるのに…

なんで？

試行錯誤しながらいろいろ調べて設定できたので、設定方法をまとめました。

この記事を書いている人

ちゃんさと　女性　１９９２年生まれ　

元公務員の主婦ブロガー💻
ブログ歴９ヶ月目（2021年6月時点）
アフィンガー歴４か月目（2021年6月時点）
パソコンが苦手で、ブログやテーマの設定にはかなり苦労しながら挑戦中！
アフィンガー５使用者やブログ初心者向けに、分かりやすく悩みが解決できる記事をめざしています。

それではさっそく参りましょう、ラインナップはこちらです。

【初心者向け】アフィンガー５の使い方

アフィンガー５では、初期設定で画面拡大・縮小させる機能がオフになっています。

この機能をオンにすればOK！

…といっても初心者にとっては何がなんだかわかりませんよね。

ひとつずつ見ていきましょう。

ちなみに指２本で画面を拡大・縮小させることをピンチアウト・ピンチインというらしいです。

画面拡大：ピンチアウト
画面縮小：ピンチイン

ブログをスマホで画面拡大・縮小させる方法

アフィンガー５でブログをスマホで画面拡大・縮小させる方法です。

私が使っているアフィンガー５とレンタルサーバーの画面で説明しますね。

全体の流れ

子テーマにhead.phpがあるか確認
レンタルサーバーからhead.phpを子テーマにダウンロード＆アップロード
子テーマ（affinger5 child）のテーマエディターを修正
親テーマ（affinger5）のテーマエディターを修正

あせらずゆっくりやりましょう！

子テーマにhead.phpがあるか確認

まずはワードプレスの管理画面から

外観⇒テーマエディターを選択します。

右上のテーマ選択のところでaffinger5 childを選択

テーマファイルの項目にheader.phpがあるかどうか確認します。

ある⇒OK！（記事の2.省略、3.子テーマの修正から読み進めてください。）

ない⇒レンタルサーバーからダウンロード＆アップロード

項目にhead.phpがなかった人はレンタルサーバーの設定が必要です。

レンタルサーバーからheader.phpを子テーマにダウンロード＆アップロード

レンタルサーバーにログイン＆ファイル管理を開きます。

つぎにaffinger5とagginger5-childのファイルをさがします。

以下のファイル名のなかに入っています。

public_html
⇒wp-content
⇒themes
⇒affinger5とagginger5-child

affinger5とagginger5-childのファイルにたどりつけばOKです。

public_html

wp-content

themes

affinger5のファイルを開きます。

head.phpを選択、ダウンロードします。

つづいて、agginger5-childのファイルを開きます。

さきほどダウンロードしたhead.phpをagginger5-childにアップロードします。

ワードプレス画面のテーマファイルに反映されているか確認してください。

head.phpの項目が追加されていればOKです。

子テーマ（affinger5 child）のテーマエディターを修正

ワードプレスの管理画面

外観⇒テーマエディターを選択します。

右上のテーマ選択のところでaffinger5 childを選択します。

テーマファイルから、追加されたhead.phpを選択します。

そうすると上から13行目に、

というコードがあります。

このuser-scalable=noのところをuser-scalable=yesに書き換えます。

書き換えてファイル更新をしたらOKです。

親テーマ（affinger5）のテーマエディターを修正

次に親テーマの修正です。

ワードプレスの管理画面

外観⇒テーマエディターを選択

右上のテーマ選択のところでaffinger5を選択します。

そしてテーマの項目のなかから、テーマヘッダー（header.php)を選択します。

子テーマと同じで上から13行目に、

というコードがあります。

このuser-scalable=noのところをuser-scalable=yesに書き換えます。

書き換えてファイル更新をしたらOKです。

スマホでブログを確認してみましょう。

指2本でスマホ画面の拡大・縮小ができるようになっているはずです。

アフィンガー５初心者の失敗談

テーマを修正したのに、スマホで画面拡大ができない！なんで？

わたしは子テーマだけ修正して、親テーマの修正をしていなかったためにスマホに反映されず苦労しました。

テーマを修正するときは、子テーマと親テーマどちらもセットで確認することを学びました。

初心者のひとは覚えておくと良いです。

まとめ

ブログをスマホで画面拡大・縮小させる、アフィンガー５初心者向けの使い方はこちらです。

全体の流れ

子テーマにhead.phpがあるか確認
レンタルサーバーからhead.phpを子テーマにダウンロード＆アップロード
子テーマ（affinger5 child）のテーマエディターを修正
親テーマ（affinger5）のテーマエディターを修正

お疲れさまでした！

※アフィンガー５の吹き出しでお困りのかたへ

アフィンガー５での吹き出しの作り方についてはこちらの記事をご覧ください。

: アフィンガー５吹き出しの色変更＆右側＆作り方【画像20枚付】

続きを見る

※ブログを始めるのにレンタルサーバーで悩んでいるかたへ

ブログを始めるひとにおすすめのレンタルサーバーはConoha WING（コノハウィング）かエックスサーバーです。

スペックほぼ同じで、速度は少しコノハウィングが上です。

エックスサーバーは実績がある分えらばれやすいですが、どちらをえらんでも問題なくブログが始められます。

ちなみにわたしはエックスサーバーを使っています。

どちらもキャンペーンなど頻繁におこなっていますので、お得なほうを選ぶと良いでしょう。

(PR)

ConoHa WING

エックスサーバー公式サイト＞＞https://www.xserver.ne.jp/

今回は以上です。

参考になればうれしいです。

ありがとうございました。