FC2変数タグとは? / カスタマイズ

ブログが作りたい!FC2ブログのカスタマイズ > FC2変数タグとは? / カスタマイズ

FC2変数タグとは? / カスタマイズ

FC2変数タグとは? / カスタマイズ

FC2ブログ カスタマイズ(6)

みなさんは、「変数」と聞いたら、何を思い浮かべるでしょうか?

ほとんどの人は、数学で勉強した 変数xや、変数yなどを思い浮かべるのではないかと思います。

「んげっ!あたし計算は、どうも苦手・・・」などと思う人もいらっしゃるかもしれませんが、計算力を必要とするお話ではありません。大丈夫です。

「FC2変数タグ」と言うものがあります。とても有用で、カスタマイズの可能性を広げてくれます。今回は、そんなお話です。

▲ページの先頭に戻る

FC2変数タグとは?

1:役割

FC2変数タグは、次の4つの役割に分けて考えることが出来ます。

  • 変数
  • 条件分岐
  • 繰返し
  • 領域
変数、条件分岐、繰返し、領域

何のことやら分からないと思います。詳しくは、後述して行きますので、ざっくり眺めて、読み飛ばしてください。

▲ページの先頭に戻る

2:呼び方

「FC2変数タグ」は、正式な呼び方が定まっていません。この記事では、より多くの人が認識しやすいように、「FC2変数タグ」としました。

他にも、いろいろな呼び方がされています。

  • 変数
  • FC2独自タグ
  • 変数タグ
  • FC2変数
  • FC2ブログテンプレート変数
  • ブロック変数

などなど。

ちなみに、最も正確に言い表している呼び方は、「FC2独自タグ」です。役割は、変数だけではないので、総称として「変数」を使うと、誤解をまねきます。

もし呼び方を整理するなら、役割ごとに次のようになるかと思います。

総称

FC2独自タグ

変数

FC2変数タグ

条件分岐

FC2 IFタグ

繰返し

FC2ループタグ

領域

FC2ブロックタグ

しかし、「変数」の印象が強いためか、たいていの人が「変数!変数!」と呼ぶので、「郷にいっては、ジャパーン」ということで、FC2界隈では、「変数」と呼ぶのが良さそうです。

検索エンジンなどで調べるときは、「FC2 変数」で検索をかければ、たいていはヒットするはずです。

▲ページの先頭に戻る

3:FC2さんの「FC2変数タグ」のページ

どのような「FC2変数タグ」があるのか確認したいときは、「テンプレート用 変数一覧」を利用します。

FC2ブログで使用できるすべての「FC2変数タグ」が確認できます。覚えておくと良いですよ。

▲ページの先頭に戻る

「変数」の役割

それでは、ひとつずつ説明していきます。まずは、「変数」の役割です。

おそらく、抽象的な話をしても、モヤっとするだけだと思うので、具体的な例を挙げてお話します。

1:テンプレートから、変数<%blog_name>を探す出す

(01)

さっそくですが、テンプレートのHTMLコードをコピーし、テキストエディタに貼り付けてください。

テンプレートのHTMLコードは、管理者ページの「環境設定」の「テンプレートの設定」で表示できます。

(02)

「<h1>」で検索をかけてみてください。おそらく、次のようなコードがヒットするはずです。

この「<%blog_name>」が変数です。つまり、次のように記述されている場合は、FC2変数タグなのです。「%」を目印にすれば分かり良いはずです。

もちろん、<%blog_name>の左側に記述されている「<%url>」も変数です。

▲ページの先頭に戻る

2:実際のブログからブログ名を探し出す

(03)

次に、ブログを表示して、ブラウザのソースを表示してください。そして、また「<h1>」で検索をかけてみてください。

ブラウザのソースを表示する方法をご存知ない場合は、記事「ブラウザでHTMLソースを表示する方法」をご覧ください。

(04)

おそらく、あなたのブログの「ブログ名」が記述されているコードが、ヒットするはずです。

分かるかしら?この仕掛けが、変数の仕組みです。

テンプレートでは、「<%blog_name>」となっていたのに、実際にブログを表示すると、「あなたのブログ名」が表示されるわけです。

ちょっと話が分かり難いですか?もう少し読み進めてみてください。

▲ページの先頭に戻る

3:変数の仕組み

(05)

ちょっと待ってくださいよ。はてさて?ブログ名は、どこから持ってきているのでしょう?

