初めてのウェブクリップアイコン設定 | アルコール依存症回復への道のり〜豊かな感情を求めて〜

アルコール依存症回復への道のり〜豊かな感情を求めて〜

私のアルコール依存症の回復とは幼少期からの生きづらさの克服です。
感謝の気持ち、素直な気持ち、謙虚な姿勢を忘れずに一日断酒を積み重ねていきます。

ウェブクリップアイコンとは…

スマホのホーム画面にあるアイコンのことをウェブクリップと呼ぶみたいです。

スマホ向けのファビコンみたいな感じですね。

これね↓



このウェブクリップアイコンを設定しておけばホーム画面を見たらこのアイコンはどのサイトかすぐにわかるので便利です。

作り方簡単なのでファビコンと一緒に設定してみました。

まずホーム画面に表示させたいアイコンの画像(PNG形式)を用意します。

大きめのサイズで作っておけば縮小されるので144×144以上の正方形の画像にします。

画像の名前はわかりやすいようにwebclip.pngにしてみました。

で、この画像をサーバーにアップします。
FC2ブログの場合はファイルのアップロードをします。

アップロードしたら画像のアドレスをコピー。
http://blog~~~webclip.png

こんなやつ。




例)
http://blog-imgs-84.fc2.com/m/u/n/munmun2/webclip.png

コピーした画像のアドレスを↓の○○○に張り付け。
 

<link rel="apple-touch-icon" href="○○○"/>



貼り付けたらこんな感じになる↓

例)

<link rel="apple-touch-icon" href="http://blog-imgs-84.fc2.com/m/u/n/munmun2/webclip.png"/>



これをテンプレート設定→HTML編集の中に</head> があるから</head>の前にアドレスを張り付け更新。

例)

<link rel="apple-touch-icon" href="http://blog-imgs-84.fc2.com/m/u/n/munmun2/webclip.png"/>
</head>



これで完了。

メモ程度なのでわからなければウェブクリップアイコンで検索してみてください。

初めてのfavicon(ファビコン)設定
http://munmun2.blog.fc2.com/blog-entry-839.html