「WordPressで学ぶPHP(1)変数・制御構造編」が発売されました。
「WordPressで学ぶPHP」シリーズの第1巻で、WordPressを通してPHPを学んでいく本です。
この本では、PHPの基本となる変数と制御構造について解説します。
Kindle本で、定価500円です。
Blog Parts Changerその5:パーツを複数ブロックに分けて表示する
Blog Parts Changerでは複数のBlogパーツを切り替えて表示することができます。
ただ、ここまでで紹介してきたスクリプトでは、パーツを表示する場所が1箇所で、そこですべてのパーツを切り替えるという形になっています。
しかし、パーツが多くなってくると、「パーツをグループに分けて、複数のブロックに表示したい」ということも出てくると思います。
例えば、「パーツAとパーツBはブロック1に表示し、パーツCとパーツDはブロック2に表示する」といった場合です。
そこで、パーツを複数のブロックに分けて表示できるようにしてみました。
●1.Blog Parts Changer本体の書き換え
まず、Blog Parts Changer本体を以下のような形に書き換えます。
function show_blog_parts(block_no, parts_no) { parts_html = ""; if (block_no == 0) { if (parts_no == -1) { parts_html = "<p>ただいま工事中です。</p>\n"; } else if (parts_no == 0) { // 1つ目のブロックの1つ目のパーツを表示する処理 } else if (parts_no == 1) { // 1つ目のブロックの2つ目のパーツを表示する処理 } else if (parts_no == 2) { // 1つ目のブロックの3つ目のパーツを表示する処理 } ・・・ } else if (block_no == 1) else if (parts_no == 0) { // 2つ目のブロックの1つ目のパーツを表示する処理 } else if (parts_no == 1) { // 2つ目のブロックの2つ目のパーツを表示する処理 } ・・・ } else if (block_no == 2) { ・・・ } document.getElementById('blog_parts_changer_' + block_no).innerHTML = parts_html; }
「// 1つ目のブロックの1つ目のパーツを表示する処理」などの部分には、Blogパーツを表示するためのスクリプトを入れます(これまでに紹介してきたものです)。
また、「・・・」の部分は「同様に繰り返す」ことを意味しています。
●2.divタグの書き換え
次に、個々のブロックを表示したい位置に、以下の対応するdivタグを入れます。
「○」はブロックの番号で、1番目のブロックは「0」、2番目のブロックは「1」・・・のようにします。
<div id="blog_parts_changer_○"></div>
●3.初期表示パーツを決める
次に、以下のようなスクリプトを入れて、各ブロックに最初に表示するパーツを決めます。
手順2.でdivタグを複数箇所に入れましたが、それらすべてのdivタグの後に以下のスクリプトを入れます。
「○」は、1つ目のブロックに最初に表示するパーツの番号です。また、「□」は2つ目のブロックに最初に表示するパーツの番号です。
また、3つ以上のブロックに分ける場合は、「・・・」の部分に、同様の手順で初期表示パーツを決める文を入れます。
<script language="javascript" type="text/javascript"> <!-- show_blog_parts(0, ○); show_blog_parts(1, □); ・・・ //--> </script>
●4.パーツを切り替えるためのリンクを入れる
最後に、パーツを切り替えるためのリンクを入れます。
手順2.でdivタグを入れましたが、各ブロックのdivタグの後に、以下のようなタグを入れます。
「○」はブロックの番号(1番目=0、2番目=1・・・)で、「□」はパーツの番号(1つ目=0、2つ目=1・・・)です。
<a href="javascript:show_blog_parts(○, □)">パーツ名</a><br />