ブログ

WEB制作に関する技術情報やサンプルコードからエクセルや
パワーポイントのお役立ち情報まで幅広くご紹介しています。

WordPress 特定のカテゴリーのタイトルをニュースティッカー表示

ブログのリニューアルに伴い、「これいい!パーツデザイン」の更新履歴をページニュースティッカーで表示することにしました。

見た目がふざけているのは、ご勘弁ください。。。

特定カテゴリーをリスト形式で出力

ニュースティッカーを表示させたい箇所に以下を追記。

<ul id="news_ticker_list">
<?php
	$lastposts = get_posts('numberposts=10&category=11');
	foreach($lastposts as $post) :
	setup_postdata($post);
	?>
	<li><a href="<?php the_permalink() ?>" rel="bookmark"><?php the_title(); ?></a></li>
<?php endforeach; ?>
</ul>

numberposts=●に表示させたい記事数を入力
category=●に表示させたいカテゴリーのIDを入力

ニュースティッカーとして動作させる

jQuery WebTicker」を使って、動作させます。

<script type="text/javascript">
jQuery.noConflict();
var j$ = jQuery;
j$(document).ready(function() {
	j$("#news_ticker_list").webTicker({
		travelocity: 0.04, //速さ
		direction: 1, //-1で逆に
	})
});
</script>

travelocity:●,に速度値を入力
direction: ●,で動作する方向を設定(「1」は←方向、「-1」は、→方向)

あとは、CSSで整形してください!

ちなみに当ブログでは、

ul.newsticker {
position: relative;
list-style-type: none;
margin: 0;
padding: 0;}

ul.newsticker li {
float: left;
margin: 0;
padding-left: 25px;
margin-left:40px;
padding-bottom:10px;
background: url(walking.gif) no-repeat 0 0;
}
投稿日
2012年10月15日
カテゴリー
WordPress, カスマイズ

コメントを残す

デザイン&メディア事業blow→in
[商工会議所オフィス]
大阪府泉佐野市市場西3-2-34-306
TEL.072-493-3358(代)
[日根野オフィス]
大阪府泉佐野市日根野3963-3-403
TEL.072-468-8786
アパレル&プリント事業DIGMO
HANDPURI
大阪府泉佐野市日根野4036-1
TEL.0120-610-322
ブランディング事業かつらぎフルーツ
和歌山県かつらぎ町東渋田325-4
TEL.090-3612-3401
飲食店事業cafeblow
大阪府泉佐野市日根野3963-3
TEL.090-5127-9187