FC2ブログに、フリーエリアを作成する方法

ブログが作りたい!FC2ブログのプラグイン > FC2ブログに、フリーエリアを作成する方法

FC2ブログに、フリーエリアを作成する方法

FC2ブログにフリーエリアを作成する方法

FC2ブログに、フリーエリアを追加してみよう!

FC2ブログに慣れてくると、記事を書く以外の場所で、次のようなことをしたいと思うことはないかしら?

  • 自由に、好きなように書く領域がほしい。
  • ブログパーツを、設置したい。
  • アフィリエイト広告を、設置したい。

これって、何をどうすればいいのかご存知でしょうか?・・・えぇ、そうです。このような要件を解決してくれるのが「フリーエリア」というプラグインです。

そこで今回は、フリーエリアというプラグインを追加する手順を、ご紹介していきます。ご存知でない方は、どうぞご覧ください。


FC2ブログのフリーエリアとは?

FC2ブログの「フリーエリア」というプラグインは、言葉通り、「自由な領域」を作るためのプラグインです。

例えば、「FC2カウンター」というプラグインには、アクセスカウンターが入っていますが、「フリーエリア」というプラグインには、何も入っていません。

FC2ブログのフリーエリアとは?

つまり、「フリーエリア」は、器(うつわ)だけなのです。何も入っていないから、あなたが好きなものを入れられるというわけです。

例えるなら、他のプラグインは「本」、フリーエリアというプラグインは「(何も書かれていない)ノート」を思い浮かべていただくと、イメージしやすいかもしれません。

ノートには、自分で好きなように書けるし、あるいは雑誌の切抜きなどを貼り付けたりすることができますよね。(雑誌の切抜きが、ブログパーツや広告のイメージってことです)

なかなか最初のうちはイメージし難いかもしれませんが、ひとつ、ふたつと「フリーエリア」を追加していけば、いつのまにか慣れるはずです。あまり難しく考えず、実際に作ってみましょう。


フリーエリア(プラグイン)を追加する方法

(01)

FC2ブログ管理者ページの「環境設定」で、「プラグインの設定」をクリックします。([環境設定]-[プラグインの設定])

プラグインの設定をクリック

(02)

プラグインのページが表示されます。

「公式プラグイン追加」をクリックしましょう。

公式プラグイン追加をクリック

(03)

「公式プラグインの一覧」が表示されます。少し下の方にスクロールしていくと、「拡張プラグイン」という項目が見つかるはずです。

拡張プラグインの中に、「フリーエリア」プラグインがあります。「フリーエリア」プラグインの行の「追加」をクリックしましょう。

フリーエリアの追加をクリック

(04)

「フリーエリアの編集」が表示されます。

まだ、この状態では、フリーエリアは追加されていません。編集は後ですれば良いので、まず先にフリーエリアを作ってしまいましょう。

フリーエリアの編集が表示される

(05)

少し下の方にスクロールさせると、[追加]と、[プレビュー]ボタンがあるはずです。

[追加]ボタンを、クリックしましょう。

追加ボタンをクリック

(06)

フリーエリアが追加されました。

フリーエリアが追加される

フリーエリア(プラグイン)の編集方法

1:フリーエリアを編集したいときは?

(01)

フリーエリア(プラグイン)を編集したいときは、「詳細」をクリックしましょう。

詳細をクリック

(02)

「フリーエリアの編集」が表示されます。

フリーエリアの編集が表示される

2:フリーエリアの編集

(03)

入力欄は、4つほどございます。

  • タイトル(40文字以内)
  • プラグイン説明(上部)
  • プラグイン説明(下部)
  • フリーエリア内容の変更
フリーエリアの編集

冒頭で「次のようなことをしたい」と書きましたが、これらはどこに記述すれば良いかお分かりでしょうか?

  • 自由に、好きなように書く領域がほしい。
  • ブログパーツを、設置したい。
  • アフィリエイト広告を、設置したい。

そうです。4の「フリーエリア内容の変更」に記述すれば良いのです。ブログパーツなどのHTMLやJavaScriptのコードも同様です。

自由に書きたい文章やコードは、「フリーエリア内容の変更」に記述するんだぜ!

(04)

それぞれの入力欄に入力すると、ブログの方では、次のような位置関係で表示されます。

ブログでの表示例

実際に、入力して試してみてください。間違ったら、やり直せばいいだけです。それだけのことです。

3:入力内容の位置調整

(05)

入力した内容の横の位置調整もできます。

位置調整

左寄せ、中央寄せ、右寄せは、ご存知でしょうか?次のように、「左寄せ」なら左に寄せるということです。

