FC2ブログ

FaviconとApple-touch-icon設置 その3

コンニチハです
(東京から…)

FaviconとApple-touch-icon設置
その3です
(今日で完成です)

ざっくりいうと
1…アイコンにしたい画像を用意
2…作成したアイコンを
  アイコン用拡張子に変換する
3…変換したアイコンを
  アップロードする
4…ブログのHTMLに追加書き込み

1と2と3は昨日までに完了して
コピペしたものがあります

A✿アイコン作成画面から
 先ほどコピペした9個のコード
B✿画像をアップロードしたあとに
 ファイル場所を9個コピペしたもの

コピペ保存したA
コード画像赤640

赤い部分をBに変えます

コピペ保存したB
ファイルパス画像赤640

このAとBを合わせます

合わせた例
例

9個合わせたコードが出来上がります
(サイズの同じ数字と組み合わる)

4…ブログのHTMLに追加書き込み

ブログ管理画面
  ↓
テンプレートの設定
  ↓
PC用テンプレート管理
  ↓
HTML編集
  ↓
この中から<head>と</head>を探す

<head>から</head>の中に
さきほど用意した9個のコードを追加します
わかりやすいように
<head>の次の行に9個入れます


<head>
<link rel=shortcut icon…

9個入れたら
  ↓
更新をクリック

これでPC用の
ファビコンとアイコンが
完成します

スマートフォン用テンプレートにも
同様に<head>のあとに入れます

これでスマホ用の
ファビコンとアイコンが
完成します

なぜ9個も入れるのか?
スマホやタブレットの画面は
メーカーなどでサイズが違います
種々な画面に合うように
9個入れています

iPhoneホーム画面
20150426230108249.jpg

Androidホーム画面
201504262301467f4.jpg

どちらにも
kikiアイコンが
見えるようになりました

面倒なようですが
手順を追っていけば
意外と簡単です
やってみませんか?

kikiアイコン
201504280043057b4.jpg

kikiアイコンのワンコはなに?
名前はちっぷちゃん
本物の犬?
ぬいぐるみ?
そのジャンルじゃないです

ちっぷちゃんは…
    ちっぷちゃんなのです



アニメねずみ
↓↓ポチッと応援してね。


コメント

Secret

メッセージ
プロフィール

kikilalacafe

管理人:kikilalacafe
身近に見たもの
食べたもの
感じたものを
気の向くままに…
iPhoneで撮影して
アップしています
やっと機種変して
iPhone Xs Max 使用しています。

ブロとも申請フォーム

この人とブロともになる

最新記事
カテゴリ
月別アーカイブ
リンク
最新コメント
検索フォーム
全記事表示リンク

全ての記事を表示する