これは、「環境設定」の「ユーザー情報の設定」から持ってきています。ここの「ブログの名前」で入力された文言を「<%blog_name>」として表示しているのです。

ブログの名前

イメージとしては、次のような流れになります。

ブログの名前と変数の関係
  • ブログ制作者(管理者)は、管理者ページで、自分の「ブログ名」を入力し、[更新]ボタンをクリックします。
  • 管理者ページ(ブログツール)は、「ブログ名」についての更新なので、テンプレートの「<%blog_name>」の箇所に、入力された「ブログ名」をはめ込みます。
  • HTMLファイルが生成されます。
  • ユーザは、HTMLファイルをブラウザで表示します。ユーザが目にするのは、「ブログ名」です。

(06)

この「<%blog_name>」のような変数が、テンプレートのあちこちに仕掛けられているわけです。

おおよその「変数」の意味・流れはご理解いただけたのではないかしら。しかし、どうして「変数」なんてものを使うのでしょうか?

「変数」を使う理由(メリット)は、主に次のようなことかと思います。

  • ブログ制作者は、管理者ページで入力すれば、ブログツールがうまいこと処理してくれるので、HTMLのスキルを必要としない。
  • HTMLコードを、テンプレートとして汎用的に使用できる。
  • 一元管理ができる。

などなど

「変数」は、ブログ制作者の負担を軽減してくれるんだ。だから、間違って「変態!」とか言っちゃいけないんだ。

▲ページの先頭に戻る

「条件分岐」の役割

「条件分岐」などと書くと、何だか難しそうですが、単に質問に対して「Yes」なのか?「No」なのか?を書くという簡単なお話です。

例えば、「あなたは、ブラッド・ピットと、ムチューってしたいですか?」という問いに対して、「Yes!私は、激しくムチューってされたいです!お姫様抱っこして欲しいです!」・・・・・・とかね。

1:トップページに記事がない

(01)

具体的な例を書きます。

例えば、当ブログ(「ブログが作りたい!」)ですが、通例の日記形式のブログのように、トップページに記事が表示されていません。

これは、条件分岐させる「<!--index_area-->」というタグを利用しているためです。

「ブログが作りたい!」のトップページ

▲ページの先頭に戻る

2:「条件分岐」の概略

(02)

簡単に概略をお話しすると、次のような書き方をしています。(HTMLコメントのようにも見えますが、HTMLコメントではありません)

トップページか?

FC2ブログツールが「あなたは、トップページですか?」と問うてきます。

トップページであれば、<!--index_area-->タグに書かれている内容(A)を表示して、そうでないならば、<!--not_index_area-->タグに書かれている内容(B)を表示します。

このように、条件分岐をさせてるタグはいくつかあります。うまく活用すれば、とてもブログとは思えないような表示の仕方ができます。

▲ページの先頭に戻る

「繰返し」の役割

「繰返し」は、プログラミングの経験がないと、イメージし難いかもしれませんが、ちょっと頑張ってみてください。

1:プラグインのHTML文を見てみる

(01)

具体的な例を書きます。

カテゴリのプラグインは、カテゴリ名をズラッと表示してくれるわけですが、みなさんは、どのような仕組みになっているか、ご存知かしら?

カテゴリ

(02)

「環境設定」の「プラグインの設定」で、「カテゴリ」のHTMLコードを表示してみましょう。

次のようなHTMLコードになっているはずです。

▲ページの先頭に戻る

2:整理して考えてみる

(03)

ゴチャゴチャして分かり難いでしょうから、細(こま)かいところを省略してお話しますね。次のようにします。

(04)

さて、<ul>タグ、<li>タグは覚えているかしら?・・・そうです、箇条書き(リスト)のタグです。通例なら、次のように書きますよね?

でも、<li>タグが一行だけしか書かれていません。その代わりと言ってはなんですが、<!--category-->タグで囲まれています。

実は、この<!--category-->タグで囲むことによって、繰返し表示してくれるのです。

(05)

<!--category-->タグで囲まれていると、変数<%category_name>が尽きるまで、繰返し表示します。

「尽きるまで」と言うのは、管理者ページのカテゴリ管理で、カテゴリ追加した分という意味です。

繰返しタグは、最新の記事、最新のコメントなど、他にもいくつかあります。入力の手間が省けて、とても便利ですね。

▲ページの先頭に戻る

「領域」の役割

(01)

「領域」の役割を担うタグがあります。最も有名なところで言えば、プラグインに関するタグです。

