livedoor™ブログでHTMLの修正を行う方法

livedoor™ブログではHTMLの編集を認めている無料ブログサービスです。
そのlivedoorブログでHTMLの編集を行う方法をご紹介しておきます。
他のサイトでもご紹介されているでしょうが、補足説明としてご紹介しておきます。

はじめに

livedoorブログといえばアフィリエイターの方などによく利用されているブログでしょう。
それはHTML編集ができたり、商用利用を認めていたりと、
自由度が高いサービスであるためではないかと思います。

既にご利用の方はHTMLの編集もされているでしょうから、
特に難しいことはないかもしれません。

HTML編集の方法

HTMLの編集は以下の手順で行います。

livedoorブログにログインしマイページから[ブログ設定]をクリックします。

マイページブログ設定選択

表示されたブログの設定画面で[PC]をクリックします。

ブログ設定PCの選択

デザイン設定画面が開きます。上部に表示された[カスタマイズ]をクリックします。

デザイン設定カスタマイズの選択

カスタマイズタブを選択すると、CSSの編集画面が表示されます。
その右に表示されている各ページ種別のタブから、編集したいページ種別をクリックします。

変更対象ページの選択

仮に[トップページ]をクリックした場合には、
トップページで採用されているHTMLが表示されます。

下に表示されているHTMLを編集し[保存]をクリックすると、
HTMLの編集が反映されます。

HTMLの編集と保存

尚、テンプレートの編集を行う前には、必ず複製しバックアップを取るようにしましょう。
livedoor™ブログでテンプレートをコピー(複製)する方法

あとは、自分のブログを開いてテンプレートへの変更が反映されているか確認して終了です。

もう少し見やすく編集したい

正直このWeb上のフィールドで編集を行うのは表示されるエリアも小さく厳しいことと思います。

そういう場合は、開発で利用するIDEなどを利用された方が、
より快適に編集が行えるはずです。

コピーペーストの手間はかかりますが、
ローカルに保存したHTMLがバックアップを兼ねることができるため、
一石二鳥という側面もあります。
無料ブログサービスのHTMLをEclipseで見やすく修正する(4.3.1 Kepler：日本語)

さいごに

livedoorブログのHTMLの編集方法は以上です。
編集の方法自体は難しいことはありません。

livedoorではHTMLとCSSがセットになっているので、
テンプレートの複製(デザインの保存)と同時にCSSも引継が行われるので便利なところかなと思うところです。

どのように編集して、HTMLのどの位置にタグを挿入すると、
どのように表示されるのかといったHTML構造については、以下でご紹介しています。
livedoor™ブログのHTML構造とタグ挿入位置の関係

また編集したHTMLの見た目を変更する際にCSSを利用される場合には、
以下の投稿でCSSの変更方法をご紹介しています。
livedoor™ブログでCSSによるカスタマイズを行う方法

livedoorはLINE株式会社の登録商標（第４４５１５８５号）であり、
livedoorブログはLINE株式会社のサービス名称です。
livedoorロゴ、アイコンその他のマーク等はLINE株式会社の商標であり、LINE株式会社の著作物です。

*本ページ内に記載されされた各社ブランド、サービス名、商標、登録商標については、
各社ブランドのロゴや商標等に関する帰属についてをご確認ください

最後までお読みいただきありがとうございました。

お勧めさせて頂きたい投稿です

• 【巧妙な仕組】Google+へAndroidの写真が勝手にアップロードされてしまう流れは設定ミスではない

• JetPackサイト統計データが消えた場合に復活する手順(してもらう)

• 【待望】WALLET ポイントがauID(au電話番号)間で相互にやりとりできるようになりました

• 禁断の機能がau公式解禁！WALLETポイントの現金化がついに開放。

• 何もしないと、auポイントが2014/05月分以降は携帯利用料から付与されなくなります

• au WALLET™カードはauを解約してもプリペイドとして使い続けられるが、有効期限には注意

• じぶん銀行が動いた！コンビニATM利用が無料・他行振込無料（回数制限なし）で使える

• 【旬】「白すぎる」と賛否両論？姫路城見るなら今秋がおすすめ！その理由は？｜castlehimeji.com

• Google+の投稿が勝手に自動でブログになっていくPluCialが便利



アイキャッチ画像に利用させて頂いております、各社ブランドのロゴやシンボルに関しては、
各社ブランドのロゴや商標等に関する帰属についてをご確認頂けますようお願い致します。

AdMax Promotion

ブログ記事のご紹介

すべて展開 | すべて省略

Rakuten Promotion

ページ

すべて展開 | すべて省略