左寄せ、中央寄せ、右寄せ

4:ブログへの反映

(06)

内容を変更しただけでは、ブログに反映されません。内容を変更したら、最後に忘れずに「設定」をクリックしましょう。

設定をクリック

そして、「設定(ブログへ反映)」したら、すぐにブログを確認するようにしましょう。そうすれば、何か異常があった場合でも、直前に何をやったか思い出しやすいはずです。

もちろん、「設定」する前に、「プレビュー」をクリックして、試しにどうなるか確認してみてもいいですけどね。

5:HTMLの編集(上級者向け)

(07)

また、フリーエリア(プラグイン)で使用されているHTMLコードを変更することもできます。

プラグインの改造の「【HTMLの編集】」をクリックしてみてください。

HTMLの編集クリック

(08)

フリーエリア(プラグイン)で使用されているコードが表示されます。HTMLのスキル(知識)があれば、好きなように変更することもできます。

フリーエリアのコード

それぞれの意味を簡単に書くと、次のようになります。

コード

意味

<div>~</div>

divはグループ化するHTMLタグです。

class="plugin-freearea"

divタグに「plugin-freearea」というクラス名を付けています。CSSの指定で使えます。

&align

FC2ブログの変数タグです。前述(05)の位置調整に使用されます。

&freearea

FC2ブログの変数タグです。前述(04)のフリーエリア内容を出力します。

例えば、実際に出力されるHTMLコードを見ると、次のような感じです。

もしHTMLやカスタマイズに興味があれば、記事『ブログをカスタマイズしたい!』などをご覧になってみてください。

前の記事へ
次の記事へ

次回予告

フリーエリア(プラグイン)は、いかがでしたか?何となく分かったかしら?

しかし、何か使う目的がみつからないと、身体になじまないと思うので、実際にFC2ブログランキングなどに参加して、使ってみると分かり良いかもしれません。

さて次回は、FC2ブログのプロフィール(プラグイン)です。プロフィールを編集してみましょう!


関連記事

FC2ブログのプラグインに関連する記事を、ご紹介します。

作成日:2009/09/26 更新日:2009/09/26

コメントありがとうございます。

お手数ですが、コメント前に留意事項をご覧くださいませ。

また、現在ご質問にお答えする余裕がない状態にあります。よろしくお願いいたします。

承認待ちコメント

このコメントは管理者の承認待ちです

コメントの投稿

内緒のときは、チェックしてください。

トラックバック

http://kumacrow.blog111.fc2.com/tb.php/585-2524d020
 | トップページ | 

FC2ブログの作り方・作成

GIMP2で画像を編集しよう

イラストが描ける Inkscape

初心者のためのSEO対策

Google Analytics入門

アクセス解析QLOOK

アイデアの作り方

超ビギナー向けHTML入門

超ビギナー向けのCSS入門

FC2ブログのカスタマイズ

初心者向けのCSS小技

Web制作に役立つ本

ブログでお小遣い稼ぎ

これはうまい!

誰にでも才能はあるのです

RSSフィード

プロフィール

KumaCrow(クマクロ)

KumaCrow

FC2ブログによるブログの作り方をご紹介しています。「初心者の人にも分かりやすく!」がモットーです。

Twitter KumaCrow

リンクフリー♪
フォローも、ふりっふり~

伝わる文章を書くコツ

最近の記事

最近のコメント

パソコン入門

アクセスの多かった記事

先月アクセスが多かった記事を、ご紹介します。

【1位】
GIMP2の使い方
【2位】
プリントスクリーンの方法
【3位】
GIMP2 パスの使い方
【4位】
GIMPとは?
【5位】
レイヤーとは?

初心者のデジカメ撮影術

ホームページ制作にJimdo

このブログの評価

自分を見つめなおす

ブログランキング

クリックしちゃいなよ!You、クリックしちゃいなよ!そして、Canして、Doしちゃいなよ!

FC2ブログランキングに参加してみませんか?見に来てくれる人が少しだけ増える・・・かもしれません。

FC2カウンター

ブログ開始(2007年7月)から、ユニークユーザ数が「のべ240万人」に達しました。いつもご覧いただきまして、ありがとうございます。(2011/01/05、FC2カウンター故障・データ消失により、10万人分くらいマイナスとなりました)

子どもの教育

最近のトラックバック

+++ お友達のブログ・お世話になっているサイトさま +++

ふわふわふわりん
無料ウェブ素材 Tyto-Style
海外のSEO対策・SEOツールをわかりやすく解説するブログ
日南商工会議所による情報化支援ブログ
気になるけど
聞き捨てならん!!
かちびと.net
ありのごとくあつまりて