livedoorブログ(スマホ版)フリーエリア利用でタイトル画像を入れる方法ライブドアブログ

livedoorブログのスマホ版にリンク付きタイトル画像を入れる方法

ライブドアのスマホ版のタイトルをリンク付きの画像に変更します。

画像/ファイルに画像を登録する

ブログ設定＞スマートフォン＞レイアウト
でトップページを選択
右側に並んでいるアイテムから「フリーエリア」上にカーソルを移動「追加」をクリックする

左側に「フリーエリア」が表示されたら、一番上にドラックする

一番上に移動した「フリーエリア」の上にカーソルを置くと表示される「設定」をクリックする

最上部の枠の中に下記のソースを記入する

<a href="リンク先 " target="_blank"><img width="100%" src="画像URL "></a>

<a href="リンク先 " target="_self"><img width="100%" src="画像URL "></a>

リンク先は、ブログトップページのURLを入れる

画像URLには、先ほど画像登録した画像のURLを入れる

画像URLの確認方法
登録した画像を⇒クリックして新しいタブで開く
開いた画像ページをの、ブラウザ上部に表示されているURLをコピーする

※上記のソースでは、リンク先を新規のウィンドで表示させたい場合は、 _blank　を使い、　
同じウィンドで表示させたい場合は、 _self　を使う

ラベルに「ブログのタイトル」を入力し、表示するはチェックしない

※ブログタイトルをラベルにしておくと、画像の設定をしてなくてもタイトルが表示されるので、裏ワザ的に使うこともできます

枠表示は非表示

改行設定は変換しない

「保存する」

「完了」

以上で設定完了です。
「表示を確認する」で確認をしてみましょう。

画像のサイズにかかわらず、横幅を調節してくれる設定になっていますので、美しく表示されているはずです。

スマホやタブレットがあれば、そちらでも確認をしましょう。
リンクが有効かも確認が必要です。

「トップページ」のタイトル画像設定がうまくいったら、フリーエリアに入れたソースをコピーして、「アーカイブページ」「個別記事ページ」「画像ページ」も同様に設定します。

以上でライブドアブログ（スマートフォン版）のタイトル画像設定は完了です。

ライブドアの規則で、フリーエリアに使える外部リンクは制約があります。
広告や外部リンクなどは使えませんので、ご注意ください。