iPhoneのホーム画面にWebサイトのショートカットを設定すると、デフォルトだとサイトのキャプチャー画像が表示されます。
折角だからオリジナル感を出したいという方にオリジナルアイコンの設定方法をご紹介します。
WordPressでのアイコンの設定方法
１、最初に表示用のアイコン画像を用意します。
◆サイズは114ピクセル×114ピクセル
◆ファイル形式はPNG
◆ファイル名は任意（私は、”apple-touch-icon.png”としました。）
２、アイコン画像をアップロードします。
◆アップ場所は任意（私は、スマフォ用テーマを導入していたので、wordpressがインストールされているディレクトリにしました。）
◆管理画面のメディアライブラリからアップロードしても構いません。
３、header.phpにコードを挿入
◆header.phpファイルの＜head＞タグ内に下記のコードを挿入します。
<link rel="apple-touch-icon" href="画像パス" />
◆画像パスは”1″と”2″の手順で追加した場所とファイル名になります。（私の場合は、トップ階層だったので、単純にファイル名のみで “apple-touch-icon.png”となります。）
◆”2″でメディアライブラリから登録した方は絶対パスでの指定となります。
【注】私は、モバイルテーマとして、Jetpackのモバイルテーマを使用していたので、通常のテーマファイルのheader.phpを変更しても反映されませんでした。同じようにモバイルで別テーマを導入されている方はご注意を。ちなみにJetpackのテーマファルのカスタマイズ方法は下記のサイトでご紹介されています。
リンク：「WordPressのJetpackモバイルテーマをカスタマイズする方法」
４、設定完了
こんな感じです
↓↓↓↓↓↓↓↓↓↓↓
設定は思ったよりも簡単です。
まぁ、結構自己満足も入ってますが、かなりオリジナル感は出せますので是非やってみて下さい。
iPhoneでWebサイトをショートカットとして保存しておく方法
今更ですが、これ載せておくと何人かの人はサイトを登録してくれるんじゃないかという淡い期待も込めつつご紹介しますw
Safariでページを開くと、一番下に上の画像のようなアイコンが表示されていますのでタップして下さい。
次にこのような画面になるので、「ホーム画面に追加」をタップ
ホーム画面での表示は自由に変更できますので、ご自由に
以上で設定完了です。
