頑張らない!でも諦めない!必死にならずにええかげん

livedoor™ブログでCSSによるカスタマイズを行う方法

      2014/11/22

livedoor™ブログではCSSの編集を認めている無料ブログサービスです。
そのlivedoorブログでCSSの編集を行う方法をご紹介しておきます。
他のサイトでもご紹介されているでしょうが念のため記載しておきます。

はじめに

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

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

CSS編集の方法

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

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

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

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

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

02_ブログ設定PCの選択

ブログ設定PCの選択

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

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

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

カスタマイズタブを選択すると、CSSの編集画面が表示されます。
編集エリアで直接CSSを編集します。

編集が完了したら[保存する]をクリックすることで、保存されます。
保存する前に[プレビュー]をクリックすると、変更内容の表示を確認することができます。

04_CSSの編集と保存

CSSの編集と保存

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

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

プロモーション(btm)

Google or AdMax Promotion (it)

さいごに

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

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

また編集したHTMLの見た目を変更する際にHTMLの編集方法については、
以下の投稿でご紹介しています。
livedoor™ブログでHTMLの修正を行う方法


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

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


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

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

AdMax Promotion

ブログ記事のご紹介
すべて展開 | すべて省略

Rakuten Promotion

ページ
すべて展開 | すべて省略

 - livedoorブログ , , ,

  関連記事

eye_dti
(livedoorはきつい編)dtiブログサービス終了に伴う引っ越し方法

Google or AdMax Promotion(it) 禁断の機能がau公式 …

eye_livedoor
livedoor™ブログでカスタマイズ後に元テンプレートの名前を確認する方法(PC)

Google or AdMax Promotion(it) 禁断の機能がau公式 …

eye_livedoor
livedoor™ブログで初期状態の設定で投稿した際のURL形式の種類と設定方法

Google or AdMax Promotion(it) 禁断の機能がau公式 …

eye_livedoor
livedoor™Domainにてドメイン取得の流れ

Google or AdMax Promotion(it) 禁断の機能がau公式 …

eye_livedoor
livedoor™ブログ(PRO)への独自ドメインの割り当て(お名前.com編)

Google or AdMax Promotion(it) 禁断の機能がau公式 …

eye_livedoor
Google™AdSense広告をlivedoor™ブログで利用する上の規約確認

Google or AdMax Promotion(it) 禁断の機能がau公式 …

eye_livedoor
Google™AdSense広告をlivedoor™ブログに設置する方法(PC・ブログパーツ)

Google or AdMax Promotion(it) 禁断の機能がau公式 …

eye_livedoor
livedoor™ブログ(PROプラン)のFTP接続方法

Google or AdMax Promotion(it) 禁断の機能がau公式 …

eye_fc2
FC2家宅捜索当日にlivedoorがFC2終了対策をアピール

Google or AdMax Promotion(it) 禁断の機能がau公式 …

eye_livedoor
livedoor™ブログの日本語カテゴリアーカイブURLを英字URLに設定する手順

Google or AdMax Promotion(it) 禁断の機能がau公式 …