txt – ページ 4 – 696graphic[BLOG]

WordPressで特定のカテゴリを表示、記事数の限定、本文を抜粋（文字数制限）

インデックスに特定のカテゴリで新着情報を出したくてですね…っていうwordpressのメモ。あああ、phpわからんよ…＿ﾉ乙(､ﾝ､)＿

っていうか最初はこんな感じのコードだったわけですが

<dl>
<?php $myposts = get_posts('numberposts=5&category=9'); foreach($myposts as $post):?>
<dt>
<span class="day"><?php echo date("Y/m/d", strtotime($post->post_date)); ?></span>
<a href="<?php the_permalink(); ?>" id="post-<?php the_ID(); ?>"><?php the_title(); ?></a>
</dt>
<dd>
<?php echo mb_substr(get_the_excerpt(), 0, 30); ?>
</dd>
<?php endforeach; ?>
</dl>

<dl>

<?php $myposts = get_posts('numberposts=5&category=9'); foreach($myposts as $post):?>

<dt>

</dt>

<dd>

<?php echo mb_substr(get_the_excerpt(), 0, 30); ?>

</dd>

<?php endforeach; ?>

</dl>

本文の抜粋が出ないんですよ。なんでだろ、って思ったら

<?php echo mb_substr(get_the_excerpt(), 0, 30); ?>

1	<?php echo mb_substr(get_the_excerpt(), 0, 30); ?>

このget_the_excerptがループの中でしか駄目なんですって。foreach文じゃ駄目だと。

なので、以下のコードを使いました。

<dl>
<?php query_posts('showposts=5&category=9'); if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<dt>
<?php echo date("Y/m/d", strtotime($post->post_date)); ?>
<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
</dt>
<dd>
<?php echo mb_substr(get_the_excerpt(), 0, 30); ?>
</dd>
<?php endwhile; else: // No posts. endif; wp_reset_query(); ?>
</dl>

<dl>

<?php query_posts('showposts=5&category=9'); if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>

<dt>

<?php echo date("Y/m/d", strtotime($post->post_date)); ?>

</dt>

<dd>

<?php echo mb_substr(get_the_excerpt(), 0, 30); ?>

</dd>

<?php endwhile; else: // No posts. endif; wp_reset_query(); ?>

</dl>

'showposts=5&amp;category=9'

1	'showposts=5&category=9'

の部分、showpostsが表示する記事数、categoryの数字はカテゴリに振られてるIDですね。category_nameって指定も出来るよと。

こちら参考にしました。ありがとうございます。
[Wordpress] カテゴリと記事数の限定されたループを作る – かちびと.net

明けましたね。

明けましておめでとうございます。

新年明けて1時間20分ほどでおみくじの大吉をひいてしまい、今年の運をすべて出し切った三上カミです。今年既に終了のお知らせ！
“明けましたね。” の続きを読む

マウスオーバーした時に画像をCSSで置換

画像の置換、何かと使いますね。
バナーだとかボタンだとか。マウスオーバーした時に、ちょっと色が明るくなったりするだけで、見栄え違いますもんね。

その昔は

<img alt="画像だよ" src="hoge.png"
onMouseOver="this.src='hogehoge.png'"
onMouseOut="this.src='hoge.png'" />

<img alt="画像だよ" src="hoge.png"

onMouseOver="this.src='hogehoge.png'"

onMouseOut="this.src='hoge.png'" />

こんな書き方をしてました…。よろしくないですね…我ながら…。

ということで、CSSでの書き方をめもめも。

画像は最初から表示しておく画像と置換後の画像を一つにまとめたものを作らねばなりません。

↑こんな感じに。

<div id="hoge">
<a href="#"><img alt="画像だよ" src="hoge.png" /></a>
</div>

</div>

#hoge a {
width:160px;
height:80px;
overflow:hidden;
display: block;
}
#hoge a:hover img {
margin-top:-80px;
}

#hoge a {

width:160px;

height:80px;

overflow:hidden;

display: block;

}

#hoge a:hover img {

margin-top:-80px;

}

overflow:hiddenで余計な部分を非表示にして
マウスオーバーした時に、上の方に画像を移動させると。＞margin-topで

サンプルがこちら。

IE6、7で見出し（h1とか）の下に謎の隙間が出来る件

IE6と7に爆発してほしい今日この頃( ´∀｀)
IE6、7で見出し（h1とか）の下に謎の隙間が出来るなんて…てっきりmarginなんだろうなーって思ってたらなんか違うんですよね。
で、まさか見出し下に隙間出来るとかあるわけ…（Google先生で検索）…あったよ( ﾟдﾟ)
“IE6、7で見出し（h1とか）の下に謎の隙間が出来る件” の続きを読む