FC2ブログ

FC2ブログのデザインテンプレートを変更する全手順

fc2 ブログ デザインテンプレートの変更手順

 

https://www.youtube.com/watch?v=3TAWMS9WymY

FC2ブログ用デザインテンプレートの変更手順について、私のメルマガ登録特典でプレゼントしているデザインテンプレートを例に解説いたします。

メルマガに登録するとテンプレートが入手できます

FC2ブログの事前準備とバックアップ

まず、FC2ブログの管理画面にログインし、左側にある「テンプレートの設定」をクリックしてください。

 

fc2メルマガ特典4色 説明1

 

すると、HTMLとスタイルシートを変更する画面が開きます。

画面の中ほどから下の方にかけて、編集欄が表示されるはずです。

 

fc2メルマガ特典4色 説明2

 

画面上の方にあるテンプレート管理(PC用)という部分を見ると現在適用しているデザインテンプレートの名前が表示してあります。

 

赤いチェックマークが入っているのが、いままさに適用しているテンプレートなので、そのマークの入ったテンプレート名の右の方にある「複製」というリンクをクリックしてください。

 

fc2特典バックアップ

 

「複製」をクリックすると、テンプレート名のすぐ下に、コピーされたテンプレート名が表示されます。

 

fc2特典バックアップ2

 

今回は、この複製されたテンプレート(赤いチェックマークが入っていない方)のデータを書き換えるので、チェックなしのテンプレート名の右にある「編集」をクリックしてください。

 

以上で、FC2ブログ版特典テンプレートを設置するための事前準備は完了です。

FC2テンプレートの展開および設置作業

続いて、このHTMLとスタイルシート部分を特典テンプレートの内容と書き換えます。

ダウンロードした特典テンプレートを用意してください。

 

ダウンロードされると、以下のようなZIPファイルが保存されます。

 

fc2メルマガ特典4色 ZIP

 

このZIPファイルを解凍してください。

 

fc2メルマガ特典4色 ZIP解凍

 

解凍が完了すると、フォルダ内には下の画像のように4つのフォルダと1つのテキストファイルが入っています。

 

fc2メルマガ特典4色 展開

 

まず初めにHTMLファイルをダブルクリックするか、メモ帳などのテキストソフトで開いてください

 

fc2メルマガ特典4色 html

 

メモ帳で開くと、以下のような画面が表示されます。

 

fc2メルマガ特典4色 メモ帳

 

文字が記載してある画面内のどこかをクリックしてから

  • Windowsの場合 Ctrl +A
  • Macの場合 Command+A

で全部を選択したあと、そのまま

  • Windowsの場合 Ctrl +C
  • Macの場合 Command+C

でコピーしてください。

 

fc2メルマガ特典4色 htmlコピー

 

以上で特典テンプレートの展開および設定作業は完了です。

特典テンプレートの設置

次に、FC2ブログの管理画面に戻ります。

 

FC2ブログの管理画面に戻ったら、HTML名に「tokuten」など好きな名前を入力してください。

そして、下の赤枠の部分に先ほどコピーした特典テンプレートのHTMLデータを貼り付けてください。

 

fc2メルマガ特典4色 html貼り付け

 

貼り付ける際は、赤枠内のどこでも好きな部分で1回左クリックしたあと、

  • Windowsの場合 Ctrl +A で全選択してから Ctrl+Vで貼り付け
  • Macの場合 Command+A で全選択してから Command+Vで貼り付け

をするとスムーズにできます。

 

貼り付けが終わったら、一度「更新」ボタンをクリックして保存しておきます。

CSSデータの書き換え

続いて、HTMLを書き換えたのと同じ要領でCSSデータを書き換えます。

 

特典テンプレートのフォルダに移動後、お好きな色が書かれたフォルダを開きます。

今回は、「青」フォルダを開いてみます。

 

fc2メルマガ特典4色 css

 

フォルダ内には「css青」というタイトルのテキストファイルが入っているので、これをメモ帳などで開きます。

 

fc2メルマガ特典4色 css

 

HTMLを書き換えた時と同じ要領で全選択してからコピーします。

 

fc2メルマガ特典4色 css2

 

FC2ブログの管理画面に戻り、今度は画面の下の方にある「スタイルシートの編集」の内容を書き換えて、「更新」をクリックします。

 

最後に、同じ画面内の上の方に戻り、いま編集していたテンプレート名の左にあるチェック欄にチェックを入れた後、すぐ上にある「適用」をクリックしてください。

 

fc2メルマガ特典4色 適用

 

以下のようなデザインでブログが表示されるようになれば、特典テンプレートの設定は完了です。

 

fc2メルマガ特典4色 青

 

今後、全体の基本色を別の色に変えたい場合は、CSSだけ書き換えれば基本色が変えられます。

 

また、やっぱり元のデザインに戻したい!という場合はテンプレート管理(PC用)から元のテンプレート名にチェックを入れ、「適用」をクリックすれば元のデザインに戻せます。

ブログ作りはこちらもご参考に。

人気記事セレクション

bitFlyer ビットコインを始めるなら安心・安全な取引所で CMでもお馴染みの仮想通貨取引所
カンファレンスバナー 日本一満足度の高いASP

関連記事

  1. fc2 アカウント凍結されています FC2ブログが凍結された!運営会社による厳しいチェック体制と今後…

ソーシャルメディア

  1. Facebook
  2. Twitter
  3. YouTube
  4. LINE@
  5. Mailmagazine

アーカイブ

最近の投稿

カテゴリー

おすすめ記事

コピーライティングの強烈な実例を実験動画で説明!

コピーライティングの効果を体験してくださいまずはこちらの動画をご覧ください↓…

ピックアップ記事

おすすめ記事

  1. もう貧乏は嫌だ!『ラットレース』『ワーキングプア』から脱出する方法
  2. 貧乏になる人、貧乏になりやすい人の3つのタイプ/お金持ちになる方法
  3. コロナ不況になりネットビジネスは大学生・主婦・サラリーマンの必修科目になりました
PAGE TOP