例えば、プラグインエリア1であれば、次のように書きます。

プラグインについて、まったくご存知でない場合は、記事「FC2プラグインとは?」をご覧ください。

(02)

このプラグインエリアの記述を、侮ってはいけません。

FC2ブログの場合、プラグインエリアは 3つあるわけですが、たとえこのうちのひとつを使わないとしても、3つ書かないとプラグインが有効になりません。

  • <!--plugin_first-->
  • <!--plugin_second-->
  • <!--plugin_third-->

(03)

また、条件分岐、繰返しの役割のタグにしても、そうなんですけれど、例えば、<%plugin_first_no>など、<!--plugin_first-->タグで囲まれた場所でしか使用できない変数があります。

テンプレート用 変数一覧」をご覧いただくと分かりますが、「どこでも使える単変数」と「特定の場所でしか使えない単変数」があるのです。

▲ページの先頭に戻る

次回予告

次回は、SEO対策の意味でも、タイトル(title)を、各ページごとに変えようぜ!セニョール!を予定しています。

▲ページの先頭に戻る

関連記事

カスタマイズに関連する記事を、ご紹介します。

▲ページの先頭に戻る

作成日:2008/05/29 更新日:2009/02/23

« 「文字サイズの変更 / カスタマイズ」|「SEO効果があるタイトル作成方法 / カスタマイズ」 »

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

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

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

変数キターーー!

kumaCrowさん、こんにちは!
昨日から、「明日はkumaさんのところで変数のお話だ」と沸々とたぎっておりました。
楽しみだったよう


ブログをカスタマイズしたいと開いてみても、
よくわからんものがズラズラと並んでいて手がつけられなかったのです。
今日のお話を熟読して、またソース開いてみました。


そっかー、%が独自タグの目印だったんだ。
コメントと混ざってわけがわからなかったのです。


わけがわからない文字の羅列かと思いきや、表示される内容と
なんとなく関連つけられてる名前になっていますね。
これを一個一個、どんな役目かを確認すれば、なんとか出来そうですね。


MTの方も変数があって、「?」な事が多いのですが、
考え方とかは一緒ですよね。うおー頑張ろう。


条件分岐とかすごい新鮮・・・
kumaさんのところもそんなの使ってたんですね。
そういえば、トップにしか表示されてないものがあった。あれが条件分岐か!
実際見ていたので、「これがそうなのか」と理解することが出来ました!


あと、繰り返しもそういうものだったのか・・・
領域とか・・・
なんて濃い内容なんだ!
変数すげえ!おもしろいですねー!


次はページごとのタイトルなんですね。
今自分のところみてきたけど、そういう風になっていた。
でも、どうしてそうなってるのかわからない。


予想してみる・・・。
条件分岐が関係してたりしますか?
楽しみにしてますね!

ちょっと早まったかもしれない変数

ひろこさん、こんにちは!
コメントありがとうございます。

ちょっと、具体例ばかりで、余計に分かり難かったかな・・・。
うまいことイメージできたかしら。

そうですね。FC2なら %だし、MTは、何でしたっけ?
__(アンダーバー2つで囲む)__
なのかしら。

独自に決めるから、独自タグなんでしょうね。

んー、考えてみると、ちょっと出すの早かったかもしれない。
HTML入門、CSS入門とやってきて、この段階で変数って、
ちょっと、つまづく人が出てくるかもしれないなぁ。

ある程度、HTMLを熟成して覚えていないと、難しいだろうなぁ。

次回は、ページごとのタイトルです。

でも、たいていのテンプレートで、
すでにページごとに表示されるみたいだねぇ。

あまり書くこと無いのかも・・・。
そう、条件分岐を使って書こうかと思っていたのだけれど、
そこまでせんでも・・・という感じもしてきました。

テンプレート・ジプシー

 <とてもブログとは思えないような表示の仕方 ー「条件分岐」
がしたいから、だから私はいまだにテンプレートを探し続けているというわけなんですね。そして、やっといい1カラムのを見つけたと思ったら、プラグイン非対応だったりするわけなんですね。中身の細かい意味はまだ「?」ですが、要するに、「そんなにフリースペースが欲しかったら、<!--index_area-->を攻略せよ!」ということなんでしょうか。 TOPページにキーワードを固定させたいんです。ブログの説明文を入れたいだけなんです。ハートが折れそうです。  ~
コメント初送信~

トップページ1カラム

(おずおず)Ozozさん、こんにちは。

