WordPress で指定したカテゴリの記事を指定した数だけテーブルで一覧にします。
記事数が指定した数に達しない場合でも、内容の無い行を出力します。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
| <table cellspacing="0" class="top_news" width="100%">
<?php
$i=0;
$numberposts=5;
$myposts = get_posts("numberposts={$numberposts}&category=1,3");
foreach($myposts as $post) {
$cat = get_the_category();
$cat = $cat[0];
echo '<tr>';
echo '<th>' . get_the_time('Y年m月d日') . '</th>';
echo '<td>' . $cat->cat_name . '</td>';
echo '<td><a href="' . get_permalink() . '">' . get_the_title() . '</a></td>';
echo '</tr>';
$i++;
}
while($i<$numberposts) {
echo '<tr><th height="38"></th><td></td><td></td></tr>';
$i++;
}
?>
</table> |
カラム数をファイルから変更できると思ったらそうではありません！
実際は管理画面 -> デザイン設定 -> レイアウト設定の状況によって自動的に変わるみたいです。
実際は $tpl_column_num の中にカラム数が入っていて、それで出力するパターンを分岐してるっぽいので、ページ内のどこでも良いので以下のようにカラム数が出力されるように設定しておくと、カラム数の変化が分かりやすいです。
1
| <!--{$tpl_column_num}--> |
さっそくカラム数を変更していきましょう。
この状態だとカラム数は3です。
この状態だとカラム数は2です。
この状態だとカラム数は1です。
見栄えに関しては .tpl のファイルの修正や、特にカラム数に関しては管理画面から変更できてしまうので、そんな難しく考えなくて良いです。この辺は公式マニュアルに書いて置いて欲しいですね。
MediaWiki のソースコードはどこで弄るのか悩んでたところ以下のページを発見。
[MediaWiki]Google Analyticsを設置 :: 日々是作譜
/skins/disabled/MonoBook.tpl を編集すれば良いのかと思っていたのですが、そうではありませんでした。実際は /skins/MonoBook.php の244行あたりですかね。
244
245
| <?php endif; ?>
</body></html> |
一応このファイルも当初は覗いたんですが、一番下に body タグがなかったので、それだけでこのファイルは違うぜとか思ってしまっていました。こういう癖ダメですね私は！
今更の話なんですが、なんとなくまとめてみることにします。
たぶん CSS 初心者の方は float の解除をするのに困ることがあると思います。
clear: both; で解除できると思うと見せかけて、実はそれじゃあダメなんですね。確かこれだけだと親要素が潰れちゃってダメなんですね。
それの対処法として、大体の人はこんなんやっちゃうと思います。
わかりやすくタグに直接 CSS 書かせてもらいますね。
1
2
3
4
5
6
7
| <div style="float: left;">
<p>テキスト</p>
</div>
<div style="float: right;">
<p>テキスト</p>
</div>
<div style="clear: both;"></div> |
でもこれだと見栄えのための HTML を書くことになっちゃうと思いますのでダメです。
じゃあどうすれば良いのか。
これは一般的なのか私には分かりませんが、私はこういう場合に clearfix というものを使います。
clearfixでfloatを解除 | d-spica
CSS をそのまま引用させていただきますです。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
| .clearfix:after {
content: ".";
display: block;
clear: both;
height: 0;
visibility: hidden;
}
.clearfix {
min-height: 1px;
}
* html .clearfix {
height: 1px;
/*¥*//*/
height: auto;
overflow: hidden;
/**/
} |
そして、HTML は以下みたいな感じです。
1
2
3
4
5
6
7
8
9
| <div class="clearfix">
<div style="float: left;">
<p>テキスト</p>
</div>
<div style="float: right;">
<p>テキスト</p>
</div>
</div>
</div> |
これは確か after 擬似要素でその要素の下に clear: both; をする要素を追加することができるんですね。
と、自分が後でコピー&ペーストできるように記事にしておきました。
もし、clearfix 使ってない人がいたらぜひ使ってみてくださいね！
ちなみに初心者の方はこんなんあるんで、ぜひ参考にしてみてください。凄い重要なことまとめてあって良いです。今私の中でITキヲスクさんが熱いっす。
ITキヲスク | CSS基礎文法最速マスター
四字熟語 Wiki を構築しました。
ある程度の構成は作っておきましたが内容は作っておりません。こういう場を提供すると誰かの役に立つのか実験で作ってみました。誰かやる気のある人がいたら良いですね！