テンプレート探し、お疲れさまです。
なかなか苦戦しているみたいですねぇ。(´Д`;)

プラグイン対応で済むのなら、プラグイン対応させてみるのも、
ひとつの方法かと思います。ご参考までに↓

 http://kumacrow.blog111.fc2.com/blog-category-0.html

ただ、1カラムとなると、プラグインを入れるところが、
あまり無いような感じがいたします。

使いたいプラグインが特にないのであれば、
プラグイン非対応でも構わないのではないかしら。

<!--index_area-->は、
トップページにだけ表示したいものがある場合に利用します。
先日お話ししていたテンプレートの構成と一致しますから、
<!--index_area-->を使ったテンプレートが良いということなんですね。

つまり、トップページだけに表示するフリーエリアが
欲しいということなのかしら。

そのうち、このブログでも手順を書くかもしれませんが、
FC2ブログstyleさんでも解説しているので、
ご覧になってみると宜しいかもしれません。

 http://fc2blogshop.blog13.fc2.com/blog-entry-28.html

んー、いくつかテンプレートの候補を挙げて、
具体的に、「このテンプレートのここがこうなら!」などを
書いてくれると、お話しやすいかな。(メールのときみたいに)

MTの変数

こんにちは!
MTの変数は、ブログ名ならば<$MTBlogName$>でした。
なんじゃこれ、ドルマーク?

で、今すごい事が起こった!
MTの変数タグリファレンスを見ると、タグの横っちょに、
「BLOCK」とか「FUNCTION」って書いてるんですが、
「もしかして、「BLOCK」ってKumaCrowさんが書いてた「領域」の事?」
って、ちょっとした理解のとっかかりにえらい興奮してきました。
読んでてよかった、ありがとうございます!


BLOCKのタグには$マークがついてなくて、
<MTBlogIfCommentsOpen>
<!-- do something -->
</MTBlogIfCommentsOpen>


こんな感じでした。
つか、これ送信できるのかな。英数字多いからスパムと間違われちゃうかな。


絶対領域!

ひろこさん、こんにちは。

へー、MTの変数って、ドル2つなんだー!(・∀・)
それは何だか、お金持ちになれそうだねー。

羨ますぃ。

おぉう!領域!
よく分からないけれど、でかした俺!さすがだぞ!

ほー、<MTBlogIfCommentsOpen>なんてことになっちゃうのか。
んーオラもやりてっぞMT。(゜з゜)ぷー

おっくせんまん

MTってゴージャスだなー、ドルだもの。
お茶漬け食べてる場合じゃないや・・・


MTって、CGIだからCGI使えるサーバーが必要ですよね。
自分はロリポ借りたけど、最近ロリポでも、男子むけのサービスも出てきてるみたいです。
あと、無料でもCGI使えるサーバーって結構あるみたいですね。

http://server.m-to.com/free/cgiok/

広告なしも結構あるみたい。



KumaCrowさんもMTやったらええ・・・
KumaCrowさんなら、FC2でもこうやってブログをすごいカスタマイズしてるし、
MTでもすぐ使いこなせそうですね。


うわー自分もがんばろう!




スキルアップ

ひろこさん、こんにちは。
コメントありがとうございまっす!

そうだよねー、だってドルだもの。
それはもう、セレブよねー。
言わば、「セレブひろこ」よね。

CGIと申しましょうか、もう少し正確に申し上げるなら、
MTが稼動する要件を満たすサーバってことですね。

例えば、CGIの雄であるPerlが入っていても、
データベースが使える状態になっていないと、
MTが動かないあるよ。いくよくるよあるよ。

う~ん・・・実はね。

私一度、ロリポ借りてXOOPSでサイト作ろうとしたんだけれど、
時間が取れなくて左折・・・あ、いや挫折した経験があるんだ。

サイト構築して、コンテンツ作ってって、やっぱ大変よね。
2倍だもの。

それで、ブログサービス(FC2)を利用することにしたのです。

と言っても、最初からテンプレートをオリジナルで作ったし、
あまり変わらないっちゃ、変わらなかったかなぁ、いま思えば。

でも、ブログサービスを利用して段階的に遊べたことは、
良かったかもしれません。挫折も生きたんだな、きっと。

そう、次をどうしようかなって、迷っているのです。

XOOPSがCubeっていう新しいバージョンになっているから、
見ておきたいというのもあるし。

MT、ケータイサイト、JavaScript、Flash・・・うーん。
ブログサービスの前に、ブログパーツ作成なんてのもありよね。

とりあえず、もっと基礎体力をつけるために、
もうひとつのブログで、スキルアップを加速させるのが、
先決かなぁ。

clearfixの件もそうだけれど、情報がこなせていないもの。

どげんかせんといかんのですよ。

全部やりたいな

こんばんは!
うーん、そうか。
MT、ケータイサイト、JavaScript、Flash、あとXOOPS、
実は自分も全部手をつけたいところだけど、やっぱりより深くを目指すなら
一気には無理なのかな。


自分も今割りとMTとcssで一杯一杯なところがあって、
あっぷあっぷです。


そしてMTって、CGI使えるだけじゃだめなんだ!
ガーン全然わかってなかった。
そういえば、ロリポにはファイル使用量?みる管理画面があるんだけど、
そこに「DB」ってあったんだけど、素でドラゴンボールだと思ってた・・・
あれはデータベースだったんだな。


XOOPS、もういじってたんですかー
すごいーXOOPSがCube?もう全然未知です。
自分は、とりあえずMTの方をものにしないとな。


うーん自分もスキルアップしたいな。
どうすれば・・・ってよく思うんだけど、結局は、
とにかく作って作って作りまくるしかないような気がしてます。


KumaCrowさんのもう一個のブログも、楽しみにしてます。
今はとりあえず、奥さんと製作さんがムチューしてるからあれですが、
また覗きにいきますね!

プライオリティ

ひろこさん、こんばんは。

そうなんだ。
いろいろやるにしても、さてプライオリティは、
どうなんやろってことになるんだな。

おっしゃる通り、何でもかんでもというわけにもいかないよね。
考えなきゃいけないなぁ。

私なんか、ずえんずえん新しいこと出来ていない感じがするよ。

MT使うときに、phpMyAdminとか、
データベースの設定は必要ないものなのですか?

データベース名とか付けたり。
神竜を呼び出したり。

次につながっていくようにしたいな。
でも、同じようなことをしても、
あまり意味がない感じもするんですよねぇ。

とりあえず、ムチューってしまくるしかないかな。

ロリポの場合

KumaCrowさん、こんにちは!
ロリポの場合なんですが、MTの設定の時、何をしたか実はよくわかっていないのです。


全部ロリポの説明に従って、あとは全部MTがやってくれたのかなあ。
ここの操作をやりました。

http://lolipop.jp/?mode=manual&state=blog&state2=mt


何が起こったのかよくわからないけど編集できたりする様になりました。
いいのかこれで・・・


最終的にどうなりたいか、っていうのでやることって変わってくるかなと
最近思っています。
独立してwebサイト製作となれば、ものすごく手広くやらないと間に合わなさそう。
自分なんかは、サイト作成で言えば、デザイン方面よりも
コーディングの方に魅力を感じるなあ。


MTに手をつけたのは、好奇心が大部分なんですが、
やっぱり使ってる人や会社さんがとても多いから
cssとhtmlのみやっていて、置いていかれるのが嫌だった、
てのもあります。


一体何を目指せばいいのか、自分も模索中です。

模索中

ひろこさん、こんにちは。
コメントありがとうございまっす!

なるほど、このままやれば使えるようになります。
というマニュアルでした。

さりげなく、SQLiteを指定するように書いてある。
SQLiteって、小規模サイト向けのデータベースなんだ。

ひろこさんのサイトが爆発的な人気サイトになったら、
ちょっと表示とか重くなるかもしれないよ。

そうですね。
最終形態をどのように描くか?ですよねー。

コーディングってんなら、どんどんプログラムとかも、
やっちゃえば良いのだ!Youそうしちゃいなよ!(・∀・)/

ある程度、自分のやりたいことと、人が不足しているところを、
うまいこと折り合いつけるのも必要よね。

ちょっとお金の話なんかも含めると、
ディレクションが出来るようなスキルを付けていく方が稼げるんだな。

http://japan.cnet.com/marketing/story/0,3800080523,20374041,00.htm

求人欄とか見ておくと良いかも、
どんなスキルがより必要とされているのか分かります。

確かに、スキル、スキルばかり言ってないで、
具体的な方向性が必要だわ。

さて、どうしたものか。

コメントの投稿

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

トラックバック

http://kumacrow.blog111.fc2.com/tb.php/310-b4b86194
 | トップページ | 

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
ありのごとくあつまりて